How To Get Textbox Clientid In A Javascript Function Using Listview And Inserttamplate Or Edittemplate

I have a ListView with ItemTemplate, EditTemplate and InsertTemplate. There are several TextBoxes in Edit and InsertTemplate. I need to calculate some of the values in Javascript,

Solution 1:

Now that asp.net supports ClientIDMode "predictable" you can do this by adding an OnClientClick handler for the update button in the EditItemTemplate.

• Set the ListView's ClientIDMode to predictable.
• Set the ListView's ClientIDRowSuffix to the primary key for the row (e.g., ProductID for Northwind's Products table)
• Pass the product ID to the OnClientClick handler
• use document.getElementById to get the current value of the field.

For example, let's say you have ListView1 bound to Northwind's Products table. The primary key for Products is ProductID. The declarative syntax for the ListView is:

<asp:ListViewID="ListView1"runat="server"DataKeyNames="ProductID"DataSourceID="SqlDataSource1"ClientIDMode="Predictable"ClientIDRowSuffix="ProductID">

The EditItemTemplate's Update button's declarative syntax is:

<asp:Button ID="UpdateButton" runat="server" CommandName="Update" 
                        Text="Update" OnClientClick=<%# string.Format("ShowProductName('{0}');", Eval("ProductID")) %> />

And the OnClientClick handler javascript is:

<scripttype="text/javascript">functionShowProductName(prodId) {
        var prodNameTextBox = document.getElementById('ListView1_ProductNameTextBox_' + prodId);

        alert('product name is ' + prodNameTextBox.value);

        returnfalse;
    }
</script>

Note: Assumes that the product name is stored in a textbox named ProductNameTextBox. Change that to match the name of the textbox with the field you want. Predictable mode will result in an ID along the lines of ListView1_YOURFIELDNAMEHERE_PRODUCTIDHERE.

For details, see http://msdn.microsoft.com/en-us/library/dd410598(v=vs.100).aspx