innertext, javascript, datagrid, database update

[Guest]

I have a web page writen in ASP.NET that contains some javascript so that
when a user presses a button, or edits a certain field in a datagrid, another
cell in the datagrid is filled with a value.

My probelm.... when I have the user press the update button (which does a
post back that loops through the datagrid and updates a database) the
field/cell that is filled by the javascript appears to be blank in my update
code, even though I can see it on the screen.

My java script code that populates the desired cell (this works);

function AddRequesterName(imgObj)
{
imgObj.parentNode.parentNode.childNodes(8).innerText=UserName.outerText;
}

My code in the VB.NET that updates the database;

Dim strEntryID As String = dgi.Cells(11).Text

This works for all the other fields in the grid, except this one? The reason
why it is cell(11) is because there are 3 hidden cells in the display.

I have a felling it has something to do with innertext and referencing
cell.text, but the cells attribute doesn't have an innertext.

Any help on this?

Lyners

 

[Guest]

In VS.net, use the debugger to step through the code and examine the value of
dgi.Cells(11).Controls.count. Are there other controls in this cell? The
value you are looking for might be in one of those controls rather than in
the Text property of the cell itself.

HTH

 

[Guest]

Hi Phillip,
I did the dgi.Cells(11).Controls.count and got a result of 0. I tried
attributes too only to get a zero value for that. I don't have any controls
in the datagrid cell. I am just loading the cells innertext with the users id
for everyline that they modify.

What I want to have happen is when they "update" the page via a postback
that the cell value is passed back to the server so the code can update the
userid field in the database. it appears that the cell is not passing back
any values.

Any suggestions on a better way to code this, or how to make this work?

 

[Guest]

Hello Lyners,

In this very simple demo, I copy the value and am still able to retrieve it
upon postback: http://www.societopia.net/samples/datagrid_2.aspx

Maybe there is a step in your code that is resetting this value.

BTW, did you find out why the image title was not working when you moved the
mouse over the copy image in the last example (in a previous thread on this
issue)?

 

[Guest]

