Select element in editor template doesn't trigger update event when selected items change

3 posts, 0 answers
  1. Mathieu Lafontaine
    Mathieu Lafontaine avatar
    3 posts
    Member since:
    Apr 2010

    Posted 16 Jan 2013 Link to this post

    The editor for the RoleIds property shows the correct selections when the row enters the "edit" mode.  However, if I change the selected value in this control and press the update button, no call to my update url is made, as if nothing changed.

    What am I missing?

    Here's the code (see attached image for behavior):

    <div id="myGrid"></div>
    <script type="text/javascript">
        $(function () {
            var dataSource = new kendo.data.DataSource({
                transport: {
                    read: { url: "/Test/TestRead"},
                    update: {
                        url: "/Test/TestUpdate",
                        type: "POST"
                    }
                },
                schema: {
                    model: {
                        id: "Id"
                    }
                }
            });

            $('#myGrid').kendoGrid({
                columns:
                    [
                        {command:
                            [{
                                    name:"edit",
                                    buttonType:"ImageAndText",
                                    text:"Edit"
                            }]
                        },
                        {   
                            field: "Name"
                        },
                        {
                            title:"Roles",
                            template:"#: RoleCSV #",
                            field: "RoleIds",
                            editor: "<select id='RoleIds' name='RoleIds' data-val='true' data-bind='value: RoleIds' multiple style='width:100%'><option value='1'>Admin</option><option value='2'>Guest</option></select>"
                        }
                    ],

                dataSource: dataSource,
                model:{
                    
                },
                editable: { mode: "inline", update: true}
            });
        });

    </script>

    Returned data from the read url looks like this:

    [{"Id":1,"Name":"Mathieu","RoleCSV":"Admin","RoleIds":[1]},{"Id":2,"Name":"Martin","RoleCSV":"Admin, Guest","RoleIds":[1,2]},{"Id":3,"Name":"Patrick","RoleCSV":"Guest","RoleIds":[2]}]
  2. Mathieu Lafontaine
    Mathieu Lafontaine avatar
    3 posts
    Member since:
    Apr 2010

    Posted 17 Jan 2013 Link to this post

    Anyone?
  3. Kendo UI is VS 2017 Ready
  4. Brett
    Brett avatar
    25 posts
    Member since:
    Sep 2012

    Posted 17 Jan 2013 Link to this post

    First thing I notice without running the code is that you have a configuration property in your kendoGrid that does not belong:
    model: {
    },
    Also, remove buttonType in the command column declaration in your kendoGrid. It is not a valid property according to their documentation. I would also change "#: RoleCSV#" to "#= RoleCSV#". The former syntax treats the value as HTML and attempts to encode it, whereas the latter does not.
Back to Top