1. #11
    Ext JS Premium Member
    Join Date
    Apr 2011
    Posts
    5
    Vote Rating
    0
    Edhilion is on a distinguished road

      0  

    Default Manual setValue()

    Manual setValue()


    Hi Dario.
    I'm have a little problem when I try the set some values before displaying the checkCombo.
    I don't do anything really tricky, see below :
    Code:
    var combo = Ext.create('Ext.ux.form.field.CheckCombo',
    {
      renderTo: 'checkcombowithall',
      valueField: 'id',
      displayField: 'type',
      store: store,
      addAllSelector: true
    });
    combo.setValue(['1','2']);
    When the checkCombo, everything seems to be fine. The two selected entries are displayed in the combo, seperated by ','. But when I click to open it, no checkbox is checked.
    When I put a breakpoint on your "selectionChange" listener, I see a list (without the "All" entry) with my two values checked.

    I don't really have time for now to investigate, so I report it now.
    If I find something, I'll tell you.

  2. #12
    Ext JS Premium Member
    Join Date
    Apr 2011
    Posts
    5
    Vote Rating
    0
    Edhilion is on a distinguished road

      0  

    Default


    After a little investigation, I have a question :
    Why did you remove the "!me.ignoreSelection" condition in the "onListSelectionChange" override ?

    From ComboBox.js (l.1092) :
    Code:
    onListSelectionChange: function(list, selectedRecords) {
      var me = this,
            isMulti = me.multiSelect,
            hasRecords = selectedRecords.length > 0;
        // Only react to selection if it is not called from setValue, and if our list is
        // expanded (ignores changes to the selection model triggered elsewhere)
        if (!me.ignoreSelection && me.isExpanded) {
            if (!isMulti) {
                Ext.defer(me.collapse, 1, me);
            }
    ...
    From CheckCombo.js (l.144) :
    Code:
    onListSelectionChange: function(list, selectedRecords) {
      var me = this,
            isMulti = me.multiSelect,
            hasRecords = selectedRecords.length > 0;
        // Only react to selection if it is not called from setValue, and if our list is
        // expanded (ignores changes to the selection model triggered elsewhere)
        if (me.isExpanded) {
            if (!isMulti) {
                Ext.defer(me.collapse, 1, me);
            }
    ...
    It seems to work fine if I put it back...

  3. #13
    Sencha User
    Join Date
    Jul 2009
    Posts
    30
    Vote Rating
    7
    da_bar is on a distinguished road

      0  

    Default


    Quote Originally Posted by Edhilion View Post
    Hi Dario.
    I'm have a little problem when I try the set some values before displaying the checkCombo.
    I don't do anything really tricky, see below :
    Code:
    var combo = Ext.create('Ext.ux.form.field.CheckCombo',
    {
      renderTo: 'checkcombowithall',
      valueField: 'id',
      displayField: 'type',
      store: store,
      addAllSelector: true
    });
    combo.setValue(['1','2']);
    When the checkCombo, everything seems to be fine. The two selected entries are displayed in the combo, seperated by ','. But when I click to open it, no checkbox is checked.
    When I put a breakpoint on your "selectionChange" listener, I see a list (without the "All" entry) with my two values checked.

    I don't really have time for now to investigate, so I report it now.
    If I find something, I'll tell you.
    Maybe the id field in your store is not a string but integer so you have to set it like this [1, 2, 3]?

  4. #14
    Sencha User
    Join Date
    Jul 2009
    Posts
    30
    Vote Rating
    7
    da_bar is on a distinguished road

      0  

    Default


    Quote Originally Posted by Edhilion View Post
    After a little investigation, I have a question :
    Why did you remove the "!me.ignoreSelection" condition in the "onListSelectionChange" override ?

    From ComboBox.js (l.1092) :
    Code:
    onListSelectionChange: function(list, selectedRecords) {
      var me = this,
            isMulti = me.multiSelect,
            hasRecords = selectedRecords.length > 0;
        // Only react to selection if it is not called from setValue, and if our list is
        // expanded (ignores changes to the selection model triggered elsewhere)
        if (!me.ignoreSelection && me.isExpanded) {
            if (!isMulti) {
                Ext.defer(me.collapse, 1, me);
            }
    ...
    From CheckCombo.js (l.144) :
    Code:
    onListSelectionChange: function(list, selectedRecords) {
      var me = this,
            isMulti = me.multiSelect,
            hasRecords = selectedRecords.length > 0;
        // Only react to selection if it is not called from setValue, and if our list is
        // expanded (ignores changes to the selection model triggered elsewhere)
        if (me.isExpanded) {
            if (!isMulti) {
                Ext.defer(me.collapse, 1, me);
            }
    ...
    It seems to work fine if I put it back...
    Well I really don't know why I removed it maybe I thought it's not important

  5. #15
    Ext JS Premium Member
    Join Date
    Jan 2010
    Posts
    24
    Vote Rating
    0
    bbimber is on a distinguished road

      0  

    Default


    This is a great extension. In case anyone's interested, here's a version (ext 4.1) that solves the problem of the last list item getting clipped.

    Code:
    Ext.define('LABKEY.layout.component.BoundList', {
        extend: 'Ext.layout.component.BoundList',
        alias: 'layout.boundlist-checkbox',
        beginLayout: function(ownerContext){
            this.callParent(arguments);
            ownerContext.listContext = ownerContext.getEl('outerEl');
        },
        measureContentHeight: function(ownerContext) {
            return this.owner.outerEl.getHeight();
        }
    });
    
    
    Ext.define('Ext.ux.CheckCombo',
    {
        extend: 'Ext.form.field.ComboBox',
        alias: 'widget.checkcombo',
        multiSelect: true,
        addAllSelector: false,
        allText: 'All',
        delim: ';',
    
    
        initComponent: function()
        {
            this.listConfig = this.listConfig || {};
            var me = this;
            Ext.apply(this.listConfig, {
                tpl:[
                    '<ul><tpl for=".">',
                        '<li role="option" class="' + Ext.baseCSSPrefix + 'boundlist-item"><span class="' + Ext.baseCSSPrefix + 'combo-checker">&nbsp;</span> {' + this.displayField + '}</li>',
                    '</tpl></ul>'
                ],
                childEls: [
                    'listEl',
                    'outerEl',
                    'checkAllEl'
                ],
                renderTpl: [
                    '<div id="{id}-outerEl" style="overflow:auto" width=auto;>',
                    (this.addAllSelector ? '<div id="{id}-checkAllEl" class="' + Ext.baseCSSPrefix + 'boundlist-item" role="option"><span class="' + Ext.baseCSSPrefix + 'combo-checker">&nbsp;</span> '+this.allText+'</div>' : ''),
                    '<div id="{id}-listEl" class="{baseCls}-list-ct"></div>',
                    '{%',
                        'var me=values.$comp, pagingToolbar=me.pagingToolbar;',
                        'if (pagingToolbar) {',
                            'pagingToolbar.ownerLayout = me.componentLayout;',
                            'Ext.DomHelper.generateMarkup(pagingToolbar.getRenderTree(), out);',
                        '}',
                    '%}',
                    '</div>',
                    {
                        disableFormats: true
                    }
                ],
                componentLayout: 'boundlist-checkbox',
                onDestroy: function() {
                    Ext.destroyMembers(this, 'pagingToolbar', 'outerEl', 'listEl');
                    this.callParent();
                }
            });
    
    
            this.callParent(arguments);
        },
    
    
        createPicker: function()
        {
            var picker = this.callParent(arguments);
            picker.on('render', function(picker){
                if (picker.checkAllEl)
                {
                    picker.checkAllEl.addClsOnOver(Ext.baseCSSPrefix + 'boundlist-item-over');
    
    
                    picker.checkAllEl.on('click', function(e)
                    {
                        if(picker.checkAllEl.hasCls(Ext.baseCSSPrefix + 'boundlist-selected'))
                        {
                            picker.checkAllEl.removeCls(Ext.baseCSSPrefix + 'boundlist-selected');
                            this.setValue('');
                            this.fireEvent('select', this, []);
                        }
                        else
                        {
                            var records = [];
                            this.store.each(function(record)
                            {
                                records.push(record);
                            });
                            picker.checkAllEl.addCls(Ext.baseCSSPrefix + 'boundlist-selected');
                            this.select(records);
                            this.fireEvent('select', this, records);
                        }
                    }, this);
                }
            }, this, {single: true});
            return picker;
        },
    
    
        getValue: function()
        {
            return this.value.join(this.delim);
        },
    
    
        getValueAsArray: function(){
            return this.value;
        },
    
    
        getSubmitValue: function()
        {
            return this.getValue();
        },
    
    
        onListSelectionChange: function(list, selectedRecords)
        {
            this.callParent(arguments);
    
    
            var checker = this.getPicker().checkAllEl;
            if(checker)
            {
                if(selectedRecords.length == this.store.getTotalCount())
                    checker.addCls(Ext.baseCSSPrefix + 'boundlist-selected');
                else
                    checker.removeCls(Ext.baseCSSPrefix + 'boundlist-selected');
            }
        }
    });

  6. #16
    Sencha User
    Join Date
    Jul 2012
    Posts
    235
    Vote Rating
    0
    chandan.behura is on a distinguished road

      0  

    Default


    Hi,

    I tried the example but get stacked in the
    Ext.ux.CheckCombo

    Error is comming that 'ux.CheckCombo.js' is not found.I added the UX folder to the path.
    again i saw that inside the ux there is no such file.And also didnot get anything
    in sencha API related to Ux.Check combo.Please help me out.

  7. #17
    Sencha User
    Join Date
    Jul 2012
    Posts
    235
    Vote Rating
    0
    chandan.behura is on a distinguished road

      0  

    Default


    Unable to find the ux.CheckCombo in ux folder.How i will get that.In sencha i also didnot fid for Ext.ux.CheckCombo.
    [CODE] Ext.Loader.setConfig({ enabled: true });
    //Ext.Loader.setPath('Ext.ux', '/ux');


    var store = Ext.create('Ext.data.Store',
    {
    fields: ['id', 'type'],
    data:
    [
    {id: '1', type: 'option one'},
    {id: '2', type: 'option two'},
    {id: '3', type: 'option three'},
    {id: '4', type: 'option four'},
    {id: '5', type: 'option five'},
    {id: '6', type: 'option six'},
    {id: '7', type: 'option seven'}
    ]
    });


    Ext.onReady(function()
    {
    Ext.create('Ext.ux.CheckCombo',
    {
    renderTo: Ext.getBody(),
    valueField: 'id',
    displayField: 'type',
    store: store,
    addAllSelector: true
    });

    });[CODE]
    error:GET http://localhost:8080/Project_ExtD4/...=1346341733982 404 (Not Found)
    TypeError: 'null' is not a constructor (evaluating 'new c(a[0])')



    Inside the Ux folder no CheckCombo.js.

  8. #18
    Ext JS Premium Member
    Join Date
    Mar 2009
    Posts
    1
    Vote Rating
    0
    pkolanu is on a distinguished road

      0  

    Default


    How do we select the checkbox by default, suppose my default values are Active, Inactive in the drop down, I need both of them selected by default (initial load)

  9. #19
    Sencha User
    Join Date
    Oct 2008
    Posts
    4
    Vote Rating
    0
    xeni is on a distinguished road

      0  

    Default editable

    editable


    My combo is also editable but when I want to change the informations from it the value is set to null. How can I edit in combo?

  10. #20
    Sencha User
    Join Date
    Jul 2009
    Posts
    30
    Vote Rating
    7
    da_bar is on a distinguished road

      0  

    Default


    Quote Originally Posted by zeno View Post
    when the record is too long, the scrollbar's footer is hide, see the picture,
    Fixed, sorry it took too long

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi