Threaded View

  1. #1
    Sencha User
    Join Date
    Mar 2012
    Posts
    20
    Vote Rating
    0
    floraoma2000-extjs is on a distinguished road

      0  

    Default Answered: Dynamically load items for radiogroup

    Answered: Dynamically load items for radiogroup


    Hi all,
    I need help for my problem (ExtJs 4) . I want to load some items (data from my database) for my radiogroup dynamically.

    First of all I tried to solve the problem - step by step - by loading the items into an array like this.
    HTML Code:
    var radiogroup = [
       { boxLabel: 'Item 11', name: 'rb', inputValue: '1' },
       { boxLabel: 'Item 21', name: 'rb', inputValue: '2' },
       { boxLabel: 'Item 31', name: 'rb', inputValue: '3' }
    ];
    
    Ext.create('Ext.form.Panel', {
        title: 'RadioGroup Example',
        renderTo: Ext.getBody(),
        items:[{
            xtype: 'radiogroup',
            fieldLabel: 'RadioGroup',
            items: radiogroup
        }]
    });    

    This code works fine !

    The next step like this works fine too.
    I load the items via a store.

    HTML Code:
    Ext.onReady(function () {
    var store_fest = Ext.create('Ext.data.Store', {
        fields: ["boxLabel", "name", "inputValue"],   
        data:{'groupitems':[
            { boxLabel: 'Item 1x', name: 'rb', inputValue: '1' },
            { boxLabel: 'Item 2x', name: 'rb', inputValue: '2' },
            { boxLabel: 'Item 3x', name: 'rb', inputValue: '3' }
        ]},
        proxy: {
            type: 'memory',
            reader: {
                type: 'json',
                root: 'groupitems'
            }
        }    
    });
    
    var radioArray = [];
    for (var i = 0; i < store_fest.data.length; i++) {  
        radioArray.push(store_fest.data.items[i].data); 
    }
    
    Ext.create('Ext.form.Panel', {
        title: 'RadioGroup Example',
        renderTo: Ext.getBody(),
        items:[{
            xtype: 'radiogroup',
            fieldLabel: 'RadioGroup',
            items: radioArray
        }]
    });    
    });

    The response data-format of a database select is JSON. So now I want to load the items reading a json store .This doesn't work. Here my code

    HTML Code:
    Ext.onReady(function () {
    var store_json = Ext.create('Ext.data.JsonStore', {
        storeId: 'radio',
        fields: ['boxLabel', 'name', 'inputValue'],  
        proxy: {
            type: 'ajax',
            url: 'items.json',   
            reader: {type: 'json', root: 'groupitems',totalProperty: 'total'},
            baseParams: { 
                operation:'showall' 
            },
        },
    });
    
    var itemsInGroup = store_json.load({
        callback: function(records, operation, success) {
            itemsInGroup = [];
                console.log(store_json.data.length);
                for (var i = 0; i < store_json.data.length; i++) {  
                    itemsInGroup.push(store_json.data.items[i].data); 
                }
                console.log(itemsInGroup);
        }
    });
    var itemsInGroup = [];
    
    Ext.create('Ext.form.Panel', {    
        title: 'RadioGroup Example',
        renderTo: Ext.getBody(),
        items:[{
            xtype: 'radiogroup',
            fieldLabel: 'Radio',
            items: itemsInGroup 
        }]
    });    
    });
    This log to the console (console.log(itemsInGroup) shows the right array.
    Here is my items.json
    HTML Code:
    {
        "groupitems": [ 
       { boxLabel: 'Item 1', name: 'rb', inputValue: '1' },
       { boxLabel: 'Item 2', name: 'rb', inputValue: '2' },
       { boxLabel: 'Item 3', name: 'rb', inputValue: '3' }
        ]
    }
    There are no data shown in my Panel.

    Please help me. Thanks a lot in advance.

  2. Code:
    Ext.onReady(function () {
    
    
      var store_json = Ext.create('Ext.data.JsonStore', { 
        storeId: 'radio', 
        fields: ['boxLabel', 'name', 'inputValue'], 
        proxy: { 
          type: 'ajax', 
          url: 'items.json', 
          reader: {
            type: 'json', 
            root: 'groupitems',
            totalProperty: 'total'
          }, 
          baseParams: { 
            operation:'showall' 
          }, 
        },
      });
    
    
      var itemsInGroup = store_json.load({ 
        callback: function(records, operation, success) 
        {        
            itemsInGroup = []; 
            console.log(store_json.data.length); 
    
    
            for (var i = 0; i < store_json.data.length; i++) { 
              itemsInGroup.push(store_json.data.items[i].data); 
            } 
    
    
            console.log(itemsInGroup); 
        }
      });
      var itemsInGroup = [];
    
    
      Ext.create('Ext.form.Panel', { 
        title: 'RadioGroup Example', 
        renderTo: Ext.getBody(), 
        items:[{ 
          xtype: 'radiogroup', 
          fieldLabel: 'Radio', 
          items: itemsInGroup 
        }]
      }); 
    });
    Why do you set the var empty again? xD

    Try this:

    Code:
    Ext.onReady(function () {
    
    
      var store_json = Ext.create('Ext.data.JsonStore', { 
        storeId: 'radio', 
        fields: ['boxLabel', 'name', 'inputValue'], 
        proxy: { 
          type: 'ajax', 
          url: 'items.json', 
          reader: {
            type: 'json', 
            root: 'groupitems',
            totalProperty: 'total'
          }, 
          baseParams: { 
            operation:'showall' 
          }, 
        },
      });
    
    
      store_json.load({ 
        callback: function(records, operation, success) 
        {        
            itemsInGroup = []; 
    
    
            console.log(records); 
    
    
            for (var i = 0; i < records.length; i++) { 
              itemsInGroup.push(records[i].data); 
            } 
            
            console.log(itemsInGroup);
    
    
            Ext.create('Ext.form.Panel', { 
              title: 'RadioGroup Example', 
              renderTo: Ext.getBody(), 
              items:[{ 
                xtype: 'radiogroup', 
                fieldLabel: 'Radio', 
                items: itemsInGroup 
              }]
            }); 
        }
      });
    });
    I'm not sure if it was records[i].data or maybe records[i].data.data or smth just try xD

Thread Participants: 1

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