Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions

Embedding Forms in a GridView

Posted on 2007-03-28
Last Modified: 2008-01-09

I have an ASP.NET 2.0 page with a GridView on it, populated programmatically from the code-behind.

Each GridView row displays a unique object. I'd like each row of the GridView to have it's own little form that submits to another page, where a user can edit the object.

To accomplish this, I've inserted the following code into one of the template fields:

                    <form id="frmEditObject<%# Eval("ObjectID") %>" action="editObject.aspx" method="POST">
                    <input type="hidden" name="ObjectID" value="<%# Eval("ObjectID") %>" />
                    <a href="javascript: document.forms['frmEditObject<%# Eval("ObjectID") %>'].submit();" class="edit">EDIT</a>

This works great, EXCEPT for two things:

First, the first row's EDIT button throws the following JavaScript error:

Error: 'document.forms.frmEditObject1' is null or not an object.

I know its there because I can see it in the page source after the page loads.

Second, I have a custom footer with alphabet letters A - Z that allow the user to display only objects of one letter at a time. Like, they click on A and see Apple, Airplane, Angle, Aurora, etc. These links BREAK when I add form code to the GridView rows, and when you click on them, they throw this error:

Invalid postback or callback argument.  Event validation is enabled using <pages enableEventValidation="true"/> in configuration or <%@ Page EnableEventValidation="true" %> in a page.  For security purposes, this feature verifies that arguments to postback or callback events originate from the server control that originally rendered them.  If the data is valid and expected, use the ClientScriptManager.RegisterForEventValidation method in order to register the postback or callback data for validation.

Here's what I think: I think that the form code I've inserted into the rows is interfering with the parent ASP.NET page form. So, when the page gets to the first row, it's already seen <form name="aspnetForm"> and now it's seeing <form id="frmEditObject1"> and it's getting confused. Then, it sees the </form> in my first row, and afterwards everything is fine (all the subsequent rows work), but, this breaks the aspnetForm, and so my alphabet links at the bottom, which are postbacks, also break.

Whew, long post.

Anyhow, what's the solution for this problem? Is it even correct to embed HTML forms in a GridView, or is there a different way I should be doing this?
Question by:CMES-IT
  • 5
  • 3
LVL 37

Expert Comment

ID: 18809087
>>Is it even correct to embed HTML forms in a GridView, or is there a different way I should be doing this?
No, not really.  the ASP.Net model allows for one form with runat=server tag...and it's all you should really need...

what is your dynamic form doing?
                    <form id="frmEditObject<%# Eval("ObjectID") %>" action="editObject.aspx" method="POST">
                    <input type="hidden" name="ObjectID" value="<%# Eval("ObjectID") %>" />

does editObject.aspx do some processing based on the ObjectID?
Why can't you just do the processing on the same page?

Author Comment

ID: 18809166
The form should take the user to the editObject.aspx page that I've already created. This GridView only displays some basic info - Object Name, Object ID, etc. the editObject.aspx page allows the user to edit all of the objects' properties, about 50. There are multiple ways to get to the editObject.aspx page, and it's already somewhat complicated itself, so I don't want to embed all of it's functionality in this GridView page.

What I want is a list of the objects, each in a row, with basic information, and a button that says "Edit" and goes to the edit page, passing the ObjectID, which doesn't seem like it should be a big deal. I don't really care how I accomplish that functionality, as long as the two pages stay separate, so if there's a better way than embedding forms, please let me know.
LVL 37

Expert Comment

ID: 18809237
>>What I want is a list of the objects, each in a row, with basic information, and a button that says "Edit" and goes to the edit page, passing the ObjectID

How does the editObject.aspx page catch the ObjectID variable?
querystring, session, request("ObjectID") etc...
Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.


Author Comment

ID: 18809962
It does a Request("ObjectID").


Author Comment

ID: 18815644
I can use a built-in object, and use the PostBackURL behavior to change where the form goes, but then I don't know a good way to get the ObjectID to the new page.

