This is a migrated thread and some comments may be shown as answers.
How to get value id from dataSource by row
4 Answers 10 Views
This is a migrated thread and some comments may be shown as answers.
Stark
Top achievements
Rank 1
Iron
Iron
Stark asked on 06 Apr 2021, 04:08 PM

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>

4 Answers, 1 is accepted

Sort by
0
Mihaela
Telerik team
answered on 08 Apr 2021, 03:45 PM

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

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

0
Stark
Top achievements
Rank 1
Iron
Iron
answered on 08 Apr 2021, 03:58 PM

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;

0
Mihaela
Telerik team
answered on 09 Apr 2021, 01:25 PM

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: "&lt;strong&gt;Jane Doe&lt;/strong&gt;" } ]
});
    

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

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

0
Stark
Top achievements
Rank 1
Iron
Iron
answered on 09 Apr 2021, 01:44 PM
it worked fine. Thank you very much.
Tags
Grid
Asked by
Stark
Top achievements
Rank 1
Iron
Iron
Answers by
Mihaela
Telerik team
Stark
Top achievements
Rank 1
Iron
Iron
Share this question
or