Better drop-down template

Bhaskar's Prima Select template was behaving strange when a grid has two select column templates. The select options were getting mixed.

The version suggested by me has cleaner API and doesnât have content mixing problem.

//  create select template

    var select1 = new My.Templates.Select;

    select1.setOptionsProperty("texts", ["Active", "Inactive"]);

    select1.setOptionsProperty("values", ["Active", "Inactive"]);

    select1.setOptionsProperty("count", 2);

  

    //  assign this template to columns 3

    sampleGrid.setColumnTemplate(select1, 3);

Also, another wanted row level filter feature is implemented. This allows having different options list based on some filter function.

Check

http://thej2ee.com/ndemo/test/select_template.html
http://thej2ee.com/ndemo/test/select_filter_template.html

---

I wish text/value were handled by some format, but default table model has no in-built format support, so it'll be too much tweakingâ¦

FYI: In FireFox dropdown is very slow, takes few seconds before it appears...

With filter function

var select2Filter = function(index) {

        var rowIndex = this.getRowProperty("index");

        // alert(rowIndex + " - " + this.getDataProperty("text", 1));

        return index <= (this.getRowProperty("index") % 5);

    };



    //  create select template

    var select2 = new My.Templates.Select;

    select2.setOptionsProperty("texts", ["One", "Two", "Three", "Four", "Five"]);

    select2.setOptionsProperty("values", ["One", "Two", "Three", "Four", "Five"]);

    select2.setOptionsProperty("count", 5);

    select2.setOptionsProperty("filter", select2Filter);

  

    //  assign this template to columns 2

    sampleGrid.setColumnTemplate(select2, 2);

---

Suggestions are welcome :-)

wow. I have been looking for this for a while now!

One suggestion:
Some select boxes I've seen in advance applications allow the user to type a value if the value does not yet exist in the select options.

This is what is called an "unbounded list of values" or "unbounded select" or "unbounded drop-down".

That would be incredible.

Frank

Sudhaker,

you show a sample where you have different Select in two different columns. This allows you to have differnt options in those two selects which is great but is it also possible to have different options for different rows in the same column?

Yes, Check column with options [One, Two, Three, Four, Five]. There is a filter function (allow till index % 5 only, means 7th row will have One and Two as valid options).

http://thej2ee.com/ndemo/test/select_filter_template.html

Only options for those filter will return 'true' will be available for selection...

>> This is what is called an "unbounded list of values" or "unbounded
>> select" or "unbounded drop-down".

That is perhaps not possible with classical Select control. Some people have written editable select control and we can try integrating that... I'm not very good in making cross-browser control. Thet one I made for my previous project runs only on IE6.

Forum search