For instance:

            <asp:TemplateField HeaderText="&#160;">
                    <asp:LinkButton ID="btnChooseObject" runat="server" CssClass="edit" PostBackUrl="editObject.aspx">EDIT</asp:LinkButton>
                    <input type="hidden" name="ObjectID" value="<%# Eval("ObjectID") %>" />

That would work fine, except that it doesn't have a way of posting a unique ObjectID to the editObject.aspx page. For instance, if there are 5 objects in the GridView, with IDs from 1 to 5, the value of the hidden ObjectID field posted to the editObject.aspx page will be "1,2,3,4,5" instead of a single value.

If we could overcome that hurdle, then I could work within the constraints of the single-form model.

Author Comment

ID: 18815682
For instance, one solution to that might be to have a radio button for each GridView row, and then put a "Submit" button at the bottom of the page, but that adds an extra click to everything.

Another solution might be to make the Edit button be a link, where the objectID is passed via the Query String. But that's a little less secure, and a lot less elegant.

I know there needs to be a way to do this with a single form-based button. I'm just too new to .NET to know the solution.
LVL 37

Accepted Solution

samtran0331 earned 500 total points
ID: 18816203
sorry...I haven't had time to work up an example for you...but this can be done using a linkbutton in your templatefield instead of the "forms"...the linkbutton renders as an html link, but it gives you codebehind access "onclick" event to which, you would do a server.transfer to your editObject.aspx page.
Using server.transfer retains the variables on the gridview page and passes the same variables to the edit page...which lets you continue using request("...")
also..your objectid (if it is a primary key from the database) you can use the datakey property to pass the value...
sorry...all that might not make sense...lol...but maybe it's enough keywords for you to look into until I can work up a basic example?
google things like:
"gridview linkbutton"
"asp.net server.transfer"
"gridview datakeys"

Author Comment

ID: 18818406
I've solved this in a much easier manner than all that. It's not the most elegant... but it works.

Here's what I did:

At the top of the form, I added this:

    <input type="hidden" name="ObjectID" value="" />
    <asp:LinkButton ID="lbRedirect" runat="server" PostBackUrl="editObject.aspx" />

For the Edit Button field, in the GridView, I have this:

            <asp:TemplateField HeaderText="&#160;" >
                    &nbsp;<a href="javascript: editObject(<%# Eval("ObjectID") %>);" class="edit">EDIT</a>

Then, I added this JavaScript at the bottom of the page:
    <script language="JavaScript" type="text/javascript">
        function editObject(intObjectID) {
            theForm.ObjectID.value = intObjectID;
            WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions('lbRedirect', '', false, '', 'editObject.aspx', false, true));
    // -->

I started with having the LinkButton be in the GridView, and then trying to have the JavaScript trigger the LinkButton using the Click() command, but for some reason, I couldn't get JavaScript to find it via getElementById or otherwise. So, I just looked in the code to see the structure of Microsoft's PostBack code, and added it to my JavaScript code. I tried to do the whole thing without the LinkButton, but that object is required for some reason, and even though I'm not using it, it has to be on the page for the PostBack to work.

I'm closing this out, but I'll give you the points for helping me.


Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I recently went through the process of creating a Calendar Control of events with the basis of using a database to keep track of the dates that are selectable, one requirement was to have the selected date pop-up in a simple lightbox.  At first this…
It was really hard time for me to get the understanding of Delegates in C#. I went through many websites and articles but I found them very clumsy. After going through those sites, I noted down the points in a easy way so here I am sharing that unde…
This video shows how to quickly and easily add an email signature for all users on Exchange 2016. The resulting signature is applied on a server level by Exchange Online. The email signature template has been downloaded from: www.mail-signatures…
Established in 1997, Technology Architects has become one of the most reputable technology solutions companies in the country. TA have been providing businesses with cost effective state-of-the-art solutions and unparalleled service that is designed…

860 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question