Как обновить модель для WebGrid, используя Ajax? - PullRequest
Новая
       0

Как обновить модель для WebGrid, используя Ajax?

0 голосов
/ 29 января 2020

Я пытаюсь создать WebGrid, который позволяет мне обновлять источник данных с Ajax. Источнику данных назначается список <>, содержащий модель, которую я создал для хранения данных. WebGrid заполняется правильно, и у меня нет проблем с сортировкой с использованием заголовка WebGrid или подкачки. Код для представления: 

@model IEnumerable<TestDataModel.Models.TestData>
@{
    ViewBag.Title = "Test Website";

    var grid = new WebGrid(canPage: true, canSort: true, ajaxUpdateContainerId: "grid", ajaxUpdateCallback: "callBack");
    grid.Bind(Model, rowCount: 10);
    grid.Pager(WebGridPagerModes.All);
    @grid.GetHtml(htmlAttributes: new { id = "grid" },
                  tableStyle: "webgrid-table",
                  headerStyle: "webgrid-header",
                  alternatingRowStyle: "webgrid-alternating-row",
                  rowStyle: "webgrid-row-style",
                  mode: WebGridPagerModes.All,
                  firstText: "<< First",
                  previousText: "< Prev",
                  nextText: "Next >",
                  lastText: "Last >>",
                  columns: grid.Columns("This is a place holder,
                                         I have a lot of columns"
                  ));
}
<div>
    <br />
    <p>
        Page Number: <input type="text" name="pageNumber" id="pageNumber" />
    </p>
    <p>
        <input type="button" name="pageNumberButton" id="pageNumberButton" value="Page" />
    </p>
</div>

<script type="text/javascript">
    $(document).ready(function () {
        $("#pageNumberButton").click(function () {

            var pageNumber = $("#pageNumber").val();
            $.ajax({
                url: '@Url.Action("GetData", "Test")?pageNumber=' + pageNumber,
                success: function (data) {
                    $("#grid").html(data);
                },
                error: function (data) {
                    alert("Error");
                }
            })
        });
    });
</script>

Нижний тег сценария - это вызов ajax, который я пытаюсь использовать для обновления WebGrid. Все, что делает «GetData», это создает список, извлекающий данные с сервера SQL и возвращающий Json(testData, JsonRequestBehavior.AllowGet). Код для контроллера: 

public ActionResult GetData(string pageNumber)
        {
            List<TestData> testData = new List<TestData>();
            if (string.IsNullOrEmpty(pageNumber))
            {
                testData = Data.Data.TestDataGet();
            }
            else
            {
                try
                {
                    var pageInt = Convert.ToInt32(pageNumber);
                    List<ParameterSQL> parameter = new List<ParameterSQL>();
                    parameter.Add(new ParameterSQL { Name = "@pageOffset", Value = pageInt });
                    testData = Data.Data.TestDataGet(parameter);
                }
                catch (Exception e)
                {
                    Console.WriteLine(e.Message);
                }
            }
            return Json(testData, JsonRequestBehavior.AllowGet);
        }

Ошибка, с которой я сталкиваюсь, - когда я нажимаю sh, кнопка WebGrid полностью исчезает. Причина, по которой мне нужно иметь возможность обновлять источник данных WebGrid, заключается в том, что моя таблица состоит из миллионов строк, и я собираю их только несколько тысяч за раз. Как только пользователь достигнет конца списка, я хочу, чтобы он мог загружать больше, используя запрос SQL, который у меня уже есть. Любая помощь будет великолепна, спасибо.

...