$('#<%= txtFirstName.ClientID%>').show();

Trying to send ClientId to external Javascript file using server tags as a parameter

<input type="text" ID="txtFirstName" runat="server" maxlength="50"
                    class="DefaultTextbox" style="width:180px;"
                    value="First Name" 
                    onfocus="ControlOnFocus('First Name',$('#<%= txtFirstName.ClientID%>').show())"
                    onblur="ControlOnBlur('First Name')"/>

function ControlOnFocus(CompareString,ControlId)
{
    alert(ControlId);

}

$('#<%= txtFirstName.ClientID%>').show();

Trying to send ClientId to external Javascript file using server tags as a parameter

<input type="text" ID="txtFirstName" runat="server" maxlength="50"
                    class="DefaultTextbox" style="width:180px;"
                    value="First Name" 
                    onfocus="ControlOnFocus('First Name',$('#<%= txtFirstName.ClientID%>').show())"
                    onblur="ControlOnBlur('First Name')"/>

function ControlOnFocus(CompareString,ControlId)
{
    alert(ControlId);

}

• asp
• javascript
• jquery
• asp-3.5

Share Follow edited Dec 23, 2009 at 11:57 RickNZ 18.7k33 gold badges5353 silver badges6767 bronze badges asked Dec 23, 2009 at 11:04 Shantanu GuptaShantanu Gupta 21.1k5656 gold badges186186 silver badges293293 bronze badges

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 7

$() is a short alias for the main jQuery function, also called jQuery(). You pass it a CSS selector, and in CSS, # means "the HTML element with ID...". That ID is in the ClientID variable in this program, apparently. The show() call then makes the named HTML element appear.

It seems your script uses jQuery.

$('#<%= txtFirstName.ClientID%>').show() will return the jQuery object containing the element with attribute id=<%=txtFirstName.ClientID%>, and not the ClientID value.

I guess what you really mean is this :

<input type="text" ID="txtFirstName" runat="server" maxlength="50"
                    class="DefaultTextbox" style="width:180px;"
                    value="First Name" 
                    onfocus="ControlOnFocus('First Name','<%= txtFirstName.ClientID%>')" // <= pass only the ClientID to your function
                    onblur="ControlOnBlur('First Name')"/>

function ControlOnFocus(CompareString,ControlId)
{
    $('#'+ControlId).show(); // <= do the show action here, in your function
    alert(ControlId);

}

Bud, $ is an alias for some javascript framework like jquery or prototype, the # represents an ID at the DOM. Just like CSS, those frameworks allow you to select elements using CSS syntax (. for classes, # for ids, etc). So $("#test") works almost like getElementById('test')

The jQuery syntax always begins with $, the # indicates that function show() is to be applied on the element whose Id is provided. Lets say the id is txtFirstName, then writing $('#txtFirstName') is equivalent to document.getElementById('txtDirstName') in classic Javascript. This will select the element from the Document Object Model(DOM) by the id provided. Once the element is selected, different jQuery functions can be executed on that reference. The show function makes the control/element visible. Similarly you can use .hide() to hide the element.