This is a migrated thread and some comments may be shown as answers.

Grid - no row update with DropDownList component as editor

0 Answers 56 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Olivier
Top achievements
Rank 1
Olivier asked on 22 Jun 2012, 12:09 PM

Hi,

First of all, let me congratulate you about these really nice set of controls, methods and properties !
Great work.

Now, about what brings me here is the following :

Situation :
One grid, inline row editing, server sorting, server paging
4 columns : 3 string, 1 bool
Straight forward.

 

$(document).ready(function()
{
 
    $("#gridStatus").kendoGrid({
        dataSource: {
            transport: {
                read: "/content/reference_tables/status/json.status.list.php",
                update: {
                    url: "/content/reference_tables/status/json.status.update.php",
                    type: "POST"
                },
                destroy: {
                    url: "/content/reference_tables/status/json.status.delete.php",
                    type: "POST"
                },
                create: {
                    url: "/content/reference_tables/status/json.status.create.php",
                    type: "POST"
                }
            },
            error: function(e) {
                alert(e.responseText);
            },
            schema: {
                data: "data",
                total: "total",
                model: {
                    id: "id",
                    fields: {
                        table_name: {
                            type: "string",
                            validation: { required: true}
                        },
                        status_name: {
                            type: "string",
                            validation: { required: true}
                        },
                        description: {
                            type: "string",
                            validation: { required: true}
                        },
                        active: {
                            type: "boolean"
                        }
                    }
                }
            },
            pageSize: 10,
            serverPaging: true,
            serverSorting: true,
            sort: { field: "table_name", dir: "asc" }
        },
 
        sortable: { mode: "single", allowUnsort: false },
        pageable: true,
        editable: "inline",
        toolbar: ["create"],       
        columns: [{
                field: "table_name",
                title: "Table",
                width: "25%"
            }, {
                field: "status_name",
                title: "Name",                 
                width: "20%"
            }, {
                field: "description",
                title: "Description",                  
                width: "35%"
            }, {
                field: "active",
                title: "Active",
                width: "100px",
                template: "<div align=center>#= active #</div>"
            },
            { command: ["edit", "destroy"], title: " ", width: "210px" }
        ]
    });
});

 

 
Working situation :
All string columns are edited as a textbox. Works fine, row is updated, .. nice and smooth as designed.
In fireBug, on updating, I see that the update PHP page is called as it has to be.

 

 

Not working :
But the issue happens when I turn the first row editing is a drop down list

  (...)

    columns: [{
            field: "table_name",
            title: "Table",
            editor: tableNameDropDownEditor,
            width: "25%"
        }, {
            field: "status_name",
            title: "Name",                 
            width: "20%"
        }, {
            field: "description",
            title: "Description",                  
            width: "35%"
        }, {
            field: "active",
            title: "Active",
            width: "100px",
            template: "<div align=center>#= active #</div>"
        },
        { command: ["edit", "destroy"], title: " ", width: "210px" }
    ]
});
 
 
function tableNameDropDownEditor(container, options)
{
 
    $.ajax({
        url: "/content/reference_tables/status/json.status.table_names.php",
        dataType: 'json',
        success: function(items) {
            
            $('<input id="idEditDropDown" data-bind="value:' + options.field + '"/>')
                .appendTo(container)
                .kendoDropDownList({
 
                    dataSource: items,
                    dataTextField: "table_name",
                    dataValueField: "table_name"
                });
             
            $("#idEditDropDown").data('kendoDropDownList').value(options.model.table_name);
 
        },
        error: function(data){
         
            console.log('error occured loading the JSON');
        }
 
 
    });
}

 

 
This is the JSON returned by json.status.table_names.php :
(returns the list of the database table names filtered (select * except the one starting with .. bla bla and bla bla) )

[{"table_name":"audit_create"},{"table_name":"audit_visible"},{"table_name":"links"},{"table_name":"links_activity"},{"table_name":"msg_content"},{"table_name":"msg_flow"},{"table_name":"msg_status"},{"table_name":"ratings"},{"table_name":"shortlists"},{"table_name":"site_settings"},{"table_name":"users"},{"table_name":"vendor_websites"},{"table_name":"vendors"},{"table_name":"visitors"},{"table_name":"visitors_history"}]

 

Looks fine as the drop down populates the list.
So far so good, list is populated.

 

BUT .. the problem is that when I want to UPDATE the row !

As soon as I put a drop down list component, it does not update at all !
FireBug does not event show me the update PHP page called. It acts as no data has changed so it does not trigger the update process.
I am probably missing some things in the definition of the drop down ...
I tried with fixed values instead of filling it in with JSON .. but same behavior

If you please could assist a bit. It is propably a piece of cake but this starts to drive me crazy  ;-)

Any help is welcome, obviously.

Wbr,

/Olivier

No answers yet. Maybe you can help?

Tags
Grid
Asked by
Olivier
Top achievements
Rank 1
Share this question
or