Search code examples
javascriptasp.netwebformsascxregisterstartupscript

Registering script with User Control


I have an asp.net webforms application that I am working on. It uses a main aspx page to create a layout, and then uses ascx pages within a panel to display data.

What I need to do is use javascript with a user control (ascx files).

I thought that having a script manager on the main aspx page would allow me to register scripts in the Page_Load function on the .ascx pages.

Here is a basic example of what I am trying to do:

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs)

    Dim csConsoleLogSomething As String = "ConsoleLogSomethingScript"
    Dim consoleLogScript As String = "function logSomething() {  console.log('SOMETHING'); }"
    Dim cs As ClientScriptManager = Me.Page.ClientScript
    cs.RegisterStartupScript(Me.GetType(), csConsoleLogSomething, consoleLogScript, True)
    'I have also tried using: Dim cs As ClientScriptManager = Me.Parent.Page.ClientScript

End Sub

Here is the HTML on the ascx page:

<table width="100%" cellpadding="0" cellspacing="0" style="margin: 0px;">
    <tr>
        <td>
            <input id="btnWTF" type="button" onclick="logSomething()" value="DO SOMETHING FOR THE LOVE OF MOSES" />
        </td>
    </tr>
</table>

Here is the script manager declaration on the main aspx page:

<asp:ScriptManager ID="ScriptManager1" runat="server" EnableTheming="True" EnablePageMethods="true">
</asp:ScriptManager>

I have also tried to create a simple alert to come up on the page load, but I cannot get any of my script to execute. When I push the button I get 'ReferenceError: logSomething is not defined'

Any help would be greatly appreciated.

For kicks I also just tried this method to no avail:

ScriptManager.RegisterStartupScript(Button1, Button1.GetType(), csConsoleLogSomething, consoleLogScript, True)

The buttons HTML:

<asp:Button ID="Button1" runat="server" Text="Button"/>

This resulted in a post to the main aspx page. Nothing was logged to the console. If possible I would like to stay away from asp controls. The end goal is to get jQuery integrated into this application.


Solution

  • I believe I've reached the result you wanted.

    My Aspx:

    <form id="form1" runat="server">
            <asp:ScriptManager ID="ScriptManager1" runat="server" EnableTheming="True" EnablePageMethods="true">
            </asp:ScriptManager>
            <div>
                <table width="100%" cellpadding="0" cellspacing="0" style="margin: 0px;">
                    <tr>
                        <td>
                            <input id="btnWTF" type="button" onclick="logSomething()" value="DO SOMETHING FOR THE LOVE OF MOSES" />
                        </td>
                    </tr>
                </table>
            </div>
        </form>
    

    My codebehind:

     Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
            ScriptManager.RegisterStartupScript(Page, Page.GetType(), Guid.NewGuid().ToString(), "function logSomething() {  alert('SOMETHING'); }", True)
     End Sub
    

    Probably your call to the ScriptManager as object wasn't correct. You don't need to add the ScriptManager to a variable, you just call it directly through the ScriptManager object.