Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Execute javascript after a partial postback of an updatepanel?

I have a page that add tree file script to it .

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/init.js"></script>
<script type="text/javascript" src="js/easing.js"></script>

I have a updatepanel with a dropdownlist. When run SelectedIndexChanged event (partial postback of an updatepanel), don't execute javascript .

like image 612
Niloo Avatar asked Dec 26 '12 09:12

Niloo


4 Answers

Use the pageLoad function:

function pageLoad(sender, args) {
  InitialiseSettings();
}

function InitialiseSettings(){
    // replace your DOM Loaded settings here. 
    // If you already have document.ready event, 
    // just take the function part and replace here. 
    // Not with document.ready 
    $(element).slideUp(1000, method, callback});

    $(element).slideUp({
                   duration: 1000, 
                   easing: method, 
                   complete: callback});
}

Or, try adding an "end request" event handler with .add_endRequest():

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(InitialiseSettings)

Edit:

It would be a better idea for you to move your code from document.ready into InitialiseSettings(), and to then register it as a pageLoaded event handler.

Code Example

 Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(InitialiseSettings)
like image 159
Murali Murugesan Avatar answered Sep 27 '22 19:09

Murali Murugesan


To run your javascript in full and partial postbacks, put your javascript code into javascript pageLoad() function.

function pageLoad()
{
   //your javascript code
}

Example:

function pageLoad() {

    $(':submit').click(function () {
        CommodityArray();
    });
    $('#btn_image').click(function () {
       CommodityArray();
    });
    $(".repHeader").disableSelection();

    CommodityArray();
}

Hope it helps! :)

like image 34
Avishek Avatar answered Sep 27 '22 20:09

Avishek


You have to use following code after your update panel.

<script type="text/javascript" language="javascript">
var pageRequestManager = Sys.WebForms.PageRequestManager.getInstance();
pageRequestManager.add_endRequest(NewCharacterCount);
</script>

where NewCharacterCount is your javascript function name.

Read this article Sys.WebForms.PageRequestManager endRequest Event Hope it may help you.

like image 20
Azhar Mansuri Avatar answered Sep 27 '22 20:09

Azhar Mansuri


If you are using UpdatePanel and you want to call a javascript function after content refresh in update panel, you can use below way to do it easily. In Page body tag , call a function RefreshContent()

<body onload="RefreshContent()">

<script type="text/javascript">
  function RefreshContent()
  {
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
  }

  function EndRequestHandler()
  {
    alert("Add your logic here" );
  }
</script>

Reference link http://www.infoa2z.com/asp.net/how-to-call-javascript-function-after-an-updatepanel-asychronous-request-to-asp.net-page

like image 28
Rakesh Dhiman Avatar answered Sep 27 '22 21:09

Rakesh Dhiman