. NET MVC implements local refresh loading HTML

How to implement local refresh using IFRAME in

. NET MVC

Today, someone is experiencing a local refresh problem in MVC, which prevents the entire page from refreshing and dithering. The layout in the

Web page is still a table layout, but DIV+CSS is not the same principle and operating process, here just demonstrates how to make local refresh. The

first creates a new MVC project on vs to ensure normal operation.

Next Modify the Home/index view, as follows:

<%@ page language= "C #"  masterpagefile= "~/views/shared/site.master"  Inherits= " System.Web.Mvc.ViewPage " %>      <asp:content id=" Content1 " 
Contentplaceholderid= "Titlecontent"  runat= "server" >        home    </asp:Content>   <asp:content id= "Content2"  contentplaceholderid= "MainContent"  runat= "Server" >       <%--

Second, we're going to write the button click event Partrefresh () to the JS script, as follows:


<script type= "Text/javascript" >
function Partrefresh () {
//document.getElementById ("Ifra  Me1id "). src =" http://www.baidu.com ";  
document.getElementById ("Iframe1id"). src = "/home/baidu";
}  
</script>


Here is the script need side position, as long as in the label content can be.


Next we look at a line of code in the JS script:

document.getElementById ("Iframe1id"). src = "/home/baidu";

src here Specifies the URL, can be familiar with the various sites, such as http://www.baidu.com can also be our project in the view file, such as "/home/baidu" here is homecontroller corresponding view of Baidu. Here is the contents of my baidu.aspx file.


<%@ Page language= "C #" inherits= "system.web.mvc.viewpage<dynamic>"%>
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">


At this point, our work is completed, can be a partial refresh, the following is my screenshot:


Screenshot after page loading:



The following figure is document.getElementById ("Iframe1id") in the click of the button (note in the corresponding JS file. src = "/home/baidu";)




The following figure corresponds to the screenshot after the click of the button (Note: JS corresponds to the document.getElementById ("Iframe1id"). src = "http://www.baidu.com";





Partially loading HTML without an IFRAME under. NET MVC

Recently in a background system, before the use of IFRAME to achieve the loading content, the left menu does not refresh. But has been not like this method, there are many drawbacks. Today I found a better alternative after searching the Internet:

First, the use of HTML anchor point tag to achieve no Refresh page loading:

Index.cshtml:


<! doctype html> 

Demo2.cshtml:




Otherwise, the DEMO1,DEMO3 will not be posted.


democontroller:using system;
using system.collections.generic;
using system.linq;
using system.web;
using system.web.mvc; namespace mvcdemo.controllers {    public class DemoController : 
Controller     {        // get: demo         public actionresult index ()          {            return 
View ();         }         public  Actionresult demo1 ()         {      
      return view ();         }         public  actionresult D Emo2 ()         {        
    return view ();         }         public  Actionresult demo3 ()         {      
      return view ();         }    &nbsp}}
 
 and then run to see the effect. The disadvantage is that the address bar path will show the path of the click Load page. 
 
  II, using the Jquery.load () method  
 
 Method Description: Load (Url,[data],[callback]); 
 The 
 Load method is similar to the HTML method, but load is a remote loading of HTML code, and the HTML contained in the loaded html-based can function correctly. Nonsense not much to say, on the code: 
 
 index.cshtml 
 
 

<! doctype html> 
 
 Note that the container that displays the content calls load.