Sencha Touch selectfield 项目选择问题

Posted 2023-02-26

【中文标题】Sencha Touch selectfield 项目选择问题

【英文标题】：Sencha Touch selectfield item selection issue

【发布时间】：2011-11-09 21:47:51

【问题描述】：

这是我的模型和商店，

    Ext.regModel('Agent',  fields: [ name: 'userid', type: 'int' ,  name: 'agentname', type: 'string'] );

App.stores.agentStore = new Ext.data.Store(
    model: 'Agent',
    storeId: 'AgentsStoreid',
    proxy: 
        type: 'ajax',
        url: 'https://abc123.com/wsbrightdoor.asmx/GetAgents?username=abc&password=123',
        reader:  type: 'xml', root: 'root', record: 'salesagent' 
    ,
    autoLoad: true
);

    //App.stores.agentStore.load();
    console.log(App.stores.agentStore); 

我正在将此商店设置为我的选择项，就像这样

var sel = new Ext.form.Select(
  
    id: 'Myselectfield',
                             name: 'myagent',
                             label: 'Agent',
                             store: App.stores.agentStore, 
                             displayField: 'agentname',
                             valueFiels: 'userid',
                             placeHolder: 'Click/touch to select options...',
  ); 

这是服务器返回的我的 XML 文件

<?xml version="1.0" encoding="utf-8"?>

<root>

  <salesagent>

    <userid>1</userid>

    <agentname>Name1</agentname>

  </salesagent>

  <salesagent>

    <userid>13</userid>

    <agentname>Name2</agentname>

  </salesagent>

 </root>

我可以看到 store 正在从网络服务器获取值，并且我可以看到带有 agentname 和 userid 值的数据对象。我们使用的是 Sencha touch 1.1.0。我现在可以看到从 web 服务填充的选择字段中的值。当我选择一个项目时，所选项目不会更改为我选择的项目。我看到商店中的第一个元素被选中。我们如何解决这个问题？请建议。

【参考方案1】：

Sencha touch 文档非常模糊。在每个属性和方法中使用一些示例来展示如何使用它可能会更好。这是我解决问题的方法。我必须使用典型的 Jquery Ajax 请求来完成它。

AgentsArray = new Array(); //Create an Array that saves the Agents    AgentsArray.push( text: '', value: '0' );


pushAgents = function (data, textStatus, xml_http_req) 

    //console.log(data);
    /*read the agents and IDs from XML and build Array*/
    $(data).find('salesagent').each(
                                     function () 
                                     
                                         var agentName = $(this).find('agentname').text();
                                         var agentId = $(this).find('userid').text();
                                         AgentsArray.push( text: agentName, value: agentId ); // push the items into Array
                                         //alert(agentName); 
                                     
                                    );


                                     return AgentsArray;



 function somethingWrong() 
     AgentsArray.push('SomethingWentWrong', '0');
 
App.Agents = AgentsArray; //Save it in the array and this is specified in the Mainform.js(View). 


$.ajax(
            url: 'https://abc.com/def.asmx/GetAgents',
            type: 'GET',
            dataType: 'xml',
            data: 'abc=1&def=1&username=123',
            success: pushAgents, 
            errors: somethingWrong
       );

在 MainForm.js 中，选择控件是这样的

items: [  
                                     xtype: 'selectfield',
                                     id: 'selectfield',
                                     name: 'agent',
                                     label: 'Agent',
                                     options: App.Agents,
                                     placeHolder: 'Click to select options...',
                                ]