Question

我正在使用Kendo Grid，我试图创建一个自定义列模板命令来调用一个JavaScript函数，该函数对我的mvc控制器执行ajax调用，传递两个参数，以便我可以执行其他操作那里的东西。

这是网格：

@(Html.Kendo().Grid<iPlan.Syspro.Beekman.Portal.Agents.Models.SalesOrderDetailViewModel>()
.Name("Details")
.HtmlAttributes(new {@style = "width:80vw"})
.Columns(columns => {
    columns.Bound(c => c.Agent).Width(100);
    columns.Bound(c => c.SalesOrder).Width(150);
    columns.Bound(c => c.Line).Width(60);
    columns.Bound(c => c.StockCode).Width(150);
    columns.Bound(c => c.SerialNumber).Width(150);
    columns.Bound(c => c.DerivativeDescription).Width(150);
    columns.Bound(c => c.StockCodeDescription).Width(150);
    columns.Bound(c => c.OrderQty).Width(150);
    columns.Bound(c => c.OnBackorder).Width(150);
    columns.Bound(c => c.QtyAvailable).Width(150);
    columns.Bound(c => c.ShippedQuantity).Width(150);
    columns.Bound(c => c.SalesPrice).Width(150);
    columns.Bound(c => c.AlternativeSerial).Width(150);
    columns.Bound(c => c.AlternativeSerialReason).Width(150);
    columns.Bound(c => c.VinNr).Width(150);
    columns.Bound(c => c.DealerOrderNr).Width(150);
    columns.Bound(c => c.WipNr).Width(150); 
    columns.Bound(c => c.GrnNr).Width(150);
    columns.Bound(c => c.AsnNr).Width(150);
    columns.Bound(c => c.DeliveryNoteNr).Width(150);  
    columns.Command(command => {command.Edit(); command.Destroy();}).Width(172);
    columns.Template(@<text></text>).Width(150).ClientTemplate("<a class='k-button k-button-       icontext k-grid-edit' href='javascript:' onclick='approve()'><span class='k-icon k-edit'>  </span>Approve</a>").Title("Action");      
})
.Editable(editable => editable.Mode(GridEditMode.InLine))
.Sortable()
.Scrollable()
.Groupable()
.Pageable(pageable => pageable
    .Refresh(true)
    .PageSizes(true)
    .ButtonCount(5))
.DataSource(dataSource => dataSource
    .Ajax()
    .Events(events => events.Error("error_handler"))
    .Read(read => read.Action("SalesOrdersDetail_Read", "Inbox").Data("getSalesOrder"))
    .Update(update => update.Action("SalesOrdersDetail_Update","InboxAgent"))
    .Destroy(destroy => destroy.Action("SalesOrdersDetail_Destroy","InboxAgent"))
    .Create(create => create.Action("SalesOrdersDetail_Create","InboxAgent"))
    .Model(model => {
        model.Id(p => p.SalesOrder);
        model.Field(p => p.StockCode).Editable(false);
        model.Field(p => p.SerialNumber).Editable(false);
        model.Field(p => p.DerivativeDescription).Editable(false);
        model.Field(p => p.StockCodeDescription).Editable(false);
        model.Field(p => p.SalesOrder).Editable(false);            
        model.Field(p => p.Agent).Editable(false);
        model.Field(p => p.Line).Editable(false);
        model.Field(p => p.OrderQty).Editable(false);
        model.Field(p => p.OnBackorder).Editable(false);
        model.Field(p => p.QtyAvailable).Editable(false);
        model.Field(p => p.ShippedQuantity).Editable(false);
    })        
))

以下是我试图调用的JavaScript函数：

  <script type="text/javascript">
  function approve(e) {
    debugger;        
    console.log("index function hit");
    //var data = $("#Details").data("kendoGrid").dataSource.data();
    //var dataRet = data.indexOf(dataItem);
    $.ajax({
        type: 'POST',
        url: href="/Inbox/SalesOrderDetailApprove" + "?SalesOrder=" + e.SalesOrder + "&Line=" + e.Line,
        dataType: 'json',
        data: {} ,
        success: function (response) { }
    });
}

现在，使用此代码，它会点击JavaScript方法，但它不会通过我的数据。这是它需要将数据传递给控制器的方法。所以需要解决的问题是：

需要将数据正确传递给JavaScript方法。
当我点击模板列中的按钮时，kendo网格进入编辑模式，我需要再次单击该按钮才能使其退出编辑模式。
该事件未触发一次，在页面加载时会触及该方法。
另一个问题是我最近安装了resharper（试用版）。我卸载了resharper并从那里开始我的intellisense在视图（cshtml）中的所有剃刀部分被打破。我该如何解决这个问题？

public ActionResult SalesOrderDetailApprove( string  SalesOrder, string Line) {
    try {
        return Json("", JsonRequestBehavior.AllowGet);
    } catch (Exception) {
        throw;
    }
}

Answer 1

尝试使用此代码调用函数

function approve(e) {
  var postUrl = '@Url.Action("SalesOrderDetailApprove", "Inbox")';
  var EmployeeId = { SalesOrder: e.SalesOrder, Line:  e.Line};
    $.ajax({
            url: postUrl,
             data: EmployeeId,
             type: 'POST',
             dataType: 'json',
             success: function (response) { }
      });
 }

这对你有用。

调用javascript函数和传递参数

1 个答案: