WebGrid в MVC4 перезагрузить с помощью AJAX

Question

WebGrid в MVC4 перезагрузить с помощью AJAX

0

У меня есть веб-сетка с включенной подкачкой и сортировкой. Сейчас все работают нормально. Я попытался добавить текстовое поле поиска и ссылку "GO" чуть выше сетки. Моя цель - отфильтровать сетку в соответствии с текстом в этом текстовом поле. Каков наилучший метод, который я должен применить для этого? Если я иду за ajax, то как я могу загрузить сетку. Я получаю возвращаемое значение как 'html'

Ниже приведен код

скрипт

$("#btnGO").click(function () {

    var controlAction = '@Url.Action("Search", "User")';
    var request = $.ajax({
        url: controlAction,
        type: "POST",
        data: { SearchKeyword: $("#txtSearch").val() },
        dataType: "html"
    });

    request.done(function (msg) {
        alert(msg);
        $("#gridContent").html(msg);
    });

    request.fail(function (jqXHR, textStatus) {
        alert("Request failed: " + textStatus);
    });

});

контроллер

[HttpPost]

    public ActionResult Search(string SearchKeyword)
    {


        Dictionary<string, string> Columns = new Dictionary<string, string>();
        Columns.Add("EMPNO", "Employee No");
        Columns.Add("FIRST_NAME", "Name");
        Columns.Add("EMAIL", "Email");
        Columns.Add("MOBILE", "Mobile");
        Columns.Add("CUR_ADDRESS", "Address");
        // Columns.Add("NATIONALITY", "Nationality");
        Common.Helper Helper = new Common.Helper();
        ViewBag.Columns = Helper.CreateGridColumn(Columns, "KEY");
        USERLIST objList = new USERLIST();
        if (SearchKeyword != null)
            objList = Bll.User.getList(SearchKeyword, 1);



        ViewBag.TotalCount = objList.TotalRecord;
        return PartialView("_Grid", objList);
    }

CSHTML

<div class="row">
    <div class="col-sm-12">
        <div class="box">
            <div class="box-title">
                <h3>
                    <i class="fa fa-table"></i>
                </h3>
                <div class="pull-left" style="padding-right:10px !important;">
                    @Html.TextBox("txtSearch","", new { Class = "form-control valid" }) @*new Dictionary<string, object>{ { "class", "form-control valid" }, { "id", "textEmpno" },{ "data-rule-required", "true" },{"type","2"}}*@

                </div>
                <div class="pull-left" style="padding-right:10px !important;"><a href="#" id="btnGO"  class="btn" rel="tooltip" title="Add">GO</a></div>
                 <div class="pull-right" style="padding-right:10px !important;"><a href="Create" onclick="edit(0);"  class="btn" rel="tooltip" title="Add"><i class="glyphicon-table"></i>Create New User</a></div>
            </div>

            @Html.Partial("_Grid", Model.UserList)
        </div>
    </div>
</div>

Спасибо, Боббин

user1849993 29 апр. 2014, в 10:41

Источник

0

Покажите код того, что вы пробовали.
tokyovariable 29 апр. 2014, в 08:01

Теги:

jquery

asp.net-mvc

webgrid

1 ответ

Ещё вопросы

Покажите код того, что вы пробовали.

HarisJayadev · Answer 1 · 2014-04-29T06-32-00.000Z

Попробуйте, например:

 $("#go").click(function(){

        var request = $.ajax({
           url: "url",
           type: "POST",
           data: { id : $("#txtSearch").val() },
           dataType: "html"
        });

     request.done(function( msg ) {
         $("#grid").html( msg );
     });

      request.fail(function( jqXHR ) {
         alert( "Request failed: " );
     });

  });

Привет, я попробовал ваш код, но я получаю эту ошибку «Запрос не выполнен: ошибка»
Я думаю, что URL-адрес неверен. Пожалуйста, проверьте это.
Я проверил URL-адрес [url: '@ Url.Action ("Поиск", "Пользователь")'], который вызывает правильное действие. Я проверил с точкой останова. И я получаю "SearchKeyword" в этом действии. А также мой DAL передает правильный набор данных для модели.