Question

这是我的HTML代码，我必须将kendo gridrow数据发送到文本框，点击kendo网格的内联编辑按钮，但我不想编辑内联。在编辑文本框之后，我想在kendo网格中将其显示为已编辑的值

<!--data-editable="inline"-->
<div id="example">
    <div id="kendoGrid" data-role="grid" data-pageable=" true" data-sortable=" true" data-filterable="true" data-toolbar="['create','save', 'cancel']" data-columns="[
    { 'field': 'Id', 'width': 100 },
    { 'field': 'CurrentCurrencyCode', 'width': 100 },
    { 'field': 'ShortName', 'width': 100 },
    { 'field': 'FullName', 'width': 100 },
    { 'field': 'ContactPerson', 'width': 100 },
    { 'field': 'Address1', 'width': 100 },
    { 'field': 'CompanyCity', 'width': 100 },
    { 'field': 'CompanyState', 'width': 100 },
    { 'field': 'CompanyCountry', 'width': 100 },
    { 'field': 'ZipPostCode', 'width': 100 },
    { 'field': 'TelArea', 'width': 100 },
    { 
        command: ['edit'],
        title: 'Actions',
        width: '250px'
    },
]" data-bind="source: products" style=" height :500px"></div>
</div>
<div>
    <input id="ii" class="k-textbox" data-bind="value: data-columns.Id " />
    <input id="ii" class="k-textbox" data-bind="value:  data-columns.CurrentCurrencyCode " type="text" />
    <input id="ii" class="k-textbox" data-bind="value:  data-columns.ShortName " type="text" />
    <input id="ii" class="k-textbox" data-bind="value:  data-columns.FullName " type="text" />
    <input id="ii" class="k-textbox" data-bind="value:  data-columns.ContactPerson " type="text" />
    <input id="ii" class="k-textbox" data-bind="value:  data-columns.Address1 " type="text" />
    <input id="ii" class="k-textbox" data-bind="value:  data-columns.CompanyCity " type="text" />
    <input id="ii" class="k-textbox" data-bind="value:  data-columns.CompanyState " type="text" />
    <input id="ii" class="k-textbox" data-bind="value:  data-columns.CompanyCountry " type="text" />
    <input id="ii" class="k-textbox" data-bind="value:  data-columns.ZipPostCode " type="text" />
    <input id="ii" class="k-textbox" data-bind="value:  data-columns.TelArea " type="text" />
    <input id="Update" type="submit" value="Update" />
</div>

这是我的javascript代码，有些人可以使用内联按钮上的文本框绑定我的kendo行值而不是x

document.onreadystatechange = function () {
    function showdata(e) {
        alert("dataShown");
    }

    var viewModel = kendo.observable({
        products: new kendo.data.DataSource({
            transport: {
                //read: function () {
                //    type = "GET";
                //    url = "/api/Companies/GetAllCompanies2";
                //    dataType = "json";
                //},
                read: {
                    type: "GET",
                    url: "/api/Companies/GetAllCompanies2",
                    dataType: "json",
                    async: false
                },
                create: {
                    type: "PUT",
                    url: "/api/Companies/UpdateDefCompny",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    async: false
                },
                 update: {
                url:"/api/Companies/SaveDefCompny",
                async: false,
                contentType: "application/json",
                dataType: "json",
                type: "POST"
                 // here you need correct api url

            },
                destroy: {
                    url: "/api/Companies/Delete", // here you need correct api url
                    dataType: "json"
                },
                parameterMap: function (data, operation) {
                    if (operation !== "read" && data) {
                        return JSON.stringify(data.models[0]);
                    }
                }
            },
            serverPaging: true,
            serverFiltering: true,
            pageSize: 10,
            schema: {
                //data:"Data",
                total: "Count",
                model: {
                    id: "Id",
                    fields: {
                        Id: {
                            type: "int"
                        },
                        CurrentCurrencyCode: {
                            editable: true,
                            type: "int"
                        },
                        ShortName: {
                            editable: true,
                            type: "string"
                        },
                        FullName: {
                            editable: true,
                            type: "string"
                        },
                        ContactPerson: {
                            editable: true,
                            type: "string"
                        },
                        Address1: {
                            editable: true,
                            type: "string"
                        },
                        CompanyCity: {
                            editable: true,
                            type: "string"
                        },
                        CompanyState: {
                            editable: true,
                            type: "string"
                        },
                        CompanyCountry: {
                            editable: true,
                            type: "string"
                        },
                        ZipPostCode: {
                            editable: true,
                            type: "string"
                        },
                        TelArea: {
                            editable: true,
                            type: "string"
                        }
                    }
                }
            },
            batch: true,
        })
    });
    kendo.bind(document.getElementById("example"), viewModel);
}

或在内联编辑按钮上调用javascript函数点击那个传输值但是如何在按钮点击时调用一个函数也告诉我？更新功能也无法点击

Answer 1

基本上你只需要传递你选择的项目并将其绑定到文本框，datepicker，numerictextbox或复选框，方法是将其添加到网格上的change事件

change: function (e) {
            selectedRow = this.select();
            var item = this.dataItem(selectedRow);
            kendo.bind($("#gridEditor"), item);
        },

我可能有一个可能适合您需求的示例，当我尝试按照剑道网站上的一些教程创建时。请查看此jsfiddle

用文本框onclick绑定kendo网格的行数据？

1 个答案: