Как открыть модальное частичное представление при нажатии строки таблицы данных?

У меня есть общая модальная структура, которая находится на моем макете.

 <div class = "modal fade" id = "m_modal_general">
        <div class = "modal-dialog modal-lg" role = "document">
            <div id = "generalModal" class = "modal-content"></div>
        </div>
    </div>

На странице индекса моего клиента я могу легко вызвать модальное содержимое как частичное представление из контроллера.

$(function () {
    $("#newCustomer").click(function () {
        var $buttonClicked = $(this);
        $.ajax({
            type: "GET",
            url: "/Customer/Customer_Add",
            contentType: "application/json; charset=utf-8",
            datatype: "json",
            success: function (data) {
                $('#generalModal').html(data);
            },
            error: function () {
                alert("Dynamic content load failed.");
            }
        });
    });
});


public IActionResult Customer_Add()
{
   return PartialView("~/Views/Customer/AddCustomerPartial.cshtml");
}

Теперь я хочу получить еще один частичный результат, когда я щелкнул строку таблицы данных, но результат вызова ajax дает ошибку. Что не так в моем коде?

function OperationDetail() {
    var table = $('#tbloperations').DataTable();
    $('#tbloperations tbody').on('click', 'tr', function () {        
        var data = table.row(this).data();
        $.ajax({
            url: '/Customer/CustomerOperationDetail_Read',
            type: 'GET',
            dataType: 'json',
            data: { customerOperationId: data.Id },
            success: function (result) {
                $('#generalModal').html(data);
            },
            error: function (error) {
                alert("Dynamic content load failed.");
            }
        });
    });
}

public async Task<ActionResult> CustomerOperationDetail_Read(int customerOperationId){

var result = await operationsBusiness.GetCustomerOperationDetails(new GetCustomerOperationDetailsCommand {

                OperationId = customerOperationId
            });
 CustomerOperationDetailsVm vm = new CustomerOperationDetailsVm();

 vm.CustomerOperationDetails = result.Result;

return PartialView("~/Views/Customer/OperationDetailsPartial.cshtml",vm);            
}

Какую ошибку вы получаете?

— 09.04.2019 10:55

jquery ajax asp.net-mvc

09.04.2019 10:33

Как конвертировать HTML в PDF с помощью jsPDF

В этой статье мы рассмотрим, как конвертировать HTML в PDF с помощью jsPDF. Здесь мы узнаем, как конвертировать HTML в PDF с помощью javascript.

524

Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

у вас ошибка в этой функции.
попробуйте это решение:

  function OperationDetail() {
        var table = $('#tbloperations').DataTable();
        $('#tbloperations tbody').on('click', 'tr', function () {        
            var data = table.row(this).data();
            $.ajax({
                url: '/Customer/CustomerOperationDetail_Read',
                type: 'GET',
                dataType: 'json',
                data: { customerOperationId: data.Id },
                success: function (result) {
                    $('#generalModal').html(result);
                },
                error: function (error) {
                    alert("Dynamic content load failed.");
                }
            });
        });
    }

ОБНОВИТЬ
попробуйте Попробуйте поставить этот код:

$(function () {
    $("#newCustomer").click(function () {
        var $buttonClicked = $(this);
        $.ajax({
            type: "GET",
            url: "/Customer/Customer_Add",
            success: function (data) {
                $('#generalModal').html(data);
            },
            error: function () {
                alert("Dynamic content load failed.");
            }
        });
    });
});


public IActionResult Customer_Add()
{
   return PartialView("~/Views/Customer/AddCustomerPartial.cshtml");
}

другая функция:

  function OperationDetail() {
        var table = $('#tbloperations').DataTable();
        $('#tbloperations tbody').on('click', 'tr', function () {        
            var data = table.row(this).data();
            $.ajax({
                url: '/Customer/CustomerOperationDetail_Read',
                type: 'GET',
                data: { customerOperationId : data.Id },
                success: function (result) {
                    $('#generalModal').html(result);
                },
                error: function (error) {
                    alert("Dynamic content load failed.");
                }
            });
        });
    }




      public async Task<ActionResult> CustomerOperationDetail_Read(int customerOperationId){

        var result = await operationsBusiness.GetCustomerOperationDetails(new GetCustomerOperationDetailsCommand {

                        OperationId = customerOperationId
                    });
         CustomerOperationDetailsVm vm = new CustomerOperationDetailsVm();

         vm.CustomerOperationDetails = result.Result;

        return PartialView("~/Views/Customer/OperationDetailsPartial.cshtml",vm);            
        }

я видел, что .html (данные) должны быть html (результат), но результат все равно выдает функцию ошибки. Спасибо

— 09.04.2019 11:07

я не мог найти сообщение об ошибке в функции (ошибка).

— 09.04.2019 11:30

Попробуйте добавить конечную точку к вашему контроллеру, чтобы иметь возможность обнаруживать исключение

— 09.04.2019 11:43

Я добавил, но не смог найти сообщение об ошибке, извините.

— 09.04.2019 15:09

Я обновил свой ответ, надеюсь, что этот ответ поможет вам сейчас

— 09.04.2019 15:26

я изменил тип данных: «json» на тип данных: «html», и это сработало.

— 09.04.2019 16:25

Вы можете изменить его на html или удалить.

— 09.04.2019 16:30

09.04.2019 11:04

Ответ принят как подходящий

Когда я изменил тип данных json на html. Это сработало.

function OperationDetail(customerOperationId) {
        if (customerOperationId > 0) {
            $.ajax({
                url: '/Customer/CustomerOperationDetail_Read',
                type: 'GET',
                dataType: 'html',
                data: { customerOperationId: customerOperationId },
                success: function (result) {
                    $('#generalModal').html(result);
                },
                error: function (xhr, textStatus, errorThrown) {
                    alert(xhr.responseText);
                }
            });
        }
    }

09.04.2019 16:54

Другие вопросы по теме

Функция AJAX вызывается первой еще до нажатия первой строки кнопки jQuery, почему?

Сообщение 403 запрещено на Yii2 Ajax Call

MVC: строки запроса тега привязки в AJAX не подхватываются контроллером

Контроллер Spring-Boot не распознает данные из ajax

Отключить ajaxStart по конкретному запросу

Когда я делаю запрос POST на golang api с помощью POSTMAN, я успешно получаю токен jwt в виде файла cookie, но когда я делаю это из браузера, я не получаю файл cookie

Как вызвать Spotify API с помощью Ajax/Jquery?

Почему я получаю ошибку статуса 404 в своем запросе PUT?

Как я могу получить данные формы, проверить их с помощью javascript и отправить в базу данных с помощью php

Как отобразить массив сообщений, полученных из базы данных, для чата

Как открыть модальное частичное представление при нажатии строки таблицы данных?

Ответы 2

Другие вопросы по теме

Похожие вопросы