How to get value id from dataSource by row

[Stark]

Help me code How to get value id from dataSource by row and change to current value default (1)

in line:  var date = dataSource.get(1);
            console.log(date.ProductName)

 

My full source:

<div id="grid"></div>

    <script>
        $(document).ready(function () {
            var crudServiceBaseUrl = "https://demos.telerik.com/kendo-ui/service",
                dataSource = new kendo.data.DataSource({
                    transport: {
                        read:  {
                            url: crudServiceBaseUrl + "/Products",
                            dataType: "jsonp"
                        },
                        update: {
                            url: crudServiceBaseUrl + "/Products/Update",
                            dataType: "jsonp"
                        },
                        destroy: {
                            url: crudServiceBaseUrl + "/Products/Destroy",
                            dataType: "jsonp"
                        },
                        create: {
                            url: crudServiceBaseUrl + "/Products/Create",
                            dataType: "jsonp"
                        },
                        parameterMap: function(options, operation) {
                            if (operation !== "read" && options.models) {
                                return {models: kendo.stringify(options.models)};
                            }
                        }
                    },
                    batch: true,
                    pageSize: 20,
                    schema: {
                        model: {
                            id: "ProductID",
                            fields: {
                                ProductID: { editable: false, nullable: true },
                                ProductName: { validation: { required: true } },
                                UnitPrice: { type: "number", validation: { required: true, min: 1} },
                                Discontinued: { type: "boolean" },
                                UnitsInStock: { type: "number", validation: { min: 0, required: true } }
                            }
                        }
                    }
                });
          
            $("#grid").kendoGrid({
                dataSource: dataSource,
              selectable: true,
                pageable: true,
                height: 550,
                toolbar: ["create"],
                columns: [
                    "ProductName",
                    { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: "120px" },
                    { field: "UnitsInStock", title:"Units In Stock", width: "120px" },
                    { field: "Discontinued", width: "120px", editor: customBoolEditor },
                    { command: ["edit", "destroy"], title: "&nbsp;", width: "250px" }],
                editable: "inline",
              edit: function () {

                  var date = dataSource.get(1);
                  console.log(date.ProductName)

                } 
            });
        });
    </script>

[Mihaela]

Hi Stark,

Thank you for the provided code snippet.

You could access the id of the record, which is in edit mode, and update it to "1" as follows:

edit: function (e) {
  var grid = e.sender;
  var idToEdit =  grid.dataItem(e.container).ProductID;
  var gridRecord = grid.dataSource.get(idToEdit);
  gridRecord.set("ProductID", 1);
 }

Here is a Dojo sample with this example: 

https://dojo.telerik.com/enoFataS

If you have any other queries, don't hesitate to contact me back.

 

Regards, Mihaela Lukanova Progress Telerik

[Stark]

Thanks so much. Can I ask more question about column. I want show display normal text with format editor. How I can do that.

My data get from sql server format same as: "&lt;strong&gt;Jane Doe&lt;/strong&gt;"

THis is code

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "name", encoded: false }
  ],
  dataSource: [ { name: "&lt;strong&gt;Jane Doe&lt;/strong&gt;" } ]
});
</script>

Result: encoded: false => <strong>Jane Doe</strong>

            encoded: true => &lt;strong&gt;Jane Doe&lt;/strong&gt;

[Mihaela]

Hello Stark,

Since the returned data from the database is HTML encoded, it could be decoded by using a custom function:

function htmlDecode(value) {
   return value.replace(/&lt;/g, "<").replace(/&gt;/g, ">");
 }

Then call it in a column template as follows:

$("#grid").kendoGrid({
  columns: [
    { field: "name", template: "#=htmlDecode(name)#" }
   ],
   dataSource: [ { name: "<strong>Jane Doe</strong>" } ]
});
    

Here is a Dojo sample for your reference: 

https://dojo.telerik.com/udOxOyuj

In case of any other queries, please let me know.

 

Regards, Mihaela Lukanova Progress Telerik

[Stark]

it worked fine. Thank you very much.