Results 1 to 5 of 5

Thread: How to load a store using form panel field values?

  1. #1
    Sencha User
    Join Date
    Oct 2011
    Posts
    9
    Vote Rating
    0
      0  

    Default How to load a store using form panel field values?

    Hi everyone,

    I'm building a Touch app with Designer 2 (build 298).

    I have a form panel and field set defined with various input fields. I also have a model defined and a Json store defined that refers to the model.

    What I would like to do is take the form panel input field values, submit them to the server, then load the store based on the response Json contents.

    What is the best way in Designer 2 / Touch to accomplish this?

    In other parts of the app I have been able to successfully auto-load a store. I've also been able to submit values from a form panel to the server and react to the response. Now I am having trouble figuring out how to get the two concepts to work together.

    Any help / pointers would be appreciated!

    Chad

  2. #2
    Sencha User aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,487
    Vote Rating
    145
      0  

    Default

    Sounds like you are looking for BasicForm's loadRecord and updateRecord methods.
    Aaron Conran
    @aconran

  3. #3
    Sencha User
    Join Date
    Oct 2011
    Posts
    9
    Vote Rating
    0
      0  

    Default

    Aaron - Thanks very much for your response!

    I apologize in advance if this question shows my lack of experience: The links you provided are from the ExtJS Docs. Is the BasicForm also valid for a Touch app built with Designer 2?

  4. #4
    Sencha User aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,487
    Vote Rating
    145
      0  

    Default

    Sorry for linking to Ext's documentation, that was a mistake.

    You can use setRecord to load the values.

    Once you have the record you can also set teh values from whats in the form.

    Code:
    form.getRecord().set(form.getValues());
    Aaron Conran
    @aconran

  5. #5
    Sencha User
    Join Date
    Oct 2012
    Posts
    62
    Vote Rating
    0
      0  

    Default Send data to a store (LocalStorage)

    Hy,
    I have a form panel to set different fields.
    when I click on submit button ,I want to send the values of each field to store:
    this the store:

    Ext.define("UnivMobile.store.EventsPerso", { extend: "Ext.data.Store",
    requires: "Ext.data.proxy.LocalStorage",
    config:{
    model: "UnivMobile.model.EventPerso"
    }


    });
    This is the model:

    Ext.define("UnivMobile.model.EventPerso", {
    extend: "Ext.data.Model",
    config: {
    fields: [{
    name: 'nomEvent'
    //type: 'string'
    },
    {
    name: 'dateDebEvent'
    // type: 'date',
    // dateFormat: 'c'
    },
    {
    name: 'dateFinEvent'
    // type: 'date',
    // dateFormat: 'c'
    },
    {
    name: 'lieu'
    // type: 'string'
    }

    ]
    proxy: {
    type: 'localstorage',
    id:'eventPerso'
    }


    }
    });

    And this is the view:

    Ext.define('UnivMobile.view.AddEvent', {
    extend: 'Ext.form.Panel',
    requires: ['Ext.picker.Date'],

    xtype: 'option2card',

    config: {
    fullscreen: true,
    title: 'Add Event',
    id:'formPanel',

    items: [ {
    xtype: 'fieldset',
    items: [
    {
    xtype: 'textfield',
    name: 'nomEvent',
    id:'nomevent',
    label: 'Nom Event:'


    },
    {
    xtype: 'textfield',
    name: 'dateDebEvent',
    id:'debEvent',
    label: 'Date de debut Event:',
    value:new Date,
    listeners : {
    focus:function( ) {
    dateFormat:'Y-m-d',
    id:'picker1',
    //name:'t',
    listeners : {
    change : function(datePicker1, value) {
    console.log(value);
    var valueDateDeb=Ext.getCmp('debEvent');
    valueDateDeb.setValue(value);

    }
    }
    });
    this.parent.parent.parent.parent.push(datePicker1);


    }

    }
    },


    {
    xtype: 'textfield',
    name: 'dateFinEvent',
    id:'finEvent',
    label: 'Date de fin Event:',
    value:new Date,
    listeners : {
    focus:function( ) {
    var datePicker2= Ext.create(Ext.picker.Date, {
    dateFormat:'Y-m-d',
    id:'picker2',
    listeners : {
    change : function(datePicker2, value) {
    console.log(value);
    var valueDateFin=Ext.getCmp('finEvent');
    valueDateFin.setValue(value);

    }
    }
    });
    this.parent.parent.parent.parent.push(datePicker2);


    }

    }
    },
    {
    xtype: 'textfield',
    name: 'lieu',
    id:'lieu',
    label: 'Lieu:',

    }
    ] // items
    },





    {
    xtype: 'toolbar',
    layout: {
    pack: 'center'
    }, // layout
    ui: 'plain',
    items: [
    {
    xtype: 'button',
    text: 'Reset',
    id:'resetb',
    ui: 'decline',
    listeners: {
    tap: function(){


    this.parent.parent.parent.parent.push(Ext.Msg.confirm('', 'Are you sure you want to reset this form?', function (btn) {
    switch (btn) {
    case 'yes':
    var valueNom=Ext.getCmp('nomevent');
    valueNom.setValue('');
    var valueDateDeb=Ext.getCmp('debEvent');
    valueDateDeb.setValue('');
    var valueDateFin=Ext.getCmp('finEvent');
    valueDateFin.setValue('');
    var valueLieu=Ext.getCmp('lieu');
    valueLieu.setValue('');

    break;
    default:
    break;
    } // switch
    })
    );
    }
    }
    },
    {xtype: 'button',
    text: 'Submit',
    ui: 'confirm',
    listeners: {
    tap: function() {// I want to send the diffrent values to my store

    var store=Ext.getStore("EventsPerso");
    var form = Ext.getCmp('formPanel');
    var values = form.getValues(); // it works
    form.submit({

    url: 'What should I set here?????',
    method: 'POST',
    success: function (form, result) {
    localStorage.setItem('Nom event',values.nomEvent);
    Ext.Msg.alert('Success', action.result.msg);

    },
    failure: function (form, result) {
    alert('failure');
    }

    });


    }
    }
    }
    ] // items (toolbar)
    }
    ]


    }
    });
    Any help please how can I send diffrent values from my formPanel to my store???????,

Posting Permissions

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