Results 1 to 4 of 4

Thread: ViewModel with default data - how can I get that?

  1. #1
    Ext JS Premium Member tangix's Avatar
    Join Date
    Mar 2010
    Location
    Stockholm, Sweden
    Posts
    740
    Answers
    10

    Default ViewModel with default data - how can I get that?

    Stumbling here. In a 6.7 modern project, I have a ViewModel that holds all the input from the user (collected on a couple of forms).
    The input data lives in a separate object "indata", which I have populated with default values.
    Code:
    Ext.define('CopcalcApp.desktop.src.view.arena.inputview.InputViewModel', {
        extend: 'Ext.app.ViewModel',
        alias: 'viewmodel.input',
    
        data: {
            sample: 4711,
            indata: {
                projekt_namn: 'Namnlöst',
                projekt_kontaktnamn: 'Ingen Koll',
                projekt_adress: 'Ortalavägen 373',
                projekt_foretag: '',
                projekt_fastighet: '',
                projekt_anteckning: '',
                klimat_land: null,
                stad_namn: null,
                stad_dut: 0.0,
                stad_medeltemp: 0.0,
                rumstemperatur: 20.0,
                egenuppvarmning: 3.0,
                vp_genererar_varme: true,
                temp_under_dut: false,
                vp_genererar_vv: true,
                stad_annan: false,
                stad_gradtimmar: 0,
                energi_berakning_typ: 'energi',
                vp_genererar_kyla: false,
                forbruk_el: 193000,
                forbruk_fjarrv: 0,
                forbruk_olja: 0,
                forbruk_flis: 0,
                forbruk_pellets: 0,
                forbruk_ved: 0,
                forbruk_naturgas: 0,
                eff_el: 100,
                eff_fjarrv: 100,
                eff_olja: 90,
                eff_flis: 90,
                eff_pellets: 85,
                eff_ved: 75,
                eff_naturgas: 90,
                energi_enhet: 'kwh',
                vv_bered_temp: 60.0,
                vv_tank_volym: 0.5,
                mee_matning: 230
            },
            meta: {
                klimat_modell: '',
                klimat_sveby: false
            }
        }
    });
    All works well, the fields on the forms are populated based on the default indata.* values.

    My plan was to simply gather the indata object from the VM and submit that to the server, but here I fail.

    If I use vm.get('indata') I only get the vales that have been modified by the user or code (even though the fields are initially populated correctly with the binds).
    But, if I run vm.get('sample') I get the default value 4711 even though this is not referenced anywhere.
    And if I run vm.set('indata.projekt_namn', 'Test') the field is updated correctly in the UI.

    What am I missing?
    Do I need to move all my data to the root-level of the vm data config?

  2. #2
    Ext JS Premium Member tangix's Avatar
    Join Date
    Mar 2010
    Location
    Stockholm, Sweden
    Posts
    740
    Answers
    10

    Default

    OK, the following gets me what I want, but surely there must be a better way than messing with internal properties?
    Code:
    Ext.apply(vm.get('indata'), vm._data.__proto__);

  3. #3
    Sencha MVP Team Member
    Join Date
    Sep 2016
    Location
    Kennewick, WA
    Posts
    153
    Answers
    15

    Default

    I would typically define a model and then define the store in the viewmodel.

    Example is with the model definition
    Code:
    Ext.define('awfcmobile.model.awfcboard', {
        extend: 'Ext.data.Model',
    
    
        fields: [
            { name: 'awfcBoardId', type: 'int' },
            { name: 'firstName', type: 'string' },
            { name: 'lastName', type: 'string' },
            { name: 'title', type: 'string' }
        ],
    
    
        proxy: {
            type: 'ajax',
            api: {
                // @sw-cache { options: { cache: { name: 'players' } } }
                create: '/resources/players.php?method=addPlayer',
                read: '/resources/players.php?method=getBoardMembers',
                update: '/resources/players.php?method=updatePlayer',
                destroy: '/resources/players.php?method=deletePlayer'
            },
            writer: {
                type: 'json',
                writeAllFields: true
            },
            reader: {
                type: 'json',
                rootProperty: 'data'
            }
        }
    });
    Then in the view model
    Code:
    Ext.define('awfcmobile.view.awfc.awfcmainModel', {
        extend: 'Ext.app.ViewModel',
        alias: 'viewmodel.awfc-awfcmain',
        data: {
            name: 'awfcmobile'
        },
    
    
        stores: {
            board: {
                model: 'awfcmobile.model.coach',
                autoLoad: true
            },
            confStandings: {
                model: 'awfcmobile.model.standings',
                autoLoad: true
            },
            teamSchedule: {
                model: 'awfcmobile.model.schedule',
                proxy: {
                    type: 'ajax',
                    url: '/resources/players.php?method=getFullSchedule',
                    reader: {
                        ype: 'json',
                        rootProperty: 'data'
                    }
                },
                autoLoad: true
            }
        }
    
    
    });
    The key is writeAllFields: true. This is defaulted to false and per the documentation.

    true to write all fields from the record to the server. If set to false it will only send the fields that were modified.
    Without the document does state it will only send fields that were modified.
    Andy Allord
    Sencha MVP/Software Engineer

  4. #4
    Ext JS Premium Member tangix's Avatar
    Join Date
    Mar 2010
    Location
    Stockholm, Sweden
    Posts
    740
    Answers
    10

    Default

    Interesting. Never thought about a model for this, basically since the input data is only one record and doesn't have a backing store. I do see some beauty in it and I guess a model could be memory-only.

    Thanks!

Posting Permissions

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