我在部分视图中使用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无法在局部视图中工作?我该怎么做才能克服这种情况?
答案 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) {
}
})
}