Как передать данные `json` из контроллера в View и использовать их для формирования таблицы? - PullRequest
Новая
       38

Как передать данные `json` из контроллера в View и использовать их для формирования таблицы?

0 голосов
/ 03 мая 2020

Я пытаюсь передать список как json строку из контроллера в View через Ajax и хочу показать эту json строку в формате таблицы, но я просто получаю простую json строку в представлении.

Код Contoller 

[HttpGet]
        public JsonResult GetRegRequests()
        {
            var model = new TaskManagementEntities().RegRequests.ToList();
            return Json(model,JsonRequestBehavior.AllowGet);
        }

Вот кодекс зрения. 

 <div id="showRequest">
        <table class="table-responsive reqtab">
            <thead class="thead-dark">
            <th>Req ID</th>
            <th>First Name</th>
            <th>Last Name</th>
            <th>User Name</th>
            <th>Password</th>
            </thead>
            <tbody>
            </tbody>
        </table>
    </div>

и тег сценария 

<script>
    $.ajax({
        cache: false,
        type: 'GET',
        url: @Url.Action("MasterAdmin", "Index"),
        dataType: 'json',
        success:
            function (result) {
                console.log(result);
                $(".reqtab tbody").append("<tr><td>" + result.first_name + "</td><td>" + result.last_name + "</td><td>" + result.user_name +"</td><td>"+ result.password+"</td></tr>")
            }
    })
</script>

Я также не получаю таблицу вместо заголовков я получаю просто json данные, а в консоли браузера появляется следующая ошибка. я не уверен, что эта ошибка связана или нет. 

jquery.unobtrusive-ajax.min.js:16 Uncaught ReferenceError: jQuery is not defined
at jquery.unobtrusive-ajax.min.js:16

Как я могу передать эту json строку для просмотра и использовать ее для формирования таблицы?

1 Ответ

0 голосов
/ 03 мая 2020

Вы забыли включить плагин JQuery, поэтому в консоли показано, что вам не нужно jQuery не определено.

Добавьте скрипт до jquery.unobtrusive в html: 

<script
  src="https://code.jquery.com/jquery-2.2.4.min.js"
  integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
  crossorigin="anonymous"></script>

Кроме того, ajax результат, который вы возвращаете, имеет тип List(array), если вы хотите отобразить все данные, вы должны для каждого из них . В противном случае вы получите undefined значения.

код: 

    $.ajax({
        cache: false,
        type: 'GET',
        url: '@Url.Action("MasterAdmin", "Index")', // and use 
        dataType: 'json',
        success:
            function (result) {
                console.log(result);
                result.forEach(element =>
                        $(".reqtab tbody").append("<tr><td>" + element.first_name + "</td><td>" + element.user_name + "</td><td>" + element.password +"</td><td>"+ element.id+"</td></tr>")
                    );
            }
    })
</script>
...