Converting aspx page to WebUserControl

I am running into an issue when converting an ASPX page to a controller (ASCX). My JavaScript isn't finding a textbox in a hidden div and its not firing an onclick event either. However it works perfectly fine in the ASPX page.

My JavaScript is..

function FireEditClickButton() {
        document.getElementById("btnFireEdit").click();
    }

Its supposed to fire this button that is in a hidden div along with the next piece)

<asp:Button ID="btnFireEdit" runat="server" OnClick="btnFireEdit_Click" />

Then with this JavaScript

function GetSelection() {
        var c = document.getElementById("tbRA");
        c.innerText = checkListBox.GetSelectedValues();
        UpdateText();
    }

gets called everytime the checklistbox has values.

Both errors are saying that they are null but they are right here in a hidden div

<div style="visibility: hidden">
        <asp:TextBox ID="tbRA" runat="server"></asp:TextBox>
        <asp:Button ID="btnFireEdit" runat="server" OnClick="btnFireEdit_Click" />
    </div>

So why would this be happening since it works completely fine in the ASPX page? would it have to do with the WebUserControl not using a form tag?

Thanks

Solution

Your javascript cannot find the button because in the rendered HTML it no longer has id="btnFireEdit" but instead an id based on the name of the usercontrol (e.g. id="myctrlname_btnFireEdit").

You have two choices... either update the javascript to include the name of the usercontrol...

document.getElementById("myctrlname_btnFireEdit").click();
document.getElementById("<%=btnFireEdit.ClientID%>").click();

(Note, the 2nd of these two lines will only work if the javascript is part of the usercontrol itself. It will not work if the javascript is in an external .js file or the parent page)

Or use the ClientIDMode attribute of the <asp:Button> and set the value to Static. This will make the rendered HTML use id="btnFireEdit"...

<asp:Button ID="btnFireEdit" runat="server" OnClick="btnFireEdit_Click"
  ClientIDMode="Static" />