We help IT Professionals succeed at work.
Get Started

Datagrid UpdateCommand event not firing when button is assigned a javascript onclick event in Edit Item row using asp.net

Elucid8
Elucid8 asked
on
618 Views
Last Modified: 2010-04-21
Hi Experts,

I am creating a page with a standard edit item style datagrid. I have added a button to perform a javascript function which I need to dynamically pass the name of controls to. The problem I am having is if I put the dynamic onclick event in the code behind, it stops the grid from firing the postback event for the update button. I am not sure what is happening.

Upon looking at the html source generated I noticed that if I add the onclick event in the VB code behind, it causes the edit item controls to not include the datagrid prefix ("DataGrid1:_ctl4:" in this case). Could this be why the update event does not fire? How can I fix this? I can't even hard code the javascript onclick event into the aspx page because not adding the onclick causes the prefix to be added which is different for each row. Am I using the wrong type of button for this? I am using an HTMLInput button as the ASP button I was using was posting back which I didn't want it to do.

I have included the 2 html generated sources for the edit item depending on if I add the onclick event or not. Attached is also the code I use to assign the onclick event. To test it, I comment out the lines which assign the onclick event and it then allows postback upon clicking the update button. This is very strange.

Onclick added:

=============================================================================
<tr class="GridEditItem">
<td>
      <input type="submit" name="btnUpdateddl" value="Save" id="btnUpdateddl" />&nbsp;
      <input type="submit" name="btnCancelddl" value="Cancel" id="btnCancelddl" />
</td><td>
      <input name="uxCurrencyCode" type="text" id="uxCurrencyCode" style="width:60px;" />
</td><td>
      <input name="uxDescription" type="text" id="uxDescription" style="width:140px;" />
</td><td align="center">
      <input name="uxSymbol" type="text" id="uxSymbol" style="width:20px;" />
</td><td align="center">
      <input name="uxDelimiter" type="text" id="uxDelimiter" style="width:20px;" />
</td><td align="center">
      <input name="uxDecimalPoint" type="text" id="uxDecimalPoint" style="width:20px;" />
</td><td align="center">
      <input name="uxDecimalPlaces" type="text" id="uxDecimalPlaces" style="width:20px;" />
</td><td>
    <input name="btnCreateFormats" type="button" id="btnCreateFormats" value="Create Formats" style="width=108" onClick="javascript:return
generateCurrencyFormat('uxCurrencyFormat','uxCurrencyFormatExcel','uxCurrencyFormatActiveReport','uxSymbol','uxDelimiter','uxDecimalPoint','uxDecimalPlaces');" />
</td><td>
      <input name="uxCurrencyFormat" type="text" id="uxCurrencyFormat" style="width:160px;" />
</td><td>
      <input name="uxCurrencyFormatExcel" type="text" id="uxCurrencyFormatExcel" style="width:160px;" />
</td><td>
      <input name="uxCurrencyFormatActiveReport" type="text" id="uxCurrencyFormatActiveReport" style="width:160px;" />
</td><td align="center">
      <span style="width:20px;"><input id="uxCurrencyInverted" type="checkbox" name="uxCurrencyInverted" /></span>
</td>
</tr>


=====================================================================
Onclick Not Added:

<tr class="GridEditItem">
<td>
      <input type="submit" name="DataGrid1:_ctl4:btnUpdateddl" value="Save" id="DataGrid1__ctl4_btnUpdateddl" />&nbsp;
      <input type="submit" name="DataGrid1:_ctl4:btnCancelddl" value="Cancel" id="DataGrid1__ctl4_btnCancelddl" />
</td><td>
      <input name="DataGrid1:_ctl4:uxCurrencyCode" type="text" value="BEN" id="DataGrid1__ctl4_uxCurrencyCode" style="width:60px;" />
</td><td>
      <input name="DataGrid1:_ctl4:uxDescription" type="text" value="Benji Dollars" id="DataGrid1__ctl4_uxDescription" style="width:140px;" />
