Jquery autocomplete not working in asp.net - asp.net

Question

I have a content page in ASP.Net web app.
In that I am trying to use Jquery UI Autocomplete. But it does not work. What is wrong in this page? Here is my code:
<asp:Content ID="Content3" ContentPlaceHolderID="contentMainBody" runat="server" >
<link href="Atlas_Css/menu.css" rel="stylesheet" type="text/css" />
<link href="Atlas_Css/jquery.simplyscroll.css" rel="stylesheet" type="text/css" media="all" />
<link href="Atlas_Css/Jquery%20UI.css" rel="stylesheet" type="text/css" />
<script src="JS_AtlasFly/jquery.js" type="text/javascript"></script>
<script src="Scripts/Validations.js" type="text/javascript"></script>
<script src="JS_AtlasFly/jquery.simplyscroll.js" type="text/javascript"></script>
<script src="JS_AtlasFly/jquery.simplyscroll.min.js" type="text/javascript"></script>
<script src="JS_AtlasFly/js-image-slider.js" type="text/javascript"></script>
<script src="JS_AtlasFly/accordian.pack.js" type="text/javascript"></script>
<script src="JS_AtlasFly/jquery-1.9.1.js" type="text/javascript"></script>
<script src="JS_AtlasFly/jquery-ui.js" type="text/javascript"></script>
<script type="text/javascript">
window.onload = function ()
{
var availableTags = [ <%= PassFname %> ];
$("#txtFname" ).autocomplete({
source: availableTags
});
}
</script>
<div id="testDiv" runat="server">
<asp:Label ID="lblName" runat="server" Text="F Name"></asp:Label> <asp:TextBox ID="txtFname" runat="server"></asp:TextBox>
</div>
NOTE: the server side variable, PassFname, I am populating in code behind .
In a normal asp.Net page , without using master page (within the same project), Autocomplete works fine.
What is wrong in this page? is it because of master page?
What is the solution for this?
Since the same code behind code works in another page, I am not including it here. I have checked it here also, the string variable is populated on page load. Only autocomplete is not binding.
Any help will be appreciated.

Answer 1

I found the solution to this. I used the clientId of the TextBox directly in
Javascript.
like this:
$("#ctl00_contentMainBody_txtFname").autocomplete({
source: availableTags
});
that solved the binding of autocomplete with the textbox's id.
BTW, using <%=txtFname.ClientID%> doesnot solve the issue. Instead the page stops rendering.
So I used the client Id from page source, and it works.
Thanks to all