1. #1
    Sencha User
    Join Date
    May 2011
    Posts
    14
    Vote Rating
    0
    jul1an is on a distinguished road

      0  

    Default Unanswered: Remote Combo Box (JSON)

    Unanswered: Remote Combo Box (JSON)


    Hello, I have a problem creating a edit form with a combobox with remote AJAX store

    This is my source code:

    PlaceForm.js
    Code:
    Ext.define('Place.view.place.PlaceForm', {
        extend: 'Ext.form.Panel',
        
        alias: 'widget.placeform',
        
        title: 'Add a place',
        
        frame: true,
        
        bodyPadding: 5,
    
        layout: 'anchor',
        
        defaults: {
            anchor: '100%'
        },
    
        items: [
            {
            	fieldLabel: 'Name',
            	name: 'name',
            	xtype: 'textfield',
            	allowBlank: false
            },
            {
            	fieldLabel: 'Country',
            	name: 'country',
            	xtype: 'combo',
            	store: 'CountryStore',
            	valueField: 'id',
            	displayField: 'name',
            	allowBlank: false,
            	editable: false,
            	triggerAction: 'all',
            	id:'combocountry',
            	mode: 'local'
            },
    
            ...
    CountryStore.js
    Code:
    Ext.define('Place.store.CountryStore', {
        extend: 'Ext.data.Store',
        
        model: 'Place.model.CountryModel'
    });
    CountryModel.js
    Code:
    Ext.define('Place.model.CountryModel', {
        extend: 'Ext.data.Model',
    
        proxy: {
            type: 'ajax',
            url: '/api/country/'
        },
        
        fields: [
            'id',
            'name'
        ]
      
    });
    I have a tree on the left side with items and when somebody select an item I create a new tab with edit form, and call load so form can read remote data.

    Code:
    form = Ext.ClassManager.instantiateByAlias(formAlias, {
        url: url,
        node_id: selection.data.node_id,
        node_name: selection.data.name
    });
    
    this.getTab().removeAll();
    this.getTab().add(form);
    
    form.load({url: url, method:'GET', waitMsg: 'Loading...'});
    I see that combo box reads remote data, but there is no selected value in combo, no mather that the form have a correct value for this field.



    And when I open combo box for the first time it reads once again the values from database ?!?



    The first problem (not selected combo box value) is happening only the first time I create a tab. On the next tab which have a new form and a new combo box created, the correct combo value is selected. Anyway the second problem remain, when combo box is opened for the first time in tab it loads data again

    What I'm doing wrong?

    This is what AJAX I return for form values:
    Code:
    {
      "data": {
        "city": "\u0421\u043e\u0444\u0438\u044f",
        "name": "\u0414\u0438\u0432\u0430\u043a\u0430",
        "cross_street": "\u0443\u043b. \u0425\u0430\u043d \u0410\u0441\u043f\u0430\u0440\u0443\u0445",
        "country": "BG",
        "twitter": null,
        "phone": "02/986 6971",
        "state": null,
        "address": "\u0443\u043b. 6-\u0442\u0438 \u0441\u0435\u043f\u0442\u0435\u043c\u0432\u0440\u0438 41\u0410",
        "id": 6
      },
      "success": true
    }
    And this is what I return for combo box values:
    Code:
    [
      {
        "id": "BF",
        "name": "Burkina Faso"
      },
      {
        "id": "BG",
        "name": "Bulgaria"
      },
      {
        "id": "BH",
        "name": "Bahrain"
      },
      ...
      {
        "id": "ZW",
        "name": "Zimbabwe"
      }
    ]

  2. #2
    Sencha User
    Join Date
    May 2011
    Posts
    14
    Vote Rating
    0
    jul1an is on a distinguished road

      0  

    Default


    I think I managed to correct the problem, with missing initial value in combo box

    PlaceForm.js
    Code:
    Ext.define('Place.view.place.PlaceForm', {
        extend: 'Ext.form.Panel',
        
        alias: 'widget.placeform',
        
        title: 'Add a place',
        
        frame: true,
        
        bodyPadding: 5,
    
        layout: 'anchor',
        
        defaults: {
            anchor: '100%'
        },
    
        items: [
            {
            	fieldLabel: 'Name',
            	name: 'name',
            	xtype: 'textfield',
            	allowBlank: false
            },
            {
            	fieldLabel: 'Country',
            	name: 'country',
            	xtype: 'combo',
            	store: 'CountryStore',
            	valueField: 'id',
            	displayField: 'name',
            	allowBlank: false,
            	editable: false,
            	triggerAction: 'all',
            	id:'combocountry',
            	mode: 'remote'
            },
    
            ...
    CountryStore.js
    Code:
    Ext.define('Place.store.CountryStore', {
        extend: 'Ext.data.Store',
        
        model: 'Place.model.CountryModel',
        
        autoLoad: true
    });
    But why when I open combo box for the first time it read its values again?

    And what is the right JSON that I have to return for combo values? (Mine is also working)

  3. #3
    Sencha User
    Join Date
    May 2011
    Posts
    14
    Vote Rating
    0
    jul1an is on a distinguished road

      0  

    Default


    But now the countries are also loaded once when I start web application ?

  4. #4
    Sencha User
    Join Date
    May 2011
    Posts
    14
    Vote Rating
    0
    jul1an is on a distinguished road

      0  

    Default


    I found that I have an additional form code so it now works but I can't see any logic in it. Place what is the correct way to make all of this?

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