Javascript to set a hidden field value on change to an item in a Repeater

Hi Experts,
     Could you please give me an example of how to use Javascript to set a hidden field value on change to an item in a Repeater
JamesJMcDonnellAsked:
Who is Participating?
 
jnhorstConnect With a Mentor Commented:
Here's a thought.  In your aspx page, in the <head> section have a script block and set a variable like this:

<script language="javascript">
// note that this is not in a function.  it will scope to the page.
var cartChanged = false;
</script>

Your repeater should have something like an OnItemDataBounnd event that first for each item repeated.  You will have a text box being repeated by the repeater for the item qty.  Let's call this textbox "txtQty".  In the OnItemDataBound event, do this:

// "e" should be available from the event args.  resolve the text box.
TextBox tb = (textBox)e.Item.FindControl("txtQty");

// since cartChanged was declared in the <head> section outside of a funtion, you should be able to change it like this.
tb.Attributes.Add("onchange", "cartChanged = true;");

Then in the button you click to continue you can code up a client-side function to check that variable, and if it is true, prompt the user to first update the cart.

John

0
 
jeebukarthikeyanConnect With a Mentor Commented:
hi,
in this sample when u click on the server side check box it will fire script

private void grdAttachments_ItemDataBound(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
{
  CheckBox chk;
  if(e.Item.ItemIndex>=0)
  {
     chk=(CheckBox)e.Item.Cells[0].FindControl("CheckBox1");
    chk.Attributes.Add("Onclick","javascript:myfunction('" + e.Item.Cells[0].Text  + "')
    // in this i am passing a value in the zeroth cell to the javascript function

b u d d h a
0
 
jnhorstCommented:
Is your hidden field repeated in your repeater such that you have one hidden field for each item repeated?

John
0
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.

 
JamesJMcDonnellAuthor Commented:
Hi John, No there is just the one hidden field on the page
0
 
jnhorstCommented:
So each time you make a change in an item rendered by the repeater, you want to save something to this hidden field?

John
0
 
JamesJMcDonnellAuthor Commented:
No John, Just if there is at least one change.
On the page there are can be one to many items that have been added to a shopping cart. Each item has a quantity associated with it. The quantity is originaally defaulted and the customer can change it. There is a requirement to make the user click a button to update the cart if they make any changes to a quantity and another requirement to disable a 'continue' link until they have updated the cart if they have changed a quantity. So I thought to use a hidden field as an indicator and if it changes to 'on' to then disable the link until the update cart button is clicked. I now think it would be better to directly disable the link if the cart needs updating and dispense with the hidden field if this is as easy as changing a value in a hidden field.
0
 
jnhorstCommented:
Corrections:

"that first for each item..."  should have been "that fires for each item..."

John
0
 
JamesJMcDonnellAuthor Commented:
Thanks John - The page is a Master Page (in Asp.net 2.0)  and I don't know how to get a head section into it at the moment.
0
 
jnhorstCommented:
Just do it in the HTML of the page.  The <head></head> section goes before the <body></body> section.

John
0
 
JamesJMcDonnellAuthor Commented:
Thanks John, At present the page has aa <asp:Hyperlink> element rather than a button to continue. Is it possible to use this (simply disabling the link rather than putting out a message) rather than converting to a button and if so what would the code look like. Also when the user clicks on a button to run the update basket function what would the code look like to reset the variable?
0
 
jnhorstCommented:
Since your hyperlink is a server control you would access it in JavaScript by way of its ID attribute.  Current versions of IE and Firefox (I believe) support the function getElementById(), but older Firefox and Netscape do not, so what I will show you here may not work the same in all browsers.

Take this from my origin post:

// since cartChanged was declared in the <head> section outside of a funtion, you should be able to change it like this.
tb.Attributes.Add("onchange", "cartChanged = true;");

and add a statement to disable the link...

tb.Attributes.Add("onchange", "cartChanged = true; document.getElementById('linkid').disabled = true;");

This should disable the link when a change is made to the qty in the textbox.  Using this method, you may not even need the cartChanged variable.  Assuming the continue button is a server control button you would not need to worry about resetting anything because when the contrinue button is clicked and the page posts back, everything returns to its default.  The variable will return to false and the hyperlink will return to enabled.

John
0
 
JamesJMcDonnellAuthor Commented:
Hi John,

In header of master page I have:

<script type="text/javascript" language="javascript">
        // note that this is not in a function.  it will scope to the page.
        var cartChanged = false;
        </script>
In code behind for content page I have:

Dim tb As TextBox = e.Item.FindControl("txtDelegates")
tb.Attributes.Add("onchange", "cartChanged = true;")
tb.Attributes.Add("onchange", "cartChanged = true; document.getElementById('lnkCheckout').disabled = true;")

However, this not not disable the link. Not sure why using two attributes.add but with just 2nd also get no disabling.
0
 
jnhorstCommented:
I will need to do some checking on this later this evening.... just don't want you to think I have forgotten...  I will post later.

John
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.