Javascript not working inside Updatepanel

Question

0.00/5 (No votes)

See more:

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.

XML

<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

Robymon

Updated 9-Sep-12 20:40pm

__TR__

v2

Add a Solution

4 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

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

bbirajdar · Answer 1 · 2012-09-09T21:10:00

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...

Posted 9-Sep-12 21:10pm

bbirajdar

Comments

Robymon 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.

bbirajdar 10-Sep-12 9:16am

Great.. I am glad I could help you

_Amy · Answer 2 · 2012-09-09T20:50:00

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

raghav.softobiz · Answer 3 · 2012-09-09T21:23:00

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

VB

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

GO TO THIS URL
Link

Baxterboom · Answer 4 · 2013-02-22T21:22:00

Solution 4

Try this one AJAX UpdatePanel With Inline Client Scripts Parser[^]

Posted 22-Feb-13 21:22pm

Baxterboom

Javascript not working inside Updatepanel

4 solutions

Solution 2

Solution 1

Solution 3

Solution 4

Add your solution here

Preview 0