0

将数据从 JSON 文件导入到 Store

我已经开始开发一个应用程序，我使用 Sencha Touch 进​​行前端设计和 java 查询后端的数据库。但是，我无法将两者结合在一起。我尝试将来自 java 查询的数据以 json 格式返回到 .json 文件中，然后通过商店将其加载到我的应用程序中，但它似乎不起作用。我在 Chrome 控制台中收到错误，如下所示。

选项 localhost:8080/ProficyAppData/WebContent/app/store/info.json?_dc=1342618907990&page=1&start=0&limit=25 资源加载失败

我的项目包含在一个 Eclipse Java Web 项目中，这样我就可以轻松地使用 localhost 服务器。我不确定为什么 json 数据没有加载到商店中。

店铺：

Ext.define('MyApp.store.Questions', {
extend: 'Ext.data.Store',

config: {
autoLoad: true,
model: 'MyApp.model.Question',

proxy: {
type: 'ajax', 
url: 'localhost:8080/ProficyAppData/WebContent/app/store/info.json',
reader: 'json'
},
listeners: {
load: function() {
console.log(this);
}
},
}
});

模型：

Ext.define('MyApp.model.Question', {
extend: 'Ext.data.Model',

config: {
fields: ['id', 'criteria', 'description', 'questionName', 'type']
}
});

信息.json：

[
     {
          "id": 1,
          "criteria": "no criteria yet",
          "description": "no description yet",
          "questionName": "no question yet",
          "type": "n/a"
     },
     {
          "id": 2,
          "criteria": "no criteria yet",
          "description": "no description yet",
          "questionName": "no question yet",
          "type": "n/a"
     },
     {
          "id": 3,
          "criteria": "no criteria yet",
          "description": "no description yet",
          "questionName": "no question yet",
          "type": "n/a"
     },
     {
          "id": 4,
          "criteria": "no criteria yet",
          "description": "no description yet",
          "questionName": "no question yet",
          "type": "n/a"
     },
     {
          "id": 5,
          "criteria": "no criteria yet",
          "description": "no description yet",
          "questionName": "no question yet",
          "type": "n/a"
     },
     {
          "id": 6,
          "criteria": "no criteria yet",
          "description": "no description yet",
          "questionName": "no question yet",
          "type": "n/a"

     }
]


  [1]: http://i.stack.imgur.com/3zxuD.png
4

2 回答 2

1

我确实有一个类似的样本，我想出了哪种与您的问题相匹配...看看

模型：

 Ext.define('MyApp.model.user',{
 extend: 'Ext.data.Model',


   config: {

        identifier:{
          type:'uuid'
        },
       fields: [
        {
          name:'id',
          type:'string'
        },

       {
          name: 'name',
          type:'string'
       },
       {
          name: 'mobile',
          type:'number'
       },
        {
          name: 'birthday',
          type:'date'
       },
       {
          name: 'email',
          type:'email'
       },
        {
          name: 'password',
          type:'password'
       },
       {
          name:'haveid',
          type:'boolean'
       },
       {
        name:'photo'
       }
       ],

 }});

店铺：

Ext.define('MyApp.store.UserStore',{
extend:'Ext.data.Store',

   config: {
    model: 'MyApp.model.user',
    storeId: 'userstore',
    autoload:true,
    proxy: {
        type: 'ajax',
        id: 'userstoreproxy',
        url:'./resources/json/user.json',
        method:'POST',

    // .../RESOURCES/JSON/USER.JSON
        reader:
        {
            type:'json',
            rootProperty:'form.fields'
        }


    }
}});

要添加到视图中的侦听器：

listeners:{
painted:function()
{
    var store=Ext.getStore('userstore');

    store.load({
        callback:function(records)
        {
            localStorage.name=records[0].getData().name;
            localStorage.mobile=records[0].getData().mobile;
            localStorage.birthday=records[0].getData().birthday;
            localStorage.email=records[0].getData().email;
            localStorage.password=records[0].getData().password;


        }

    });
    console.log(store.data);
    // var data=JSON.parse(store.data);
    // console.log(data);        
    var record=store.getAt();
    console.log(record);
     // var bday=localStorage.birthday;
     // if(bday)
     // {
     //    bday.setHours(0);
     //    bday.setMinutes(0);
     //    bday.setSeconds(0);
     //    bday.setMilliseconds(0);
     // }
     // console.log(bday);
    Ext.getCmp('name').setValue(localStorage.name);
    Ext.getCmp('mobile').setValue(localStorage.mobile);
     Ext.getCmp('birthday').setValue();
    Ext.getCmp('email').setValue(localStorage.email);
     Ext.getCmp('password').setValue(localStorage.password);

}}

控制器：

Ext.define('MyApp.controller.usercontroller', {
extend: 'Ext.app.Controller',

config: {
    control: {
       save: {
            tap: 'FormSave'
        }

    },

    refs: {
        form:'basicform',
        save: 'button[action=save]'

    }
},

FormSave: function(button,e,options){

  var details=this.getForm().getValues();
  console.log(details);
  var userStore = Ext.getStore('userstore');
  userStore.add(details);
  userStore.sync();
  console.log(details.id);
  Ext.Msg.alert('SUCCESS', 'Data Saved to Local Storage Successfully');}});

请写一个适当的视图和json ..这应该可以正常工作，除了生日

于 2014-08-02T05:57:52.957 回答
0

你可以从你最喜欢的浏览器启动应用程序，像这样，

http://localhost:8080/ProficyAppData/your_name_app.html

我希望这有帮助。:)

于 2012-07-18T20:05:14.443 回答