Aktualisieren asp.net mvc Seite

Question

Ich habe eine App auf asp.net mvc. Und ich versuche, Tabellenfilter zu erstellen. Die Seite ist sehr schwierig, daher kann ich keine Daten von der JSON-Antwort erhalten. Ich versuche es über Call-Action mit Params zu bekommen.

function refresh() { 
     var id = $("#list").val(); 
     var params = { id: id }; 
     $.get("/Home/Index", params, null, "json"); 

    } 

<select id="list" onchange="refresh()"> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
</select> 
<%foreach (var i in (IEnumerable<int>)ViewData["list"]) 
    { %> 
    <%=i %><br /> 
<%} %> 

    public ActionResult Index(int? id) 
    { 
     if (id == null) 
      id = 0; 

     ViewData["list"] = Enumerable.Range((int)id, 5).Select(i => i).ToList<int>(); 

     return View(); 
    } 

Aber ich sehe keine neuen Daten. Was ist los mit dir? Wie kann ich die Seite aktualisieren?

PS Ich nehme an, dass ich von Aktion A zu Aktion A (mit Param) gehen (umleiten) möchte. Ich möchte die Seite nicht auf der Clientseite rekonstruieren.

Answer 1

Sie tun nichts mit dem Ergebnis, das Sie mit dem Aufruf get abrufen. Da Sie eine Ansicht zurückgeben, sollten Sie auch Ihren Datentyp auf html festlegen.

$.get('/Home/Index', params, function(html) { 
     $('body').html(html); 
    },'html'); 

Ich würde anmerken, dass ich wahrscheinlich nur den Abschnitt ersetzen würde, der aktualisiert wird. Sie können dies tun, indem Sie eine Teilansicht verwenden, um nur diesen Abschnitt zu speichern. Wenn Sie die Anforderung über AJAX erhalten, können Sie nur die Teilansicht anstelle der vollständigen Ansicht zurückgeben. Die andere Sache, die ich tun würde, ist, die Ansichten stark zu machen - getippt zu IEnumerable<int> und ein Modell zu übergeben, anstatt Ansichtdaten zu verwenden.

Ansicht

<script type="text/javascript"> 
    $(function() { 
     $('#list').change(function() { 
      var id = $("#list").val(); 
      var params = { id: id }; 
      $.get("/Home/Index", params, function(html) { 
       $('#listResults').replaceWith(html) 
      }, "html"); 
     }); 
    }); 
</script> 

<select id="list"> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
</select> 
<% Html.RenderPartial("ListResults"); %> 

Teilansicht

<div id="listResults"> 
<%foreach (var i in Model) 
    { %> 
    <%=i %><br /> 
<%} %> 
</div> 

Aktion

public ActionResult Index(int? id) 
{ 
    if (id == null) 
     id = 0; 

    var model = Enumerable.Range((int)id, 5).Select(i => i).ToList<int>(); 
    if (this.Request.IsAjaxRequest()) 
    { 
     return PartialView(model); 
    } 
    return View(model); 
} 

Answer 2

Ich sehe ein Problem in dem obigen Code:

Die $.get() nicht tun alles, wenn Ihre Anfrage abgeschlossen ist (Ihre Daten wurden vom Server abgeholt)

Anstatt Null zu übergeben, sollten Sie eine Funktion mit einem Parameter übergeben, der die Daten darstellt. Beispiel:

$.get("/Home/Index" 
    , params, 
     function(data){ 
     //do something with data. 
     //data is json object returned 
    }, "json"); 

in dieser Funktion können Sie tatsächlich Ihre Filter auf die Tabelle angewendet haben