自定義劍道網格工具欄按鈕

Question

我有一個 Kendo Grid，我在其中的工具欄中添加了一個自定義按鈕。 我已經將點擊 function 映射到該按鈕。

 <div class="row">
        <div class="clearfix">
            @(Html.Kendo().Grid<ModelLayer.Models.TableNotificationModel>()
        .Name("successfullData")
        .ToolBar(e =>
        {
           e.Custom().Text("Save").HtmlAttributes(new { id = "customSaveButton", @class = "floatRight" });
        })
        .Pageable(pageable => pageable.Input(true).Numeric(false))
        .Scrollable()
        .Sortable()
        .Filterable()
        .ColumnMenu()
        .Groupable()
        .Columns(columns =>
        {
            columns.Bound(c => c.OPERATOR_OBJECTID).Title("ID").Hidden();
            columns.Bound(c => c.SETTLEMENT_CODE).Title("settlement code").Width("100px");
            columns.Bound(c => c.TECHNOLOGY_CODE).Title("tech code").Width("100px");
            columns.Bound(c => c.UPLOAD_SPEED_CLASS_CODE).Title("upload").Width("100px");
            columns.Bound(c => c.DOWNLOAD_SPEED_CLASS_CODE).Title("download").Width("100px");
            columns.Bound(c => c.DATA_CATEGORY_QOS_CODE).Title("data category").Width("100px");
            columns.Bound(c => c.SHAPE).Title("shape").Width("100px");
            columns.Bound(c => c.messageOut).Title("message").Width("100px");
        })
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(20)
            .Read(read => read.Action("Upload_Read", "Upload").Data("sendAdditional"))
            )
    )

        </div>
    </div>
<script>
    function sendAdditional() {
        var data = JSON.parse('@Html.Raw(Json.Serialize(Model?.TableNotificationModel))');

        return {
            model: data
        }
    }

$("#successfullData").on("click", "#customSaveButton", function () {
        var model = JSON.parse('@Html.Raw(Json.Serialize(Model?.TableNotificationModel))');
        

        $.ajax({
            method: "POST",
            url: '@Url.Action("SaveFile", "Upload")',
            data: {
                model: model,
                saveType: saveType
            } 
        })
    });
</script>

我添加了一個 function，它通過 ajax 調用將 model 發送到我的 Z594C103F2C6E04C3D8CZ 調用，其中 I0590ABA31 返回視圖。 問題是，自定義保存按鈕在 URL 中添加了一個# ，我認為這是因為我無法返回 controller 中的操作視圖。

public ActionResult SaveFile(List<TableNotificationModel> model)
        {
            //code shortened for brevity
            ViewBag.Message = String.Format(cmdMessage);
            return View(tModel);
        }

我有點卡住了，我不知道如何繼續。 有什么建議么？

Answer 1

檢查您的 javascript function 是否通過 ID：“customSaveButton”識別您的按鈕事件。

例如：

 $('#customSaveButton').on('click', function () {

    $.ajax({
        url: '/YourContreoller/SaveFile',
        type: 'POST',   
        dataType: 'json',
        data: $('#dataThatYouWantToSend').serialize(),
        success: function (sucess) {
            console.log("Success");
            document.location.href = '/'
        },
        error: function (xhr, textStatus, errorThrown) {
             console.log(textStatus);
        }

    });
});