inline editing and select element

inline editing and select element

nguyenm9nguyenm9 Posts: 20Questions: 3Answers: 0

Hi all,

Been playing around with 1.10.4 dt and 1.3.3 editor and have been able to figure out a bit. First off, kudos on the software. After a week of trial and error with various grid/table plugins, I'm finding dt+editor to be the easiest and most straightforward of the bunch. That said, I'm having a heck of a time trying to get the select dropdown to appear on my table. I feel like I'm following the samples and instructions but must be missing something...

My table is fairly straightforward. Just 4 columns. A text, select, textarea, and an actions column where I override the defaultContent to add a button.

Everything is working as intended so far except for the select. I am defining it in my editor (on instantiation) as follow:

<snip>
fields: [ 
<snip>
           {
                    name: "level",
                    type: "select",
                    options:
                    [
                          { value: "0", label: "Expert" },
                          { value: "1", label: "Senior" },
                          { value: "2", label: "Mid" },
                          { value: "3", label: "Junior" }

                    ]
                }
<snip>
                ]

When I go to click on the cell, I get an empty drop down.

Assuming, I figure out this issue, I also have a button that will create a new row in the table. For this, I am currently calling.

            editor.create(false)
                .set(...)
                .set('level', 'Junior')
                .set(...)
                .submit();

This does create the row for me but is this the correct 'set' call to make to preset the select field to 'Junior'? (I'm guess it's blank right now b/c I'm not able to prepopulate the select list from above)

Also (additional comment/question)

1) The attr: { placeholder } option is handy but you might consider using it as the placeholder text in the cell when no label exist and not editing to give a visual cue to the user. I realize I could set text when creating the row but it then becomes sticky to the cell and when I click to edit, it transfers the text to the editor and thus defeats the purpose of specifying the placeholder text to begin with (for inline editing).

2) Is it possible to quickly replace the textarea editor with something like autosize (http://www.jacklmoore.com/autosize/) or would one need to write an editor plugin?

Thanks much. Great tool and I'll be picking up the editor if I can get through some of my test cases.

matt

Replies

This discussion has been closed.