Grid Refresh with DropDownList column

2 posts, 0 answers
  1. Jeffrey
    Jeffrey avatar
    1 posts
    Member since:
    Feb 2013

    Posted 29 Oct 2018 Link to this post

    Hi,

    I have the following code for my grid that contains a dropdownlist column.  On the change of the dropdown list, I call a controller function via ajax to update my record in the DB.  The DB is updated correctly but as soon as I leave that row the value goes back to the old value in the dropdownlist.  The DB is still correct and if I refresh my screen is loads correctly.  

    I've tried to do a datasource refresh, I've tried to get the datasource again and do a setDataSource.  Nothing refreshes the grid and retrieves the data.  My code is below for the grid and the dropdownlist.

    Any suggestions?  Thank you in advance Admin for your help.

     

    //GRID

    $("#grid").kendoGrid({
            dataSource: {
                type: "json",
                transport: {
                    read: "Grid/Ratings_Read",
                    cache: false
                },
                schema: {
                    model: {
                        fields: {
                            ProductSkill: { type: "string" },
                            RateID: { type: "int" },
                            RateValue: { type: "int", defaultValue: { RateID: 1} },
                            ItemCategoryName: { type: "string", title: "Category" },
                            GroupName: { type: "string", title: "Group", }
                        }
                    }
                },
                pageSize: 20,
                batch: false,
                group: [
                    {
                        field: "GroupName", dir: "asc"
                    },
                    {
                        field: "ItemCategoryName", dir: "asc"
                    }
                ]
            },
            height: 550,
            filterable: true,
            selectable: true,
            sortable: true,
            pageable: true,
            columns: [{
                field: "ProductSkill",
                title: "Skill",
                //format: "{0:MM/dd/yyyy}"
            }, {
                field: "RateID",
                title: "RateID",
                hidden: "true"
            }, {
                field: "RateValue",
                title: "Rating",
                editor: ratingDropDownEditor, template: "#=RateDisplay#"
            }, {
                field: "RateAssocID",
                title: "RateAssocID",
                hidden: "true"
            }, {
                field: "ItemID",
                title: "ItemID",
                hidden: "true"
            }
            ],
            editable: true,
            change:  onRowChange

        });

    //END GRID

     

    //DROPDOWNLIST

    function ratingDropDownEditor(container, options) {
            $('<input required name="' + options.field + '"/>')
                .appendTo(container)
                .kendoDropDownList({
                    autoBind: false,
                    dataTextField: "RateDisplay",
                    dataValueField: "RateID",
                    dataSource: {
                        type: "json",
                        transport: {
                            read: "Grid/Rate_Read"
                        }
                    },
                    change: onDropDownChange
                });
        }

        function onDropDownChange(e) {
            list = e.sender;
            var currentListSelected = list.dataItem(this.select());

            $.ajax({
                url: "Grid/Rating_InsertUpdate?rateAssocID=" + currentRateItem.RateAssocID + "&itemID=" + currentRateItem.ItemID + "&rateID=" + currentListSelected.RateID, success: function (result) {
                    //alert(result);
                    
                }
            });
        }

    //END DROPDOWNLIST

  2. Viktor Tachev
    Admin
    Viktor Tachev avatar
    2497 posts

    Posted 30 Oct 2018 Link to this post

    Hi Jeffrey,

    Based on the description it seems that the DropDownList should change the value that is displayed in the Grid. In that case I would suggest configuring the update option for the Grid DataSource. Then remove the custom logic that updates the field when the selection in the dropdown is changed. 

    When the data is updated through the Grid the values that are shown in it would reflect the changes automatically. Check out the example below that illustrates how the Grid can be configured to use a custom editor. 



    Regards,
    Viktor Tachev
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top