Software Archive
Read-only legacy content
17061 Discussions

API to parse xml

Mercedes_B_
Beginner
717 Views

Hello

What Web Service should I be using for an xml file so I can bind to a ListView.  I tried RSS Reader and selected the fields, connected to ListView but when testing it there's no data populating the ListView.  I followed the instructions in the video. "Using Services Datafeed in App Designer "

Thank you for your help.

0 Kudos
11 Replies
Mercedes_B_
Beginner
717 Views

I created a new project using the Sidebar template Design mode and still can not figure out how to assign the bindings correctly.  On the left sidebar I assigned the Title items like Breakfast, Lunch and Dinner.  The right detail ListView only provides one ListView for the array but in this example I have three array sets: breakfast, lunch and dinner . How do you bind the other two title menus(lunch and dinner) when you only have one ListView fields available in design mode(which I used for breakfast)? Also, should I be posting this question somewhere else in the forums? Here is a sample xml file to illustrate what I'm trying to do.  Thank you.

<menu>

<breakfast_menu>

<food>

<name>Belgian Waffles</name>

<price>$5.95</price>

<description>

Two of our famous Belgian Waffles with plenty of real maple syrup

</description>

</food>

<food>

<name>Strawberry Belgian Waffles</name>

<price>$7.95</price>

<description>

Light Belgian waffles covered with strawberries and whipped cream

</description>

</food>

</breakfast_menu>

<lunch_menu>

<food>

<name>Hamburger</name>

<price>$5.95</price>

<description>

Two of our famous hamburger

</description>

</food>

<food>

<name>Soup and Salad</name>

<price>$7.95</price>

<description>

Soup of the day

</description>

</food>

</lunch_menu>

<dinner_menu>

<food>

<name>Chicken Dumplings</name>

<price>$5.95</price>

<description>

Two of our famous Chicken Dumplings

</description>

</food>

<food>

<name>Prime Rib</name>

<price>$7.95</price>

<description>

Prime Rib

</description>

</food>

</dinner_menu>

</menu>

0 Kudos
Anjali_G_Intel
Employee
717 Views

Hi Mercedes,

List-views can be auto-populated from arrays of data binding.

You can do either of the two things to bind the other title menus :

1. Add two more list items in the listview. Then populate the second and third list item with lunch and dinner data, just like you did the first one. 

2. Change your API response such that the three items : breakfast, lunch and dinner are items in an array. Bind the first item of the array with the first list item, delete the second and third list item in design mode. When you switch to the emulator mode the list view would change to have all the items of the array as separate list items. 

Let me know if this works for you.

0 Kudos
Mercedes_B_
Beginner
717 Views

Hi Anjali,

Thank you for your response.

When I created the Listview for all the items in Breakfast, how do I remove the disclosure button since the list is complete and the user doesn't need to see it?  Also, if you select an item there is a pop up that states "Loading content" which also needs to be disabled.  Since I'm using the data binding I don't see another other widget besides the Listview.

I appreciate your help, this a cool setup once you know what you're doing.

 

0 Kudos
Anjali_G_Intel
Employee
717 Views

Hi Mercedes,

I am sorry I do not understand which disclosure button you are referring to. Could you please provide a screenshot of both the disclosure button and the 'loading content' pop up. Also, are you updated to the latest release version? You can find the release version number on the top right corner next to the words 'Intel XDK'.

0 Kudos
Mercedes_B_
Beginner
717 Views

My release version is 1621.

Here's a screen shot of a listview with disclosure buttons >.  Like the menu, this file has a data binding of phone numbers.  When the user taps the number it also activates the listitem to open another page.  I don't need this functionality: No > buttons to open another page.  How do you remove these buttons.  I just need the Listview only to hold the data.  Just like after you click Breakfast, you open another page of a Listview of breakfast items but it also has > buttons that I don't need because this is the end or last page for the user to see.  Thank you!

Disclosure-Screen-Shot-2015-01-27.png

 

 

0 Kudos
Anjali_G_Intel
Employee
717 Views

That is part of the framework you are using. To get rid of it, do this :

1. In app designer mode, select the listview element. In the properties panel, enable and assign an ID , let's say : 'mylistview' to the element. 

2, Switch to code mode, create a new file in the folder www/css, let's say www/css/recommendations.css.

3. Add this to your recommendations.css file. This will hide the pseudo element after in the list items. 

#mylistview li>a::after{
    display : none;
}

4. Go to your index.html file, search for the keyword 'stylesheet'. You will see a bunch a stylesheet tags already added. Add this where those tags are. 

<link rel="stylesheet" type="text/css" href="css/recommendations.css"> 

The icons should get hidden. 

 

0 Kudos
Mercedes_B_
Beginner
717 Views

That didn't remove them, I even created a Custom css and that didn't work either.  So then its best not to use this framework.  Unless you have other suggestions. Thanks again!

0 Kudos
Anjali_G_Intel
Employee
717 Views

Hmm, there is possibly a minor error somewhere. If you feel inclined to, go to the emulator mode, and use the debug button (looks like a 'bug') on the top left corner. It will open the CDT (chrome developer tool).  Use the CDT's elements tab to find the listiview element in the DOM and check if the class from recommendations.css is being applied to it or not. If not, recheck if you included it properly or if the css markup is correct. 

0 Kudos
Mercedes_B_
Beginner
717 Views

I believe its because its a widget not only an icon.  The properties don't give an option to select the > icon to hide which means that this Listview is only focused on being populated with data, then once the user clicks a list item that > button/icon will take them to another page.  As I have found you cannot use it for the second page only the first page; you cannot use it to allow the user to get detailed information from the second array.  So this Listview can only handle one array set to be populated on the first page but not a second Listview on the second page because you can't turn off the list item button functionality from taking you to another page.  As I've researched the options, JQuery has these features that I could use.  But as I tried converting my project over from Appframework to JQuery I now get a blank page in Design mode and missing the Listview in the sidemenu.  The code shows all my work is still there though.  It appears I have now both css files from the two frameworks and I don't know how to fix it so I can start using JQuery Listviews.

0 Kudos
Mercedes_B_
Beginner
717 Views

Hi

I created a new project without the App Designer(sidemenu template); my RSS Reader service methods do not appear like they did with App Designer since it's all code now.  I reviewed the script for the service method generated and watched the video but I would like more information on how to connect this data to the Listview like I did using App Designer and angular.js.   The sidemenu template without App Designer is so much faster all the way around but App Designer allowed the service methods to bind to a listview in the visual property settings.  How is this done programmatically?   I don't see the results of the query from the service method like I did with using App Designer to assign to the Listview.

I'm new to app framework so I would really appreciate some help.

Thank you very much!

0 Kudos
PaulF_IntelCorp
Employee
717 Views

I've asked the responsible engineer to chime in with her recommendations.

0 Kudos
Reply