</td><td align="center">
      <input name="DataGrid1:_ctl4:uxSymbol" type="text" value="#" id="DataGrid1__ctl4_uxSymbol" style="width:20px;" />
</td><td align="center">
      <input name="DataGrid1:_ctl4:uxDelimiter" type="text" value="." id="DataGrid1__ctl4_uxDelimiter" style="width:20px;" />
</td><td align="center">
      <input name="DataGrid1:_ctl4:uxDecimalPoint" type="text" value="," id="DataGrid1__ctl4_uxDecimalPoint" style="width:20px;" />
</td><td align="center">
      <input name="DataGrid1:_ctl4:uxDecimalPlaces" type="text" value="3" id="DataGrid1__ctl4_uxDecimalPlaces" style="width:20px;" />
</td><td>
    <input name="DataGrid1:_ctl4:btnCreateFormats" type="button" id="DataGrid1__ctl4_btnCreateFormats" value="Create Formats" style="width=108" />
</td><td>
      <input name="DataGrid1:_ctl4:uxCurrencyFormat" type="text" value="ggg" id="DataGrid1__ctl4_uxCurrencyFormat" style="width:160px;" />
</td><td>
      <input name="DataGrid1:_ctl4:uxCurrencyFormatExcel" type="text" value="ggg" id="DataGrid1__ctl4_uxCurrencyFormatExcel" style="width:160px;" />
</td><td>
      <input name="DataGrid1:_ctl4:uxCurrencyFormatActiveReport" type="text" value="ggg" id="DataGrid1__ctl4_uxCurrencyFormatActiveReport" style="width:160px;" />
</td><td align="center">
      <span style="width:20px;"><input id="DataGrid1__ctl4_uxCurrencyInverted" type="checkbox" name="DataGrid1:_ctl4:uxCurrencyInverted" checked="checked" /></span>
</td>
</tr>
'Here I add my dynamic onclick event.
Protected Sub DataGrid1_ItemCreated(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles DataGrid1.ItemCreated
 
            If e.Item.ItemType = ListItemType.EditItem Then
                Dim _Format As Control = e.Item.FindControl("uxCurrencyFormat")
                Dim _FormatExcel As Control = e.Item.FindControl("uxCurrencyFormatExcel")
                Dim _FormatActiveReports As Control = e.Item.FindControl("uxCurrencyFormatActiveReport")
 
                Dim _Symbol As Control = e.Item.FindControl("uxSymbol")
                Dim _Delimiter As Control = e.Item.FindControl("uxDelimiter")
                Dim _DecimalPt As Control = e.Item.FindControl("uxDecimalPoint")
                Dim _DecimalPlaces As Control = e.Item.FindControl("uxDecimalPlaces")
                Dim _EditBtn2 As HtmlInputButton = CType(e.Item.FindControl("btnCreateFormats"), HtmlInputButton)
 
                _EditBtn2.Attributes.Add("onClick", "javascript:return generateCurrencyFormat('" & _Format.ClientID & "','" & _FormatExcel.ClientID & "','" & _FormatActiveReports.ClientID & _
                                         "','" & _Symbol.ClientID & "','" & _Delimiter.ClientID & "','" & _DecimalPt.ClientID & "','" & _DecimalPlaces.ClientID & "');")
            End If
 
        End Sub

Open in new window

Comment
Watch Question
This problem has been solved!
Unlock 2 Answers and 4 Comments.
See Answers
Why Experts Exchange?

Experts Exchange always has the answer, or at the least points me in the correct direction! It is like having another employee that is extremely experienced.

Jim Murphy
Programmer at Smart IT Solutions

When asked, what has been your best career decision?

Deciding to stick with EE.

Mohamed Asif
Technical Department Head

Being involved with EE helped me to grow personally and professionally.

Carl Webster
CTP, Sr Infrastructure Consultant
Ask ANY Question

Connect with Certified Experts to gain insight and support on specific technology challenges including:

  • Troubleshooting
  • Research
  • Professional Opinions
Did You Know?

We've partnered with two important charities to provide clean water and computer science education to those who need it most. READ MORE