在局部视图中获取Jquery中的空值

时间:2015-07-21 12:15:06

标签: jquery model-view-controller asp.net-mvc-partialview

我在部分视图中使用Jquery将数据传递给控制器​​。这是我的部分视图代码:

    @model List<Apostille.Models.Cart>

@{
    var grid = new WebGrid(source: Model, canPage: true, rowsPerPage: 10);
    grid.Pager(WebGridPagerModes.All);
}

@using (Html.BeginForm("MinusQuantity", "Cart", FormMethod.Post, new { id = "myForm" }))
{
    <div>
        @grid.GetHtml(
                    tableStyle: "webgrid-table",
                    headerStyle: "webgrid-header",
                    footerStyle: "webgrid-footer",
                    alternatingRowStyle: "webgrid-alternating-row",
                    selectedRowStyle: "webgrid-selected-row",
                    rowStyle: "webgrid-row-style",
                    mode: WebGridPagerModes.All,
    columns: grid.Columns(
            grid.Column(columnName: "country_name", header: "Country Name"),
            grid.Column(columnName: "state_name", header: "State Name"),
            grid.Column(columnName: "document_title", header: "Document Title"),
            grid.Column(columnName: "document_name", header: "Document Name"),
            grid.Column(header: "Document Quantity", format: @<div><button onclick="minus(@item.order_id,@item.number_of_document)" data-type="minus" class="btn btn-danger btn-number" data-field="number_of_document"><b>-</b></button> <span style="margin-left: 18%">@Html.Raw(@item.number_of_document)</span> <button onclick="plus(@item.order_id,@item.number_of_document)" data-type="plus" class="btn btn-success btn-number" data-field="number_of_document", style="float:right"><b>+</b></button></div>),
            grid.Column(columnName: "first_doc_price", header: "First Doc Price"),
            grid.Column(columnName: "addition_doc_price", header: "Additional Doc Price"),
            grid.Column(columnName: "extra_total", header: "Addtional Doc Total"),
            grid.Column(columnName: "total", header: "Final Total")
            //grid.Column(format: (item) => Html.ActionLink("Edit", "_EditCartPartial", new { @id = "send id here" }))
   ))
    </div>
}

<script type="text/javascript">

    jQuery(document).ready(function () {
        alert("DOM loaded!");

        function minus(orderId, qty) {
            $.ajax({
                url: '@Url.Action("MinusQuantity", "Cart")',
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                data: { 'OrderId': orderId, 'Quantity': qty },
                sucess: function (data) {

                }
            })
        }
    });
    //alert("this script tag is executing properly!");

    function plus(orderId, qty) {
        $.ajax({
            url: '@Url.Action("PlusQuantity", "Cart")',
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            data: { 'OrderId': orderId, 'Quantity': qty },
            sucess: function (data) {

            }
        })
    }
</script>

我可以成功调用jquery,但是当我点击webgrid的按钮时,我在orderid和qty中获得null值。

我在某处看到jquery在部分视图中不起作用,所以我试图将jquery放在index.cshtml中,但我仍然得到这两个值的null值。

但是如果我将webgrid移动到index.html,那么jquery就可以了。

可能的原因是,jquery无法在局部视图中工作?我该怎么做才能克服这种情况?

1 个答案:

答案 0 :(得分:0)

使用parseInt

function minus(orderId, qty) {
            var ordId = parseInt(orderId);
            var quant = parseInt(qty);
            $.ajax({
                url: '@Url.Action("MinusQuantity", "Cart")',
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                data: { 'OrderId': ordId , 'Quantity': quant},
                sucess: function (data) {

                }
            })
        }