Невозможно передать данные из представления в контроллер и заполнить данные сетки одновременно - PullRequest
Новая
       18

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

0 голосов
/ 25 июня 2018

Таким образом, у меня есть проблема, когда я могу сделать только одну вещь за один раз: передать данные методу post в контроллере без заполнения данных сетки. ИЛИ заполнить данные сетки, не имея возможности передавать данные вметод post в контроллере.

Как я могу сделать оба?Вот что я попробовал:

В моем контроллере есть следующее: 

[HttpPost]
public async Task<ActionResult> Search(QueryFilter[] myFilters)
{
    return Json(await DataService.GetData(myFilters, 1, -1, null));
}

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

<script>
    $(function () {
        $("#searchform").submit(function (event) {    
            var url = '@Url.Content("~/Monitor/Search")';
            $("#grid-data").bootgrid("destroy");
            $("#preloader").show();
            event.preventDefault();

            var Filters = new Array();    
            $('[name="CheckBox"]:checked').each(function () {
                Filters.push(new QueryFilter($(this).val()));
            });

            $.ajax({
                url: url,
                type: 'POST',
                traditional: true,
                dataType: 'json',
                data: JSON.stringify(Filters),
                contentType: 'application/json; charset=utf-8',    
                success: function (result) {
                    alert("Success");
                    $("#grid-data").bootgrid(result); // Does not work
                }
            })
        });
        $("#preloader").hide();
    });    
    function QueryFilter(value) {
        this.Value = value
    }
</script>

Во втором случае я не могу передать значения в контроллер, но данные сетки успешно заполнены.Это мой сценарий в представлении для этого случая: 

<script>
    $(function () {
        $("#searchform").submit(function (event) {
            var url = '@Url.Content("~/Monitor/Search")';
            $("#grid-data").bootgrid("destroy");
            $("#preloader").show();
            event.preventDefault();

            var Filters = new Array();
            $('[name="CheckBox"]:checked').each(function () {
                Filters.push(new QueryFilter($(this).val()));
            });

            $("#grid-data").bootgrid({
                ajax:true
                url: url,
                type: 'POST',
                traditional: true,
                dataType: 'json',
                data: JSON.stringify(Filters),
                contentType: 'application/json; charset=utf-8',
                formatters: {
                    "DateOnly": function (column, row) {
                        return HelperScript.displayJsonDate(row[column.id]);
                    }
                },
                responseHandler: function (response) {
                    $("#preloader").hide();
                    return response;
                },
                requestHandler: function (request) {
                    return request;
                },
            })
        });
    });
    function QueryFilter(value) {
        this.Value = value
    }
</script>

1 Ответ

0 голосов
/ 26 июня 2018

Итак, я нашел довольно простое решение моей проблемы после продолжительного поиска в Интернете.

Так что вместо data: JSON.stringify(Filters)

Я использовал: 

post: function () {
        return {
            myFilters: Filters
        };
    },

И окончательный код выглядит так: 

$("#grid-data").bootgrid({            
    ajax: true,   
    url: url,
    type: 'POST',
    traditional: true,
    dataType: 'json',
    post: function () {
        return {
            myFilters: Filters
        };
    },
    contentType: 'application/json; charset=utf-8',
    rowCount: -1,
    multiSort: true,

    formatters: {
        "DateOnly": function (column, row) {
            return HelperScript.displayJsonDate(row[column.id]);
        }
    },
    responseHandler: function (response) {
        $("#preloader").hide();
        return response;
    },
    requestHandler: function (request) {
        return request;
    },
})
...