1. #131
    Sencha User Remy's Avatar
    Join Date
    Apr 2008
    Posts
    297
    Vote Rating
    0
    Remy is on a distinguished road

      0  

    Default


    Is it possible to use this UX to transform an existing HTML select element?

  2. #132
    Ext User
    Join Date
    Jun 2009
    Posts
    2
    Vote Rating
    0
    beeuser is on a distinguished road

      0  

    Default Itemselector Grid form

    Itemselector Grid form


    Hello,

    Is it possible to show me an example of how to bind an itemselector to a form?

    I mean I have a grid bound to a form, and when I click on a row in the grid, the form fills in with the data from that row, just like this one:

    http://extjs.com/deploy/dev/examples...form-grid.html

    But I'd like to know how to fill the data for the itemselector when a row in the grid is selected.

    Thanks.

  3. #133
    Ext User
    Join Date
    Sep 2007
    Posts
    97
    Vote Rating
    0
    talshadar is on a distinguished road

      0  

    Exclamation alignment help

    alignment help


    I've used this extension alot so when it came time for me to have to create my own, I used it as an example. And it seems to work (haven't finished testing yet) but I can't fix the layout properly. Basically I'm trying to get 2 combo boxes to line up beside each other. Nothing was working and the itemSelector version kind of does what I need so I based mine off of it. I'm incluidng my extension code as well as the code to use it. I'm hoping some one can give me a pointer.

    DualCombo Extension

    Code:
    Ext.namespace("Ext.ux");
    
    Ext.ux.DualCombo = function(config)
    {
        Ext.ux.DualCombo.superclass.constructor.call(this, config);
        //don't think I need to actually add anything else here for it to work
    };
    
    Ext.extend(Ext.ux.DualCombo, Ext.form.ComboBox, {
    
        //basic config and properties
        firstWidth          : 100,
        secondWidth         : 100,
        firstId             : null,
        secondId            : null,
        firstTabIndex       : 1,
        secondTabIndex      : 2,
        firstDataFlds       : null,
        secondDataFlds      : null,
        firstData           : null,
        secondData          : null,
        firstDelimiter      : ',',
        secondDelimiter     : ',',
        firstStore          : null,
        secondStore         : null,
        firstDisplayFld     : null,
        secondDisplayFld    : null,
        firstValueFld       : null,
        secondValueFld      : null,
        firstSortFld        : null,
        secondSortFld       : null,
        firstSortDir        : 'ASC',
        secondSortDir       : 'ASC',
        firstEmptyTxt       : 'Please select ...',
        secondEmptyTxt      : 'Please select ...',
        isFormField         : true,
        fieldLabel          : '',
        selectOnFocus       : true,
        typeAhead           : true,
        
        onRender : function(ct, position) {
    
            var divFirst, divSecond, table, tr, td;
            
            this.el = ct;
            
            divFirst = this.el.createChild({tag:'div', cls:'.ux-dcombo-first'});
            divSecond = this.el.createChild({tag:'div', cls:'.ux-dcombo-second'});
            
            //table = this.el.createChild({tag:'table'}); //, cls:'ux-mselect-icons'});
            //table.setHeight(this.msHeight);
            //tr = table.createChild({tag: 'tr'});
            //if (tr.dom.tagName.toUpperCase() == 'TBODY') { tr = tr.child('tr'); }
    
            //td = Ext.get(tr.dom.appendChild(document.createElement('td')));
            //td.dom.vAlign='middle';
    
            this.FirstCombo = new Ext.form.ComboBox({fieldLabel:this.fieldLabel,id:this.firstId,tabIndex:this.firstTabIndex, 
                            hiddenName:this.hiddenName,displayField:this.firstDisplayFld,valueField:this.firstValueFld,
                            store:this.firstStore,width:this.firstWidth,selectOnFocus:this.selectOnFocus,typeAhead:this.typeAhead,mode:"local",
                            forceSelection: true,triggerAction: "all",emptyText:this.firstEmptyText});
    
            this.SecondCombo = new Ext.form.ComboBox({fieldLabel:this.fieldLabel,id:this.secondId,tabIndex:this.secondTabIndex, 
                            hiddenName:this.hiddenName,displayField:this.secondDisplayFld,valueField:this.secondValueFld,
                            store:this.secondStore,width:this.secondWidth,selectOnFocus:this.selectOnFocus,typeAhead:this.typeAhead,mode:"local",
                            forceSelection: true,triggerAction: "all",emptyText:this.secondEmptyText});
                            
            this.FirstCombo.render(divFirst);
            this.SecondCombo.render(divSecond);
            
            //this.defaultAutoCreate.name = this.name;
            //this.hiddenName = this.name;
            //this.hiddenField = ct.createChild(this.defaultAutoCreate);
    
        }
    
    });
    Using it:

    Code:
            cboSStatus = new Ext.ux.DualCombo
            ({
                firstWidth          : 50,
                secondWidth         : 180,
                firstId             : 'cmbId',
                secondId            : 'sStatusID',
                firstTabIndex       : 10,
                secondTabIndex      : 11,
                //firstDataFlds       : null,
                //secondDataFlds      : null,
                //firstData           : null,
                //secondData          : null,
                //firstDelimiter      : ',',
                //secondDelimiter     : ',',
                firstStore          : storeCondition,
                secondStore         : dsStatus,
                firstDisplayFld     : 'condition',
                secondDisplayFld    : 'status',
                firstValueFld       : 'conditionid',
                secondValueFld      : 'code',
                firstEmptyTxt       : 'Condition...',
                secondEmptyTxt      : 'Please select ...',
                isFormField         : true,
                fieldLabel          : 'Status',
                selectOnFocus       : true,
                typeAhead           : true        
            });
    It creates 2 combos with the relevant data exactly the way I want - it just doesn't align them - it puts one on top of the other instead of beside each other. I'm hoping some one can catch what I'm missing.

    Thanks!!

  4. #134
    Ext JS Premium Member NoahK17's Avatar
    Join Date
    Apr 2008
    Location
    Atlanta, GA
    Posts
    518
    Vote Rating
    1
    NoahK17 is on a distinguished road

      0  

    Default


    Component: xtype: Multiselect
    Version ExtJS: 2.2.1
    Browser: IE 6
    Layout: Column

    Result? Component does not show up at all.
    Attached Images
    Noah
    Senior Web Developer
    NBA.com

  5. #135
    Sencha User
    Join Date
    Oct 2008
    Posts
    12
    Vote Rating
    0
    bobjbain is on a distinguished road

      0  

    Default


    Hi,

    I've just implemented the ItemSelector using Ext3.0 and am having problems with the sorting.

    I am using a pre-loaded DataStoe as my source for the fromList, which works fine (it has 525 items). However when I move an item from the from list to the toList and then back again it always appears at the bottom of the fromList.

    I would like to have the items resorted when it's moved back.

    I have tried using the fromSortField in the ItemSelector and SortFied in the DataStore but to no avail!!

    Anyone have any ideas

  6. #136
    Ext User joutsource's Avatar
    Join Date
    Jul 2009
    Location
    Ahmedabad,India
    Posts
    6
    Vote Rating
    0
    joutsource is on a distinguished road

      0  

    Default Scroll to Selected Item

    Scroll to Selected Item


    Hi,

    Thanks for this great add-on.

    I integrated in our application and seems working except an issue of scrollbar position.

    We have 10+ items in list and we have restricted height such that it only show 5 items at a time and rest are visible when we scroll.

    We are retrieving the selected values from database and then select them using setValue method.

    Now the problem is, view is not scrolling down to the position of selected item.

  7. #137
    Ext User
    Join Date
    Oct 2009
    Posts
    59
    Vote Rating
    0
    jsemmanuel is on a distinguished road

      0  

    Default Problem of scrollbar outside the multiselect area on right in firefox 3.5

    Problem of scrollbar outside the multiselect area on right in firefox 3.5


    Hi

    I have the following code (using Ext JS Library 3.0.3)
    Code:
    <html>
        <head>
            <title>Welcome</title>
    
        <link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css">
        <script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
        <script type="text/javascript" src="extjs/ext-all.js"></script>
        <link rel="stylesheet" type="text/css" href="css/multiselect.css">
        <script type="text/javascript" src="js/ux/Multiselect.js"></script>
        <script type="text/javascript" src="js/ux/DDView.js"></script>
        <script type="text/javascript" src="multiselect testcase.js"></script>
        </head>
    <body>
    
    
    </body>
    </html>
    Code:
    Ext.onReady(function(){
        Ext.QuickTips.init();
        var countryStore=new Ext.data.ArrayStore({
            baseParams:{task:'list_countries'},
            fields:['id','name'],
            mode:'local',
            data:[
            ['il','IL Country'],
            ['ep','EP Country'],
            ['br','BR Country'],
            ['er','ER Country'],
            ['vd','VD Country'],
            ['bf','BF Country'],
            ['gc','GC Country'],
            ['mp','MP Country']
            ],
            autoLoad:true
        })
        var cmpAddForm=new Ext.form.FormPanel({
            bodyStyle:'padding:10px',
            width:500,
            height:200,
            items:[
                new Ext.form.TextField({
                    name:'name',
                    fieldLabel:'Campaign Name',
                    allowBlank: false,
                    width:340
                }),
                            {
                                xtype:'multiselect',
                                store:countryStore,
                                displayField:'name',
                                valueField:'id',
                                width:250,
                                height:100,
                                margins:0,
                                name:'geo',
                                fieldLabel:'Target Countries',
                                legend:'Select multiple countries'
                            }
            ]
        })
        var cmpAddWindow=new Ext.Window({
            title:'Add a campaign',
            width:550,
            layout:'fit',
            items:[
                cmpAddForm
            ],
            listeners:{
                show: function (){
                    cmpAddForm.getForm().reset();
                }
            },
            closeAction:'hide'
        })
        cmpAddWindow.show(); 
    })
    It shows fine on chrome, ie and safari but displays incorrectly in firefox 3.5. Screen shots are attached. Notice that in firefox I get an extra scrollbar towards the right.
    Attached Images

  8. #138
    Sencha User
    Join Date
    Dec 2007
    Posts
    39
    Vote Rating
    0
    danderson is on a distinguished road

      0  

    Default


    Quote Originally Posted by jsemmanuel View Post
    It shows fine on chrome, ie and safari but displays incorrectly in firefox 3.5. Screen shots are attached. Notice that in firefox I get an extra scrollbar towards the right.
    have you found a remedy for this, by chance? the only workaround i've found was to add a 10px margin to the bottom http://www.extjs.com/forum/showthread.php?t=77693

    thx.

  9. #139
    Ext User
    Join Date
    Dec 2008
    Posts
    48
    Vote Rating
    0
    celiane is on a distinguished road

      0  

    Lightbulb


    Hello,

    Could you add the following:

    - In the xtype: 'multiselect', could you add checkbox for selection (easier than CTRL, more readable)
    - In the reload, add a mask which indicates that the load is being
    - In the getValue () return names <input name="" and values <input value=""

    thank you

  10. #140
    Ext User
    Join Date
    Sep 2007
    Posts
    97
    Vote Rating
    0
    talshadar is on a distinguished road

      0  

    Default don't know if anyone will see/answer this

    don't know if anyone will see/answer this


    I"m using the item selector with a data source grabbed from a database - one for the From and one for To fields. I can load data into both without a problem but what I'm trying to figure out how to do is load the full list in the From field - but move the selected items (a separate dataset I pull from another table) out of the From field into the To field. I can't find any information on doing this.

    Can anyone give a suggestion??

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