2010-12-12 3 views
2

У меня есть приложение на asp.net mvc. И я пытаюсь создать фильтр таблицы. Страница очень сложная, поэтому я не могу получить данные от ответа JSON. Я пытаюсь получить его посредством вызова с параметрами.Обновить asp.net mvc page

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(); 
    } 

Но я не вижу новых данных. Что не так? Как обновить страницу?

PS I meen, что я хочу пойти (перенаправить) от действия A к действию A (с параметром). Я не хочу реконструировать страницу на стороне клиента

ответ

5

Вы ничего не делаете с результатом, который вы получаете с помощью вызова get. Кроме того, поскольку вы возвращаете представление, вы должны установить свой тип данных html.

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

Я хотел бы отметить, что я, вероятно, заменю только обновляемый раздел. Вы можете сделать это, используя частичный вид для хранения только этого раздела, а затем, когда вы получите запрос через AJAX, вы можете вернуть только частичное представление вместо полного представления. Другая вещь, которую я хотел бы сделать, - сделать представления строго типизированными до IEnumerable<int> и передать модель вместо использования данных вида.

Посмотреть

<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"); %> 

Частичный вид

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

Действие

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); 
} 
1

Я вижу одну проблему в коде выше:

$.get() не делает все, когда ваш запрос завершен (ваши данные были получены с сервера)

Вместо передачи нулевого значения вы должны передать функцию с параметром, который является данными. Пример:

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

в этой функции вы можете на самом деле ваш фильтр применяется к таблице