asked on

Why is my combox not displaying in jqwidgets grid

Hello
As an excercise, I am trying to include a 'combobox' into my grid. I have followed what I believe should be the way to add it, but no matter what I try, the 'combobox' doesn't appear in the grid.

I am not sure what other parts of the code to include so have the minimum which should place this in my grid. I would be grateful if someone could point out my error. Thanks

jqwidgets combox docs

{
   text: 'Address',
   datafield: 'address',
   width: 'auto',
   cellsalign: 'left',
   columntype: 'combobox',
   createeditor: function(row, column, editor) {
      // assign a new data source to the combobox.
      var list = ['Stuttgart', 'Rio de Janeiro', 'Strasbourg'];
      editor.jqxComboBox({
         source: list,
         promptText: "Please Choose:"
      });
   },
   // 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;
   },
   initeditor: function(row, cellvalue, editor) {
      editor.jqxComboBox({
         dropDownWidth: 100
      });
   },
},

Open in new window

HainKurt

what do you pass as editor?

try

alert(editor);
$(editor).jqxComboBox({...});

do you get any alert?

Leonidas Dosas

Continue from the Huseyin post you must check how you pass the arguments in the createeditor property.Check the console for possible
undefined error or not defined.

peter-cooper

ASKER

@Huseyin There is no alert or console.log info. No errors. Thanks

Leonidas Dosas

Did you call the property createeditor so to run the function?

Leonidas Dosas

Check in your code if somewhere you are calling the property via the following way:

your_object.createeditor(row, column, editor);

Open in new window

peter-cooper

ASKER

@Leonidas I found this example. not sure if it help. comboentries is an array from what I can see.Thanks

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;
                        }

Open in new window

peter-cooper

ASKER

Found this in docs:

“createeditor” callback – it is called for each row when the “columntype=custom”. The editors should be synchronized with the cell’s value in the “initeditor” callback. The editor’s value should be retrieved in the “geteditorvalue” callback.

HainKurt

There is no alert or console.log info. No errors. Thanks

meaning you have js error or missing library or setup it wrong...
need link to see whats happening...

I mean, if the code is not running, nothing to fix :)

Leonidas Dosas

Peter I think that you must define and set the source property first to show the elements in grid.Did you define a new $.jqx.dataAdapter() variable to source property?

$("#jqxgrid").jqxGrid({
      width: 670,
      height: 250,
      theme: 'energyblue',
      source: here_set_the_new $.jqx.dataAdapter(),
      editable: true,    
      columns:

Open in new window

HainKurt

@Dosas

I think that you must define and set the source property first

var list = ['Stuttgart', 'Rio de Janeiro', 'Strasbourg'];
      editor.jqxComboBox({
         source: list,
         promptText: "Please Choose:"
      });

Open in new window

list is set in the code...

Leonidas Dosas

No Huseyin there is another property except this one that peter and you said (list) that must be set to show the grid.This property is jqxGrid methods property and it accepts an $.jqx.dataAdapter() object.

HainKurt

if you added an alert after this

createeditor: function(row, column, editor) {

and do not get any message, then it means it is not called...
so, no code will run here :)

you should fix first why it is not called... then we can work on the combobox code...

ASKER CERTIFIED SOLUTION

Leonidas Dosas

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

peter-cooper

ASKER

Thank you. Helped me a great deal. Cheers