Tree with Xml data only showing "LABEL"

[agnesMember]

I working through some of the examples trying to get xml data to load in a tree.
For the moment I just want to get a tree listing the directories with the names and it loads but the tree shows “Label”

Any help would be appreciated

Here is my sample xml:

<Directories>
	<Directory>
		<Name>PA30</Name>
		<CreatedBy>Agnes</CreatedBy>
		<Files>
			<File>abc.txt</File>
		</Files>
	</Directory>
	<Directory>
		<Name>PA40</Name>
		<CreatedBy>Garrett</CreatedBy>
		<Files />		
	</Directory>
	<Directory>
		<Name>PA50</Name>
		<CreatedBy>Steve</CreatedBy>
		<Files>
			<File>bcd.txt</File>
		</Files>
		<Directory>
			<Name>PA51</Name>
			<CreatedBy>John</CreatedBy>
			<Files />
		</Directory>
	</Directory>
</Directories>

And My script:

$(document).ready(function () {
var url = “../directories.xml”;

// prepare the data
var source =
{
datatype: “xml”,
datafields: [
{ name: ‘Name’,type: ‘string’ },
{ name: ‘CreatedBy’, type: ‘string’ }
],
root: “Directories”,
record: “Directory”,
label: ‘Name’,
url: url
};
var dataAdapter = new $.jqx.dataAdapter(source, {
loadComplete: function () {
// get data records.
var records = dataAdapter.records;
$(‘#tree’).jqxTree({ source: records, height: ‘300px’, width: ‘300px’});
},
loadError: function (jqXHR, status, error) {
},
beforeLoadComplete: function (records) {

}
});
// perform data binding.
dataAdapter.dataBind();

});

Loading Tree…

[Peter StoevKeymaster]

Hi agnes,

For using jqxTree with jqxDataAdapter, you should do something more which is illustrated in the jqxTree’s Binding to XML and Binding to JSON samples.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[agnesMember]

Peter,
I am new to jquery and I have tried to figure out the jqxTree binding to XML example but I find some of the documentation lacking on explaining how to get it to work. Especially the explanation of the getGroupedRecords() method; the example for the data adapter has grouping and I don’t need grouping and no matter what I try, I can not get my DirectoryName to appear.

I am off to try the JSON Binding example…

[Peter StoevKeymaster]

Hi agnes,

The getGroupedRecords() method is a method of the jqxDataAdapter plug-in and you should look for information in the jqxDataAdapter’s help topic – jquery-data-adapter.htm.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[atomicParticipant]

Hi guys,

What am I doing wrong? I cannot even reproduce your demo…

    <div id='content'>
        <script type="text/javascript">
            $(document).ready(function () {
      
                // prepare the data
                var source =
                {
                    datatype: "xml",
                    datafields: [
                        { name: 'CompanyName', map: 'm\\:properties>d\\:CompanyName' },
                        { name: 'ContactName', map: 'm\\:properties>d\\:ContactName' },
                        { name: 'ContactTitle', map: 'm\\:properties>d\\:ContactTitle' },
                        { name: 'City', map: 'm\\:properties>d\\:City' },
                        { name: 'PostalCode', map: 'm\\:properties>d\\:PostalCode' },
                        { name: 'Country', map: 'm\\:properties>d\\:Country' }
                    ],
                    root: "entry",
                    record: "content",
                    id: 'm\\:properties>d\\:CustomerID',
                    url: "customers.xml",
                    async: false
                };
                // create data adapter.
                var dataAdapter = new $.jqx.dataAdapter(source);
                // perform Data Binding.
                dataAdapter.dataBind();
                // get the tree items. The first parameter is the grouping fields. The second parameter is the sub items collection name. The third                       parameter is the group's name. 
                // Each jqxTree item has a 'label' property, but in the data source, we have a 'CompanyName' field. The last parameter 
                // specifies the mapping between the 'CompanyName' and 'label' fields.  
                var records = dataAdapter.getGroupedRecords(['Country', 'City'], 'items', 'label', [{ name: 'uid', map: 'value' }, { name: 'CompanyName', map: 'label'}], 'row', 'value');

                $('#jqxWidget').jqxTree({ source: records, height: '300px', width: '300px'});
            });
        </script>
        <div id='jqxWidget'>
        </div>
    </div>

with this data in customers.xml

<entry>
  <title type="text"></title>
  <updated>2011-11-30T11:39:28Z</updated>
  <author>
    <name />
  </author>
  <content type="application/xml">
    <m:properties>
      <d:CustomerID>ALFKI</d:CustomerID>
      <d:CompanyName>Alfreds Futterkiste</d:CompanyName>
      <d:ContactName>Maria Anders</d:ContactName>
      <d:ContactTitle>Sales Representative</d:ContactTitle>
      <d:Address>Obere Str. 57</d:Address>
      <d:City>Berlin</d:City>
      <d:Region m:null="true" />
      <d:PostalCode>12209</d:PostalCode>
      <d:Country>Germany</d:Country>
      <d:Phone>030-0074321</d:Phone>
      <d:Fax>030-0076545</d:Fax>
    </m:properties>
  </content>
</entry>

I get blank jqxWidget div…. I am using latest jqxWidgets.
Thank you.

[Author]

Posts