1. #1
    Touch Premium Member
    Join Date
    Nov 2008
    Posts
    39
    Vote Rating
    1
    vscarpenter@gmail.com is on a distinguished road

      0  

    Default Touch Auto Complete Help

    Touch Auto Complete Help


    Hi everyone. I am trying to implement something like an 'auto-complete' for my Sencha Touch application where the user needs to be able to filter through 1000's of items to select a particular item. So I am implemented this using a form with a text field where I ask the user to type in a few characters of name of the item and then hit search.

    Once they hit search, I am using what they've typed in so far to filter the store. I then use the filtered results to create a modal popup and then display a select list of the items that they can select from - once they select the item, I close the pop-up window and prefill the text area in my form with the selected value. Sounds pretty simple and I have it mostly working.

    I get an error when the user attempts to select an item from the select dropdown list the first time. If the user taps/clicks again, everything works as expected. The error I get is:

    Code:
    Uncaught TypeError: Property '1' of object function (e, args) {
                gen.call(dom, e, o, fn, scope, ename, dom, arguments.callee, args);
            } is not a function
    Ext.gesture.Gesture.Ext.extend.fire
    Ext.gesture.Touch.Ext.extend.onTouchStart
    Ext.gesture.Manager.Ext.AbstractManager.handleTarget
    Ext.gesture.Manager.Ext.AbstractManager.handleTarget
    Ext.gesture.Manager.Ext.AbstractManager.onTouchStart
    (anonymous function)
    I have a sample application that illustrates the issue deployed here:

    http://dl.dropbox.com/u/39023/Notes/autocomplete.html

    Can anyone provide any input on what the issue could be? Any suggestions on improvements? Thanks in advance.

    --Vinny

  2. #2
    Sencha User
    Join Date
    Jul 2010
    Posts
    13
    Vote Rating
    0
    Johnnyger is on a distinguished road

      0  

    Default Same

    Same


    Got the same Error, when choosing an item of the selectfield (Using Sencha Touch 1.1.0)

    Code:
    Uncaught TypeError: Property '1' of object function (e, args) {
                gen.call(dom, e, o, fn, scope, ename, dom, arguments.callee, args);
            } is not a function
    Ext.gesture.Gesture.Ext.extend.firesencha-touch-debug.js:18588
    Ext.gesture.Touch.Ext.extend.onTouchStartsencha-touch-debug.js:18658
    Ext.gesture.Manager.Ext.AbstractManager.handleTargetsencha-touch-debug.js:18348
    Ext.gesture.Manager.Ext.AbstractManager.handleTargetssencha-touch-debug.js:18316
    Ext.gesture.Manager.Ext.AbstractManager.onTouchStartsencha-touch-debug.js:18205
    (anonymous function)
    Code is quite simple:
    Code:
    ntm.views.AddPatient = Ext.extend(Ext.Panel, {
    	layout: {
    		type: 'vbox',
    		align: 'stretch'
    	},
    	floating: true,
    	modal: true,
    	centered: true,
    	width: 320,
    	height: 340,
    	styleHtmlContent: true,
    	mentorSelect: null,
    	
    	initComponent: function() {
    		mentorSelect = new Ext.util.MixedCollection();
    		
    		for (i=0; i< ntm.MentorStore.data.length; i++) {
    			mentorSelect.add({
    				text: ntm.MentorStore.data.items[i].data.first_name,
    				value: ntm.MentorStore.data.items[i].data.dbid
    			});
    		}
    				
    		this.form = new Ext.form.FormPanel({
    			layout: 'auto',
    			items: [{
    				xtype: 'textfield',
    				name: 'first_name',
    				label: 'Vorname'
    			}, {
    				xtype: 'textfield',
    				name: 'last_name',
    				label: 'Nachname'
    			}, {
    				xtype: 'textfield',
    				name: 'address1',
    				label: 'Adresse'
    			}, {
    				xtype: 'textfield',
    				name: 'address2',
    				label: 'Ort'
    			}, {
    				xtype: 'selectfield',
    				name: 'mentor',
    				label: 'Mentor',
    				options: mentorSelect.items
    			}, {
    				xtype: 'button',
    				text: 'Hinzufügen',
    				scope: this,
    				handler: function() {
    					//TODO
    				}
    			}]
    		});
    		
    		this.dockedItems = [{
    			scope: this,
    			xtype: 'toolbar',
    			title: 'Patient hinzufügen',
    			items: [{
    				xtype: 'spacer'
    			}, {
    				scope: this,
    				xtype: 'button',
    				iconCls: 'delete',
    				iconMask: true,
    				ui: 'plain',
    				handler: function() {
    					this.setVisible(false);
    					this.form.reset();
    				}
    				
    			}]
    		}]
    		
    		this.items = this.form;
    		ntm.views.AddPatient.superclass.initComponent.call(this);
    	}
    });
    
    Ext.reg('addPatient', ntm.views.AddPatient);
    Any suggestions?

  3. #3
    Sencha User
    Join Date
    Jul 2010
    Posts
    13
    Vote Rating
    0
    Johnnyger is on a distinguished road

      0  

    Default Floating Panel

    Floating Panel


    Could be a problem with floating "popup"-Panels. Can anyone confirm?

  4. #4
    Sencha User
    Join Date
    Jul 2010
    Posts
    13
    Vote Rating
    0
    Johnnyger is on a distinguished road

      0  

    Default


    push

    Did not resolve the issue so far.
    Can anyone help?

  5. #5
    Sencha User
    Join Date
    May 2007
    Location
    Germany
    Posts
    18
    Vote Rating
    0
    ralf is on a distinguished road

      0  

    Default


    I had the same problem. Worked fine for me after adding "hideOnMaskTap: false" to the forms parent panel.

  6. #6
    Touch Premium Member
    Join Date
    Nov 2008
    Posts
    39
    Vote Rating
    1
    vscarpenter@gmail.com is on a distinguished road

      0  

    Default


    hideOnMaskTap: false didn't work for me. I ended up having the exact same error message and issues.

  7. #7
    Sencha User
    Join Date
    Nov 2010
    Posts
    11
    Vote Rating
    1
    frostfang is on a distinguished road

      1  

    Default Possible solution

    Possible solution


    Hey guys, Just to help those in the future. I don't know if this is the correct solution but it worked for me.

    I had a Ext.Component as my containers that was being floated. I had a nested list inside of it. I was getting the same error you describe when ever someone tapped anywhere after the floated component was shown.

    Originally the component looked like this

    Code:
    var floatContainer = new Ext.Component({
        floating: true
    });
    I then changed the Nested List to have floating: true and changed the component to have hideOnMaskTap: true. Here is the code. The nested list does have docked items inside it but below is what i did to make everything work.

    Code:
    var floatContainer = new Ext.Component({
        floating: true,
        hideOnMaskTap: false,
    });
    
    var nList = new Ext.NestedList({
       floating : true
    });

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