CODEWITHSUNDEEP
javascriptc#jqueryasp.net
kieron
kieron

Reputation: 342

Using script within ASPX page

so I have this code within an ASPX page. I am trying to use it within a text box in the same page, but no success. However, I can use the script within a text box in my master page? Any help would be appreciated, thanks 

<asp:Content runat="server" ID="FeaturedContent" 
ContentPlaceHolderID="FeaturedContent">

<script src="jquery-1.12.1.js"></script>
<script src="jquery-ui.js"> </script>
<link href="jquery-ui.css" rel="stylesheet" />

<script type="text/javascript">
    $(document).ready(function () {
        $('#txtStationName').autocomplete({
            source: 'StationHandler.ashx'
        });
    });
</script>

 <asp:TextBox ID="txtStationName" runat="server">
 </asp:TextBox>

Upvotes: 2

Views: 288

Answers (4)

Manish Singh
Manish Singh

Reputation: 1004

you have two option to work one is id another is class

<asp:TextBox CssClass="clstext" ID="txtauto" runat="server"> </asp:TextBox>

for class you use

$('.clstext').autocomplete({
source: 'StationHandler.ashx'

});

if you use id then

<asp:TextBox ID="txtStationName" runat="server" ClientIdMode="static">


$('.txtStationName').autocomplete({
source: 'StationHandler.ashx'
});

Upvotes: 0

Saurin Vala
Saurin Vala

Reputation: 1928

I suggest you to try with classname in your code

 <asp:TextBox CssClass="uniquetxtStationName" ID="txtStationName" runat="server">
 </asp:TextBox>

and use it in script :

$('.uniquetxtStationName').autocomplete({
    source: 'StationHandler.ashx'
});

Reason behind this : aspx will update all your ID of server tag, so you cant use actual ID of your tag in to javascript function directly.

Upvotes: 1

Kiran Shahi
Kiran Shahi

Reputation: 7980

Since your <asp:TextBox ID="txtStationName" runat="server"> is server side component. .NET will append certain value with your ID. There might be two solution for this condition.

1) You can use ClientIDMode="Static" to make the generated IDs consistent

<asp:Content runat="server" ID="FeaturedContent" 
ContentPlaceHolderID="FeaturedContent">

<script src="jquery-1.12.1.js"></script>
<script src="jquery-ui.js"> </script>
<link href="jquery-ui.css" rel="stylesheet" />

<script type="text/javascript">
    $(document).ready(function () {
        $('#txtStationName').autocomplete({
            source: 'StationHandler.ashx'
        });
    });
</script>

<asp:TextBox ID="txtStationName" runat="server" ClientIDMode="Static">
</asp:TextBox>

2) Or find the exact ID generated on DOM from developer console and use js on that element.

Upvotes: 5

monty
monty

Reputation: 1590

The ID of your textbox will be changed by the asp.net compiler. To prevent this you'll want to do:

<asp:TextBox ID="txtStationName" runat="server" ClientIdMode="static">

</asp:TextBox>

Upvotes: 2

Related Questions