Hybrid View

  1. #1
    Sencha Premium Member tintin's Avatar
    Join Date
    Apr 2008
    Posts
    3
    Vote Rating
    0
    tintin is on a distinguished road

      0  

    Post Ext.ux.BoxSelect (like the Facebook's one)

    Ext.ux.BoxSelect (like the Facebook's one)


    After having seen this, read this, and this, I wrote this extension.



    Demo

    Usage:
    • Items can be deleted individually
    • Managed keys: backspace, delete, left/right arrows

    Todo list:
    • Manage some combo config options like allowBlank=false

    Tested in IE6/7, FF2/3, Opera, Chrome.

    All advices are welcome

    04.30.2008 : Corrected bug on delete key pressed

    09.15.2008 : NEW VERSION
    • File renamed (initially it was intended to be a plugin but not anymore)
    • Duplicate entries avoided (it's not an option, otherwise it wouldn't work correctly)
    • Right rendering in different browsers (rounded corners only in Gecko)
    • New methods like setValue, enable, disable
    • Initial value handled in different ways (collection of record, array of IDs, string of IDs)
    Attached Files
    Usually named efattal
    ExtJS Contributions:
    Ext.ux.ToastWindow | Ext.ux.BoxSelect | Ext.ux.VirtualKeyboard

  2. #2
    Sencha - Community Support Team VinylFox's Avatar
    Join Date
    Mar 2007
    Location
    Baltimore, MD
    Posts
    1,501
    Vote Rating
    7
    VinylFox will become famous soon enough VinylFox will become famous soon enough

      0  

    Default


    Love it...you come up with some sweet stuff. Love toast as well.

    Keep up the good work.

  3. #3
    Sencha User chalu's Avatar
    Join Date
    Feb 2008
    Location
    Benin City, Nigeria
    Posts
    480
    Vote Rating
    1
    chalu is on a distinguished road

      0  

    Wink Wow

    Wow


    This is awesome, you've handed me the base for my next extension . Keep it up

  4. #4
    Sencha User krycek's Avatar
    Join Date
    Jun 2007
    Posts
    96
    Vote Rating
    0
    krycek is on a distinguished road

      0  

    Default


    tintin, just see your extension.

    Great great work.

    Congratulations!


  5. #5
    Ext JS Premium Member stever's Avatar
    Join Date
    Mar 2007
    Posts
    1,407
    Vote Rating
    6
    stever will become famous soon enough stever will become famous soon enough

      0  

    Default


    Very nice!

  6. #6
    Ext Premium Member
    Join Date
    Mar 2007
    Posts
    175
    Vote Rating
    0
    SteveEisner is on a distinguished road

      0  

    Default


    This rocks. Great job.

    I've noticed from the demo that there are some selection issues:
    * when you start to type, and then back up erasing the entire word, it selects the previous "resolved" item rather than leaving you with a caret on empty text
    * cursor left and right gets confused sometimes (again, probably around empty text)

    I haven't used the component yet but if when do I'll try to figure out what's breaking those
    Steve

  7. #7
    Ext User
    Join Date
    Oct 2007
    Posts
    25
    Vote Rating
    0
    sunny_boy is on a distinguished road

      0  

    Default


    Tintin - great extension thanks

    I was just testing in IE6, and noticed that if the length of the items inside the box become larger than the box itself, the items do not wrap correctly - see screenshot.

    Works fine in FF.

    I've had a look, but have not yet found a fix.

    Any ideas?
    Attached Images

  8. #8
    Sencha User
    Join Date
    Aug 2007
    Location
    Munich, Germany
    Posts
    135
    Vote Rating
    0
    gelleneu is on a distinguished road

      0  

    Default Question

    Question


    I have a question about this great extension.

    I use it inside a form, and I want to save the items in a database.

    When i submit my form, the items will be appended as post vars in this way:

    (field name = "boxselectfield", values are Id's of the items)

    boxselectfield=23&boxselectfield=25&boxselectfield=

    Reading this post vars in PHP with $_REQUEST['boxselectfield'] results only the last
    value, and this value is empty.

    Has someone experience with that?

    My next question: if an item is not in the list, i want to add it to the list automatically (a database operation is needed for that.)

    Is there are solution for that?

    Thanks!

  9. #9
    Sencha User
    Join Date
    Nov 2007
    Location
    London, UK
    Posts
    583
    Vote Rating
    0
    mabello is on a distinguished road

      0  

    Default


    Very very nice extension, great job!
    A small suggestion: why don't you also insert in your TextField a trigger button (like a combo) that on click show the list of all the possibility so that you can also see the entire list of possibilty and chose from that list? For now the list appears only digiting I think, it seems useful to me!
    Anyway, keep up the great work!

  10. #10
    Sencha User
    Join Date
    Sep 2007
    Location
    Poland, Cracow
    Posts
    67
    Vote Rating
    0
    Evolic is on a distinguished road

      0  

    Lightbulb


    Quote Originally Posted by gelleneu View Post
    I have a question about this great extension.

    I use it inside a form, and I want to save the items in a database.

    When i submit my form, the items will be appended as post vars in this way:

    (field name = "boxselectfield", values are Id's of the items)

    boxselectfield=23&boxselectfield=25&boxselectfield=

    Reading this post vars in PHP with $_REQUEST['boxselectfield'] results only the last
    value, and this value is empty.

    Has someone experience with that?

    My next question: if an item is not in the list, i want to add it to the list automatically (a database operation is needed for that.)

    Is there are solution for that?

    Thanks!
    I found something working:
    Code:
        addBox: function(id, caption){
            var box = new Ext.ux.Box({
                id: 'Box_' + id,
                maininput: this.maininput,
                renderTo: this.holder,
                className: this.options['className'],
                caption: caption,
                'value': id,
                listeners: {
                    'remove': function(box){
                        this.selectedValues[box.value] = null;
                    },
                    scope: this
                }
            });
            box.render();
    
            if (this.hiddenName) {
                var name = this.hiddenName;
            } else {
                var name = this.name + '[' + id + ']';
            }
    
            box.hidden = this.el.insertSibling({
                'tag':'input',
                'type':'hidden',
                //'value': id,
                'name': name
            },'before', true);
    PHP $_POST:
    Code:
    Array
    (
        [states] => Array
            (
                [AL] => 
                [NY] => 
                [MN] => 
                [New obj 1] => 
                [New obj 2] => 
            )
        [subject] => 
        [msg] => 
    )

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar