Click here to Skip to main content
11,643,493 members (74,403 online)
Rate this: bad
good
Please Sign up or sign in to vote.
See more: C#2.0 ASP.NET
I am using two javascript functions inside the updatepanel,
1) Calendar
2) Autocomplete

I want to put all this page controls inside the Update panel. If i remove the Updatepanel then javascript will work else it won't. How can i make it work the javascript inside updatepanel.

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
                <ajax:ScriptManager id="ScriptManager1"  runat="server">
                 
<ajax:UpdatePanel id="UpdatePanel1"  runat="server">
<contenttemplate>
<link rel='stylesheet' href="../Calendar/calendar.css" title='calendar'/>
<script type="text/javascript" language="javascript" src="../Calendar/calendar.js"></script>
 <script src="../scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="../Scripts/jquery.autocomplete.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $("#<%=txtSearch.ClientID%>").autocomplete('../Search_CS.ashx');
    }); 
</script>
 
<asp:TextBox ID="txtDte" runat="server" CssClass="textbox" Enabled="False" ReadOnly="True"><img id="imgDte"  runat="server" align="middle"
                    alt=""  önmouseover="fnInitCalendar(this, 'txtDte', 'style=calendar.css,close=true')"
                    src="../Calendar/cal.gif" visible="false" />
 
<asp:TextBox ID="txtSearch" runat="server" CssClass="textbox"
                TabIndex="1" Width="300px">
</contenttemplate>
Posted 9-Sep-12 20:38pm
Robymon1.2K
Edited 9-Sep-12 20:40pm
__TR__29K
v2
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 2

'$(document).ready' fires ONLY when the page loads completely or after full postbacks. Since you are using it inside the UpdatePanel which does a partial postback, it will NOT be fired.

Place the Javascript outside the UpdatePanel, it will work...
  Permalink  
Comments
Robymon at 10-Sep-12 3:37am
   
Yes, it is working now. But $(document).ready(function() works only once( first time the page loads ), it is not working if we click any button or any server side event.
aspnet_regiis at 10-Sep-12 9:16am
   
Great.. I am glad I could help you
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 1

It's probably the same conflict that happens between jquery and updatepanels. Here you're using jquery, but I am sure it's the same type of issue. Basically the updatepanel is not refreshing the entire DOM so the other js library's functions never get called. Refer the link below for the similar thread:
Conflicts between ASP.NET AJAX UpdatePanels & jQuery functions[^]


--Amit
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 3

javascript is run only for single time when pageloads if you want to access javascript in the update panel then you need to use this

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequestHandler)
Sys.WebForms.PageRequestManager.getInstance().remove_endRequest(endRequestHandler)

GO TO THIS URL
Link
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 4

  Permalink  

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
0 jyo.net 480
1 OriginalGriff 475
2 DamithSL 378
3 Sergey Alexandrovich Kryukov 270
4 CPallini 222
0 DamithSL 541
1 OriginalGriff 495
2 Mika Wendelius 469
3 Sergey Alexandrovich Kryukov 330
4 Afzaal Ahmad Zeeshan 324


Advertise | Privacy | Mobile
Web02 | 2.8.150731.1 | Last Updated 23 Feb 2013
Copyright © CodeProject, 1999-2015
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100