One more check you can do:
1- add in your AddRequesterName javascript function the following line to
verify that you are copying the value to the correct control:
alert("tagName= " + imgObj.parentNode.parentNode.childNodes(8).tagName + "
ID = " + imgObj.parentNode.parentNode.childNodes(8).id );

Does the alert message show the proper tagName and id that you are supposed
to copy to?

Phillip Williams
http://www.societopia.net
http://www.webswapp.com

 

[Guest]

Hell Lyners,

I missed picking on something in your response. You said that there were no
controls in the cell! Well, that explains it.

You need to have controls in the cell. If you are copying the data to a
cell that is databound to the grid, e.g. <asp:BoundColumn>, then you will
certainly not get its changed value upon postback because it is only
represented by a regular HTML <TD> tag that does not carry a value upon
posting back the form.

What you need to do is to use the <asp:TemplateColumn> as I did in the demo
I gave you its link to create an <Input> control on the form that can carry
the value back upon posting the form.

HTH
Phillip Williams
http://www.societopia.net
http://www.webswapp.com

 

[Guest]

Hell Lyners,

OOps! That should have read "Hello". My apology for the typo.

 

[Guest]

Hi Phillip,
I got the mouseover to work. I also have the text box being filled with the
correct value. ... Thanks! My next step is to also populate another field in
the datagrid (non-textbox) with the user ID. I have the user name being
populated correctly, but when the user presses the update button, I want to
copy the user name into the database for the records that they modified. The
field is coming across blank.

Here is my java script code:

function CopyTotal(imgObj)
{
imgObj.parentNode.childNodes(1).value=imgObj.parentNode.parentNode.childNodes(6).innerText;

imgObj.parentNode.parentNode.childNodes(8).innerText=UserName.outerText;

alert("tagName= " + imgObj.parentNode.parentNode.childNodes(8).tagName + "ID
= " + imgObj.parentNode.parentNode.childNodes(8).id );
}


function AddRequesterName(imgObj)
{
imgObj.parentNode.parentNode.childNodes(8).innerText=UserName.outerText;

alert("tagName= " + imgObj.parentNode.parentNode.childNodes(8).tagName + "ID
= " + imgObj.parentNode.parentNode.childNodes(8).id );
}

This works and copies the user name and the value in the appropriate fields.
The alert tag comes back with a TAG of TD and an ID of Nothing.

My code for copying the valued and updating the database looks like this;

Dim strField1 As String = dgi.Cells(5).Text <--Works
Dim strField2 As String = dgi.Cells(7).Text <--Works
Dim strUserID As String = dgi.Cells(11).Text <--Doesn't work, comes up blank
Dim dblAmount As Double = CType(dgi.FindControl("txtAmount"), TextBox).Text
<--Works (text box)

Your example is almost like what I am looking for. You would have to add
another field and have the new field poulated with username or something on
textbox change. Then when you press the update button, update the database
with the description that is in the datagrid field (not a textbox).

What am I missing?

Thanks

 

[Guest]

Hi Phillip, ....
Your example is almost like what I am looking for. You would have to add
another field and have the new field poulated with username or something on
textbox change. Then when you press the update button, update the database
with the description that is in the datagrid field (not a textbox).

What am I missing?

Hi Lyners,

As I mentioned in another response, the "datagrid field" renders as a
regular HTML <td> tag. The datagrid binds the value of this <td> from the
underlying datasource and stores the viewstate on the page for retrieval upon
postback. (If you right-mouse click on the web page to view the source you
will see <input type="hidden" name="__VIEWSTATE"> with an encrypted value)

When you change the td’s innerText attribute you are not changing the
Viewstate of this cell, you simply changing its display on the browser. The
viewstate, however, is what determines the value in this cell upon postback.
The display of the cell is lost.

You can produce the same effect by adding an <asp:TemplateColumn> that
contains a TextBox as I did in the sample I gave you then style that textbox
(using the cssClass attribute) to make it appear on the browser without the
border as if it were a regular cell. The difference is that unlike the
regular datagrid cell, this textbox would carry back the value upon postback.

HTH,
Phillip Williams
http://www.societopia.net
http://www.webswapp.com

 

[Guest]

Got it Phillip. Now I am playing with the cssClass so it looks like the resr
of the datagrid. One question, How do I make the second textbox so that the
user cannot tab into it? I tried enable = no, but then the data doesn't get
posted back. I have it working the way I want, except for it tabbing into the
read only text box.

Thanks for everything!

 

[Guest]

Got it Phillip. Now I am playing with the cssClass so it looks like the resr
of the datagrid. One question, How do I make the second textbox so that the
user cannot tab into it? I tried enable = no, but then the data doesn't get
posted back. I have it working the way I want, except for it tabbing into the
read only text box.

TabIndex = -1

Thanks for everything!

You are welcome.

Phillip Williams
http://www.societopia.net
http://www.webswapp.com

 

[Guest]

TabIndex = -1

Actually TabIndex would only prevent tabbing in sequence but it would not
prevent the user from typing in the textbox. I think that if you want to
prevent the user from typing you would have to change (using the same
Javascript) the value in a databound cell and create your own viewstate
management for this cell by adding an <Input type="hidden" runat=server>.

I modified our earlier adventure to look like this:
http://www.societopia.net/samples/datagrid_4.aspx

Phillip Williams
http://www.societopia.net
http://www.webswapp.com

 

[Guest]

Actually TabIndex would only prevent tabbing in sequence but it would not
prevent the user from typing in the textbox.

Ok, on second thought ... A readonly=true textbox would do just fine in
preventing the reader from typing in. I guess my second attempt is just
another way of doing it. My apology for responding to myself twice.

 

[Guest]

Thanks Phillip, worked great. It is exactly what I was trying to do.