jeff_suhr
asked on
VB.NET RaiseEvent in button component fires, but associated Javascript does not execute
I want to execute a javascript function upon button click, but I don't want to wire the Javascript function to the button's OnClick event. Thus, I've created a custom event within a button component and added the component to the web page with the goal of executing the Javascript function following several stored procedure calls. The RaiseEvent fires within the button component, but the Javascript never executes. The following code snippets are included below.
*------------------------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------*
XYZ_Button component code:
Namespace XYZ_button
<DefaultProperty("Text"), ToolboxData("<{0}:XYZ_Butt on runat=server></{0}:XYZ_But ton>")> Public Class XYZ_Button
Inherits System.Web.UI.WebControls. Button
#Region "Declarations"
Public Event ContactXYZ()
Public Sub Raise_Contact()
RaiseEvent ContactXYZ()
End Sub
#End Region
End Class
End Namespace
*------------------------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------*
.ASPX button code:
<%@ Register TagPrefix="cc1" Namespace="XYZ_Button.XYZ_ button" Assembly="XYZ_Button" %>
<tr class="AddToCartButton" id="TRXYZ" runat="server">
<td>
<cc1:XYZ_Button ID="XYZ" Text="Search" oncommand="XYZ_Search" CommandName="XYZ"
CommandArgument='<%# Container.DataItem("REWARD _ID") %>' Runat="server">
</cc1:XYZ_Button>
</td>
</tr>
*------------------------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------*
.ASPX.vb button code:
1) Instantiate the custom button
Protected WithEvents XYZ_Button1 As New XYZ_Button.XYZ_button.XYZ_ Button
2) Register the Javascript function with the custom event for the button component:
If Not bolShowButtonOrCall Then
If mstrGUID = String.Empty Then
objGUID = Guid.NewGuid
mstrGUID = objGUID.ToString
End If
XYZ_Button1.Attributes.Add ("OnContac tXYZ", "showXYZ(' " & mstrGUID & "')")
Endif
2) When the command for the button is fired, several stored procedure calls are executed culminating in the following
code snippet:
XYZ_Button1.Raise_Contact( )
*------------------------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------*
.ASPX Javascript code
<script language="javascript">
ifDiv = '<IFRAME ID="IFXYZ" class="panel" frameborder="0" style="display: inline;background-
color:orange;"></IFRAME>';
function showXYZ(strGUID)
{
document.getElementById('D IVMain').i nnerHTML = ifDiv;
document.getElementById('I FXYZ').src = 'http://XYZ.com/XYZRQ.cfm?data=' + strGUID;
}
</script>
*------------------------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------- ---------*
NOTE: The Javascript executes if I use the 'OnClick' event for a standard button. I don't understand why the Javascript won't execute even though the custom event fires. Please advise.
*-------------------------
XYZ_Button component code:
Namespace XYZ_button
<DefaultProperty("Text"), ToolboxData("<{0}:XYZ_Butt
Inherits System.Web.UI.WebControls.
#Region "Declarations"
Public Event ContactXYZ()
Public Sub Raise_Contact()
RaiseEvent ContactXYZ()
End Sub
#End Region
End Class
End Namespace
*-------------------------
.ASPX button code:
<%@ Register TagPrefix="cc1" Namespace="XYZ_Button.XYZ_
<tr class="AddToCartButton" id="TRXYZ" runat="server">
<td>
<cc1:XYZ_Button ID="XYZ" Text="Search" oncommand="XYZ_Search" CommandName="XYZ"
CommandArgument='<%# Container.DataItem("REWARD
</cc1:XYZ_Button>
</td>
</tr>
*-------------------------
.ASPX.vb button code:
1) Instantiate the custom button
Protected WithEvents XYZ_Button1 As New XYZ_Button.XYZ_button.XYZ_
2) Register the Javascript function with the custom event for the button component:
If Not bolShowButtonOrCall Then
If mstrGUID = String.Empty Then
objGUID = Guid.NewGuid
mstrGUID = objGUID.ToString
End If
XYZ_Button1.Attributes.Add
Endif
2) When the command for the button is fired, several stored procedure calls are executed culminating in the following
code snippet:
XYZ_Button1.Raise_Contact(
*-------------------------
.ASPX Javascript code
<script language="javascript">
ifDiv = '<IFRAME ID="IFXYZ" class="panel" frameborder="0" style="display: inline;background-
color:orange;"></IFRAME>';
function showXYZ(strGUID)
{
document.getElementById('D
document.getElementById('I
}
</script>
*-------------------------
NOTE: The Javascript executes if I use the 'OnClick' event for a standard button. I don't understand why the Javascript won't execute even though the custom event fires. Please advise.
ASKER
Hi raterus...thanks for looking at my issue. I did a view source after completing the render. Following is the HTML for one the XYZ_Buttons (I am dynamically building the button inside a datalist of approximately 15 datalist items):
<tr id="dlReward__ctl0_XYZ" class="AddToCartButton">
<td align="center">
<input type="submit" name="dlReward:_ctl0:XYZ" value="Search" id="dlReward__ctl0_XYZ"
OnContactXYZ="showXYZ(' 1*b18ad4d7-448c-4885-bd97- d071b682ce 54')" />
</td>
</tr>
So while the event and action are built, it never executes because? That is where my level of understanding is lacking. If the event (OnContactXYZ) can be trapped and the action assigned (ShowXYZ), why won't it execute? I appreciate anything you can provide to aid my understanding.
Thanks.
<tr id="dlReward__ctl0_XYZ" class="AddToCartButton">
<td align="center">
<input type="submit" name="dlReward:_ctl0:XYZ" value="Search" id="dlReward__ctl0_XYZ"
OnContactXYZ="showXYZ(' 1*b18ad4d7-448c-4885-bd97-
</td>
</tr>
So while the event and action are built, it never executes because? That is where my level of understanding is lacking. If the event (OnContactXYZ) can be trapped and the action assigned (ShowXYZ), why won't it execute? I appreciate anything you can provide to aid my understanding.
Thanks.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
XYZ_Button1.Attributes.Add
This results in this being rendered to the browser
<input type="button" OnContactXYZ="showXYZ(...)
You can't arbitrarily add event handlers to standard buttons in JavaScript, if you want to run an event, you have to do it through onclick=""