通过 Ajax 将 ViewModel(对象)传递给 MVC 控制器时如何忽略空值

How to ignore empty values when passing a ViewModel (object) via Ajax to an MVC controller

在接下来的 view 中,我将对象 (ViewModel) 传递给控制器​​。如果用户在表单中输入所有值,它就可以正常工作。通过 LINQ 查询生成的带有 querystring 的请求 URL 示例如下:

Request URL:http://localhost:50507/OrdCtrl/OrdAction?OrdYear=2016&OrderNumber=CE123&OrderName=testOrder&hasOrdered=true&_=1489509308855

但是如果用户跳过在搜索表单中输入一个值,比如说 orderName,用户会得到预期的错误:

NullReferenceException: Object reference not set to an instance of an object.

我认为出现上述错误是因为生成的 Requested URL 缺少 orderName 的参数值,如下所示:

Request URL:http://localhost:50507/OrdCtrl/OrdAction?OrdYear=2016&OrderNumber=CE123&OrderName=&hasOrdered=true&_=1489509308855

问题: 在下面的dataObj inside Ajax调用中,如果输入参数的值为空字符串,我们如何跳过输入参数 - 所以生成querystring 不包括那些参数。 注意:这是一个搜索表单,允许用户仅根据他们在表单中输入的值进行搜索。

测试视图模型:

public class UsetListViewModel
{
    public int OrdYear { get; set; }
    public string OrderNumber { get; set; }
    public string OrderName { get; set; }
    public bool hasOrdered { get; set; }
}

查看:

@model TestProj.Models.TestViewModel

....<!--Some html here-->

<div>
    <form asp-controller="OrdCtrl" asp-action="OrdAction" method="get">
        <input type="hidden" asp-for="OrdID" />
        <div ><button type="button" id="SearchBtn">Search</button></div>
    </form>
</div>
<div id="searchResults"></div>     


@section scripts
{
    <script>
        $(document).ready(function () {

            $('#SearchView').on('click', '#SearchBtn', function (event) {

                var dataObj = {
                    OrdYear: $('#yearID').val(),
                    OrderNumber: $('#OrdNumb').val(),
                    OrderName: $('#OrdName').val(),
                    hasOrdered : $('[name=hasOrd]:checked').val()
                }

                $.ajax({
                    url: '@Url.Action("OrdAction", "OrdCtrl")',
                    data: dataObj,
                    contentType: 'application/json',
                    dataType: 'html',
                    type: 'GET',
                    cache: false,
                    success: function (data) {
                            $('#searchResults').html(data);
                    },
                    error: function (jqXHR, textStatus) {
                        alert('jqXHR.statusCode');
                    }
                });
            });
    });
    </script>
}

只是不要在 javascript 中填充 dataObj 中的值,除非设置了表单字段值。

因此将 dataObj 的声明更新为如下内容:

var dataObj = {};
if ($('#yearID').val() !== '') {
    dataObj.OrdYear = $('#yearID').val();
}
if ($('#OrdNumb').val() !== '') {
    dataObj.OrderNumber = $('#OrdNumb').val();
}
... etc ...

应删除 GET 请求中的空查询参数。