initeditor jqxdropdown source

[simcon94Participant]

Hi,
i have a grid with initeditor on column for a combobox:

                    , { text: 'Test', columntype: 'combobox', displayfield: "Name", datafield: "FirstId", width: '90%', 
                        initeditor: function (row, cellvalue, editor) {                            
                            editor.jqxComboBox({ source: comboEntries, displayMember: 'Name', valueMember: 'Id', width: '88%' });
                        }
                        // update the editor's value before saving it.
                        , cellvaluechanging: function (row, column, columntype, oldvalue, newvalue) {
                            // return the old value, if the new value is empty.
                            if (newvalue == "") return oldvalue;
                        }  
                            
                    }

That works so far.
Now i want to refresh or update the source of the jqxComboBox.
I try it this way:

var DataAdapter = new $.jqx.dataAdapter(Source, {
            autoBind: true,
            beforeLoadComplete: function (records) {
                comboEntries = new Array();
                // update the loaded records. Dynamically add EmployeeName and EmployeeID fields. 
                for (var i = 0; i < records.length; i++) {
                    var name = records[i].Name;                   
                    comboEntries.push(name);
                }
                return comboEntries;
            }
        });

In the array comboEntries are allways the new data. But in the jqxComboBox, the Data are still the same like the first time i open the Combobox.

The grid is in a window, that i open it with a click in another grid cell…..

How can i refresh or update the ComboBox entries?

Thanx

[simcon94Participant]

i have createeditor and initeditor…but still not working.
I am only want to laod the source new……:-(

[DimitarParticipant]

Hello simcon94,

In createeditor you should initialize the combobox and in initeditor – only change its source. Have you tried it this way?

Please also make sure comboEntries is visible inside initeditor and that it is actually updated.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[simcon94Participant]

Yes, i try it:

createeditor: function (row, cellvalue, editor) {
                            console.log("initeditor: " + comboEntries);
                            editor.jqxComboBox({ source: comboEntries, displayMember: 'Name', valueMember: 'Id', width: '88%' });
                        }
                        , initeditor: function (row, cellvalue, editor) {
                            console.log("initeditor: " + comboEntries);
                            editor.jqxComboBox({ source: comboEntries });
  
                        }

But in the console.log() never shown the new values

[simcon94Participant]

Can you post an example?
I have the version 3.3.0 of jqWidget….

[DimitarParticipant]

Hi simcon94,

Then this has nothing to do with the editor or the callback functions. The issue is that comboEntries is not updated. Please revise your code about this.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[simcon94Participant]

comboEntries is updated. See this is my console:
1.
grid : Counter_0.0,Counter_0.1,Counter_0.2,Counter_0.3,Counter_11,Motor,Steckdose,Test_Counter,Group_901,1
createeditor : Counter_0.0,Counter_0.1,Counter_0.2,Counter_0.3,Counter_11,Motor,Steckdose,Test_Counter,Group_901,1
initeditor : Counter_0.0,Counter_0.1,Counter_0.2,Counter_0.3,Counter_11,Motor,Steckdose,Test_Counter,Group_901,1

2.
grid : Counter_0.0,Counter_0.1,Counter_0.2,Counter_0.3,Counter_11,Motor,Steckdose,Test_Counter,Summen 1,1
createeditor : Counter_0.0,Counter_0.1,Counter_0.2,Counter_0.3,Counter_11,Motor,Steckdose,Test_Counter,Group_901,1
initeditor : Counter_0.0,Counter_0.1,Counter_0.2,Counter_0.3,Counter_11,Motor,Steckdose,Test_Counter,Group_901,1

The First call is correct. the second is wrong. The second call has the same entries then the first call……

Thats my code:

        var meterSource;
        meterSource =
        {
            datatype: "json",
            datafields: [
                { name: 'Id', type: 'string' }
                , { name: 'Number', type: 'string' }
                , { name: 'Name', type: 'string' }
            ],
            // get Model Data
            url: sk.appHelper.getAppDomainAppVirtualPath() + "/Meter/GetMetersToAttach?meterId=" + id
            , async: false
            //, cache: false
        };

        var comboEntries = new Array();
        var meterDataAdapter = new $.jqx.dataAdapter(meterSource, {
            autoBind: true,
            beforeLoadComplete: function (records) {
                comboEntries = new Array();
                // update the loaded records. Dynamically add EmployeeName and EmployeeID fields. 
                for (var i = 0; i < records.length; i++) {
                    var name = records[i].Name;
                    comboEntries.push(name);
                }
                return comboEntries;
            }
        });
        
        console.log("grid      : " + comboEntries);

        // initialize jqxGrid
        $("#gridAttachedMeters").jqxGrid(
            {
                width: popUpWidth - 10
                , autoheight: true
                , source: data
                , selectionmode: 'singlecell'
                , editable: true
                , columnsresize: true
                , showtoolbar: true
                , altrows: true
                , statusbarheight: 25
                , rendertoolbar: function (toolbar) {
                    var container = $("<div style='overflow: hidden; position: relative; margin: 5px;'></div>");
                    var addButton = $("<div style='float: left; margin-left: 5px;'><img style='position: relative; margin-top: 2px;' src='Content/icons/new.png'/></div>");
                    container.append(addButton);
                    toolbar.append(container);
                    addButton.jqxButton({ width: 60, height: 20 });
                    // add new row.
                    addButton.click(function () {
                       
                        $("#gridAttachedMeters").jqxGrid('addrow', 'MeterId', {}, "first");
                        
                    });
                }
                , columns: [
                    { text: "Id ", datafield: "Id", width: 1, hidden: true}
                    , { text: "MeterNumber", datafield: "MeterNumber", width: 1, hidden: true }
                    , { text: '@Resources.Meter.MeterModel_AttachedMeter', columntype: 'combobox', displayfield: "Name", datafield: "AttachedMeterId", width: '90%', 
                        createeditor: function (row, cellvalue, editor) {
                            console.log("createeditor: " + comboEntries);
                            editor.jqxComboBox({ source: comboEntries, displayMember: 'Name', valueMember: 'Id', width: '88%' });
                        }
                        , initeditor: function (row, cellvalue, editor) {
                            console.log("initeditor: " + comboEntries);
                            editor.jqxComboBox({ source: comboEntries });
                        }
                        // update the editor's value before saving it.
                        , cellvaluechanging: function (row, column, columntype, oldvalue, newvalue) {
                            // return the old value, if the new value is empty.
                            if (newvalue == "") return oldvalue;
                        }  
                   }
                        , {
                            text: '-', datafield: 'Delete', columntype: 'button', width: '10%', align: 'center', cellsrenderer: function () {
                                return "-";
                            }
                            , buttonclick: function (row) {
                                // get the clicked row's data and initialize the input fields.
                                var rowid = $('#gridAttachedMeters').jqxGrid('getrowid', row);
                                $('#gridAttachedMeters').jqxGrid('deleterow', rowid);
                            }
                            , aggregatesrenderer: function (aggregates, column, element) {
                                var renderstring = "<div class='jqx-widget-content' style='float: left; width: 100%; height: 100%; '/>";
                                return renderstring;
                            }
                        }
                ]
            });

[DimitarParticipant]

Hi simcon94,

As far as I can see you only set comboEntries once, in the beforeLoadComplete callback function. There is no code that updates it.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[simcon94Participant]

and how can i update?
But in these line:
console.log(“grid : ” + comboEntries);

the entries are correct…..why this?

[simcon94Participant]

I found the Problem.
The combox that i create is in a window, that i opened with click in grid “a”.
When i create the combox in grid “a” directly, then it works.

[Author]

Posts