Specifies the implementation code of the div content on the ajax partial refresh page

Source: Internet
Author: User

Here we will introduce the regular assignment of values to the specified div. We can use the setInterval or setTimeOut Function to execute the ajax function, so that we can refresh the function in a few seconds, let's look at the instance.

Example

The Code is as follows: Copy code

<Script type = "text/javascript">
Var xmlhttp;
Function startrefresh (){
Xmlhttp = new XMLHttpRequest ();
Xmlhttp. open ("POST," ss. php ", true );
Xmlhttp. setRequestHeader ("Content-type", "application/x-www-form-urlencoded ");
// Xmlhttp. send ("name = wk"); -- added when parameters need to be transmitted
Xmlhttp. onreadystatechange = function (){
If (xmlhttp. readyState = 4)
If (xmlhttp. status = 200)
Document. getElementById ("mydvi"). innerHTML = xmlhttp. responseText;
}
}
</Script>

Ss. php code

The Code is as follows: Copy code

<?
Echo 'here is the data returned by ajax. You can operate it as needed ';

If you want this div to be automatically refreshed, you can use setInterval ('startrefresh () ', 5000) to automatically execute the startrefresh method every five seconds, another method is setTimeout ('startrefresh () ', 5000), but this method will only be executed once.

The above will automatically refresh without stopping. Next we will introduce how to use ajax to save data.

The Code is as follows:

The Code is as follows: Copy code

<Asp: ScriptManager ID = "smScriptManager" runat = "server">
</Asp: ScriptManager>


<Asp: UpdatePanel ID = "upLinkmanList" UpdateMode = "Conditional" runat = "server">
<ContentTemplate>
// The data part to be updated, such as a Repeater, including the paging control;
</ContentTemplate>
</Asp: UpdatePanel>


// Register the page as Ajax in the background

AjaxPro. Utility. RegisterTypeForAjax (typeof (the last word of the Inherits page to be registered, for example, CustomerList. aspx, CustomerList ));

// Register the asynchronous control, which contains ten linkbuttons (lnkbtnRefreshLinkman) to call the data update method in the background;
This. smScriptManager. RegisterAsyncPostBackControl (lnkbtnRefreshLinkman );

// Register the paging control this. smScriptManager. RegisterAsyncPostBackControl (this. Pager );

 

/// <Summary>
/// Refresh the contact list
/// </Summary>
/// <Param name = "sender"> </param>
/// <Param name = "e"> </param>
Public void RefreshLinkmanList (object sender, EventArgs e)
{
// Update the data contained in the Ajax control. The UpdateMode of the Ajax control must be specified as Conditional.
UpLinkmanList. Update ();
}


// Call the Linkbutton onclick event in the foreground script method. Remember to import the reference of the Jquery script file first.

$ ("# <% = LnkbtnRefreshLinkman. ClientID %>"). click ();

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.