Page 3 of 3 FirstFirst 123
Results 21 to 23 of 23

Thread: ComboBox using Grid instead of BoundList

    Looks like we can't reproduce the issue or there's a problem in the test case provided.
  1. #21
    Sencha User
    Join Date
    Jan 2011
    Posts
    5

    Default

    Quote Originally Posted by batman3000 View Post
    If this is so "simple", then how do you add a grid/tree panel as picker that properly handles key events?

    Just overriding createPicker() results in a grid panel whose rows can only be selected with the mouse
    I hope that fixed it in correct way )
    few hours of trying, it is first time for me, that i am getting so deep in Ext
    we need to add overriding of 'onExpand', but i realy don't know what in that method is important, so i add there all i found in ComboBox.js and other component that i use Ext.ux.form.field.BoxSelect but now it works for me, if some one can correct my code, would be nice )

    Code:
        onExpand: function() {
            var me = this,
                keyNav = me.listKeyNav,
                selectOnTab = me.selectOnTab,
                picker = me.getPicker();
    
    
            // Handle BoundList navigation from the input field. Insert a tab listener specially to enable selectOnTab.
            keyNav = me.listKeyNav = keyNav = new Ext.util.KeyNav(this.inputEl, {
                scope: picker,
                up: function() {
                    if(this.coursorPosition == null || this.coursorPosition == 0){
                        this.coursorPosition = this.getStore().count()-1;
                    }
                    this.coursorPosition = this.coursorPosition-1;
                    var selModel = this.getSelectionModel();
                    selModel.select(this.coursorPosition);
                    this.getView().getNode(this.coursorPosition).scrollIntoView();
                },
                down: function() {
                    if(this.coursorPosition == null || this.coursorPosition == this.getStore().count()-1){
                        this.coursorPosition = 0;
                    }
                    this.coursorPosition = this.coursorPosition+1;
                    var selModel = this.getSelectionModel();
                    selModel.select(this.coursorPosition);
                    this.getView().getNode(this.coursorPosition).scrollIntoView();
                }
            });
    
    
            // While list is expanded, stop tab monitoring from Ext.form.field.Trigger so it doesn't short-circuit selectOnTab
            if (selectOnTab) {
                me.ignoreMonitorTab = true;
            }
    
    
            Ext.defer(keyNav.enable, 1, keyNav); //wait a bit so it doesn't react to the down arrow opening the picker
            me.inputEl.focus();
    
    
            if (keyNav || !me.filterPickList) {
                return;
            }
            keyNav = me.listKeyNav;
            keyNav.highlightAt = function(index) {
                var boundList = this.boundList,
                    item = boundList.all.item(index),
                    len = boundList.all.getCount(),
                    direction;
    
    
                if (item && item.hasCls('x-boundlist-selected')) {
                    if ((index == 0) || !boundList.highlightedItem || (boundList.indexOf(boundList.highlightedItem) < index)) {
                        direction = 1;
                    } else {
                        direction = -1;
                    }
                    do {
                        index = index + direction;
                        item = boundList.all.item(index);
                    } while ((index > 0) && (index < len) && item.hasCls('x-boundlist-selected'));
    
    
                    if (item.hasCls('x-boundlist-selected')) {
                        return;
                    }
                }
    
    
                if (item) {
                    item = item.dom;
                    boundList.highlightItem(item);
                    boundList.getTargetEl().scrollChildIntoView(item, false);
                }
            };
        }

  2. #22
    Sencha User
    Join Date
    Jul 2012
    Posts
    13

    Default

    I have implemented this code but when i am starting to write in combo i get error like 'Uncaught TypeError: Object [object Object] has no method 'refresh 'I am using Extjs 4.1.3 mvc..
    What to do now??

  3. #23
    Sencha User
    Join Date
    Jun 2010
    Posts
    12

    Default

    For what it's worth, I've gone with my own implementation of this concept. I've put the code on GitHub, and made some examples visible online.

Page 3 of 3 FirstFirst 123

Similar Threads

  1. Replies: 3
    Last Post: 9 May 2011, 1:23 AM
  2. [CLOSED] Combobox in GXT 2.1
    By amotamed in forum Ext GWT: Bugs (2.x)
    Replies: 1
    Last Post: 6 Jan 2010, 5:06 AM
  3. [OPEN] [2.2][DUP][CLOSED] ComboBox in IE
    By JamesMa in forum Ext 2.x: Bugs
    Replies: 3
    Last Post: 28 Sep 2008, 4:28 AM
  4. Replies: 2
    Last Post: 20 Oct 2007, 7:50 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •