How can I access master page text box from jquery file?

Question

In my master page i've a textbox.

 <asp:TextBox ID="SearchTextBox" runat="server" class="searchtxtbox" onfocus="HideSearchWaterMark();" Text="Search" onblur="ShowSearchWaterMark(this);" />

I added jquery references in code behind.

TextBox SearchTextBox = this.FindControl("SearchTextBox") as TextBox;
            StringBuilder objStringBuilder = new StringBuilder();
            objStringBuilder.Append("<script type=\"text/javascript\" language=\"javascript\">\n");
            objStringBuilder.AppendFormat("var searchTextBox = '{0}';\n", SearchTextBox.ClientID);
            objStringBuilder.Append("</script>\n");
            this.Page.ClientScript.RegisterClientScriptBlock(GetType(), "RegisterVariables", objStringBuilder.ToString());
this.Page.ClientScript.RegisterClientScriptInclude(this.GetType(), "Global", this.ResolveClientUrl("~/Resources/Scripts/Search.js"));
this.Page.ClientScript.RegisterClientScriptInclude(this.GetType(), "Global", this.ResolveClientUrl("~/Resources/Scripts/jquery-1.4.2.js"));
this.Page.ClientScript.RegisterClientScriptInclude(this.GetType(), "Global", this.ResolveClientUrl("~/Resources/TagsScripts/jquery.autocomplete.js"));

in Search.js i've the following methods to access the text box of master page:

$(document).ready(function () {
            $("#" + searchTextBox).autocomplete("Handlers/GenericHandler.ashx?tgt=12", {
                multiple: true,
                multipleSeparator: ";",
                mustMatch: false,
                autoFill: true
            });
        });


        function HideSearchWaterMark() {

    var control = $("#" + searchTextBox);
    if (control[0].className == "searchtxtbox ac_input")
        control[0].value = "";

    control[0].className = "searchtxtbox ac_input";
}

function ShowSearchWaterMark(tagsTextBox) {
    if (searchTextBox.value.length == 0) {
        searchTextBox.value = "Search";
        searchTextBox.className = "searchtxtbox ac_input";
    }

When i run my application i'm getting object reference not set error.

Please tell me where i need to change my code.

Answer 1

Inorder to access an element using id selector, inside a naming container you have to use ClientID and in a js file you won't be able to use that. So better try to get the element using the class name, something like

$("input:text.searchtxtbox")

Answer 2

You need to call FindControl on the Master page :

TextBox SearchTextBox = MasterPage.FindControl("SearchTextBox") as TextBox;

Have a look here

Answer 3

norder to access an element using id selector, inside a naming container you have to use ClientID and in a js file you won't be able to use that. So better try to get the element using the class name, something like

$("input:text.searchtxtbox")

link