Form question: What widget to use for that ?

[drunkmoose]

Hi there!

Here's an XML feed I have that's set up to feed a form:

  <?xml version="1.0" encoding="iso-8859-1" ?> 
 <call>
 <call_details>
  <number>15590</number> 
  <description>[2010-09-21 11:49] Test</description> 
  <dateentered>2010-09-21 11:49</dateentered> 
  <priority>P1 (Critical)</priority> 
  <status>In progress</status> 
  <category>Hardware</category> 
  <subcategory>Damaged Equipments</subcategory> 
  <producttype>Batterie</producttype> 
  <summary>Test</summary> 
  <solution>[WebClient 2010-09-27 10:00]Client is requesting an update</solution> 
  </call_details>
 <ressources>
<ressource>
  <name>Ressource name #1</name> 
  </ressource>
<ressource>
  <name>Ressource name #2</name> 
  </ressource>

  </ressources>
  </call>

I've got it all figured out, but the only remaining bit is those ressources I want to show up in the form. Do you have any idea what kind of widget I could use to plug it in there ?

Thanks!

[plalx]

Depends on your needs, but here's some classes you can look at...

Ext.grid.GridPanel (this one would probably be overkill... )
Ext.list.ListView
Ext.DataView

[drunkmoose]

Thanks alot for your reply! But I'm a little confused as what to provide for the store config. option as I want to use what the form already loaded.

Here's my form code (nevermind the ASP code, I'm doing dynamics JS):

http://pastebin.com/zF4mnjfp

[plalx]

You can use the 'data' config option to load the resources already fetched from the server into the store.

Here's an example:

Ext.onReady(function() {
 
  //Creating the store passing inline data
  var store = new Ext.data.ArrayStore({
   idIndex: 0,
   fields: ['name'],
   data: [
    ['Resource1'],
    ['Resource2'],
    ['Resource3']
   ]
  });
  
  new Ext.list.ListView({
   store: store,
   columns: [
    {
     header:'Resource',
     width: 1, //100%
     dataIndex: 'name'
    }
   ],
   renderTo: Ext.getBody() //Render to body
  });
 }); 

[drunkmoose]

Thanks, but the store you are creating does not in no way refer to the XML that's been loaded already for the rest of the form.

I want to be able to do it another form field like:

 
 
{
  fieldLabel: 'Ressource(s)'
  xtype:     'listview',
  store: XML that's already loaded for the rest of the form,
  columns: [{header: 'Name',dataIndex: 'name' }]
}

This is the line of code that loads the data for the form (nevermind the ASP tags):

formPanel.getForm().load({method: 'GET', url:'main_xml.asp?mode=single&id=' + selectedCall, waitTitle:'<%=Session("LOADING_TITLE")%>',waitMsg:'<%=Session("LOADING_MSG")%>'});

I just don't know how I could syntaxically refer to the data that's currently feeding the form. I know I might be able to pull it off adding something like this in teh code block above:

formPanel.add({fieldLabel: 'Ressource(s)', xtype:'listview', store:formPanel.?????});

[plalx]

To refer to the loaded data, you can listen to the Ext.form.BasicForm 'actioncomplete' event checking up the Action.result property.
Then you will be able to build the store based on this data.

[drunkmoose]

The thing is that in action.results I can see the reader loaded with data from the first part of the XML (call_details)

Now I want the listview to take its data from the 2nd part of the XML (ressources) so action.results is not very helpful.

[drunkmoose]

I can't create a store from this event's code since the store has to already be defined in the FormPanel's listview declaration in FormPanel's items.

The pseudo code of what you are saying is something like:

 
load the form
once the form is loaded, build a store with the form's reader and apply it to the listview

But I don't see how this can work since the listview already has to have a store otherwise you get JS errors. By the way, I've changed my XML structure to:

  <?xml version="1.0" encoding="iso-8859-1" ?> 
- <call>
-  <call_details>
    <number>15590</number> 
    <description>[2010-09-21 11:49] Test</description> 
    <dateentered>2010-09-21 11:49</dateentered> 
    <priority>P1 (Critical)</priority> 
    <status>In progress</status> 
    <category>Hardware</category> 
    <subcategory>Damaged Equipments</subcategory> 
    <producttype>Batterie</producttype> 
    <summary>Test</summary> 
    <solution>Test solution</solution> 
-   <ressources>
     <ressource name="Ressource #1" /> 
     <ressource name="HELPDESK TEAM" /> 
    </ressources>
   </call_details>
  </call>

[plalx]

You can specify a listview with an empty store and then append data to the store once the form is loaded.

[drunkmoose]

Meh, this is way too tricky. I'll just get another field like <alltheresourcesname> .....</alltheresourcesname> in the call_details node and cram all the names in there.
I'm not even sure if my lack of understanding is about XML or ExtJS, and if it's ExtJS I don't know which part of it.