I have json data array (shown below) and would like to display in Mobile ist View Control, something like this:
data-item-template="<div> <span> array element 1</span> <span>array element 2 </span> </div>"
Note: I have simplified to understand problem, data displayed is very complex and around 50 array elements.
Json Data:
{
"browseData": [
[
"10S10010",
"10C1000",
"Z"
],
"SO011203",
"A"
]
}
Hi annasaheb,
Thank you for posting in the community.
I have researched this scenario and it seems that in this scenario the json properties should not contain arrays as it would not be possible to access their respective items (as templating counts on property access). More on accessing properties can be found at:
http://help.infragistics.com/NetAdvantage/jQuery/2012.1/CLR4.0?page=igListView_Adding_igListView_to_a_Web_Page.html
var source = [{parent : [ "1", "2"]}]
would become
var source = [ {"parent":"1"}, {"parent":"2"} ]
var source = [
{"parent":"1"},
{"parent":"2"}
Afterwards this would be displayable in your template using something like:
data-item-template="<div> <span> ${parent} </span> <span> </span> </div>"
Please feel free to contact me if you have any questions.
Thanks for the answer, I might have to add label to each array data. I can live with that. but now as I need to build generic data item template in Javascript, how can I do it? following code shows "There are no list items!", If I assign datasource & itemTemplate in html, it works fine.
HTML:
<ul id="templateListView"
data-role="iglistview"
</ul>
BLOCKED SCRIPT
$(window).load(function (){
//Initialize
$(".templateListView").igListView({
dataSource: "brData",
itemTemplate: "<div><h2>${f0}</h2><p>${f1}</p></div>"
});
$(".templateListView").igListView("dataBind");
Thanks for quick answer, but I didn't follow your answer, so you are suggesting to remove data-role from html and leave <ul> tag correct? If I do that it shows error " Uncaught Error: There was an error parsing the JSON string: Unexpected token b"
HTML CODE:
<ul id="templateListView1" class="templateListView">
I got it working, need to use "igList" instead of "igListView". Thanks for your help.
Hello annasaheb,
Thank you for your reply.
Glad that the issue has been resolved.
Please feel free to contact me if you have any additional questions regarding this matter.
I have one more question on igList (not ingListView), how do I format dates & logical values using customBindings in igList? I tried using format attribute, but no luck, there is no samples available also.
Please Let me know.
So far, it seems that currently the templating engine only calls to toString() on JS primitives (bool, date, etc) and due to performance reasons it seems that at the moment the engine does not support formatting. After doing more research on the matter I will provide you with more information.
So my e-mail bounced. I have attached the files along with a readMe on what to do. Let me know if you have any difficulty.
-Dave
This has been implemented as a feature in 12.2. It has not been tested yet, so it could be CTP or RTM depending upon time. If you are using the jquery widget (not the MVC wrapper), I could get you java script code that will do the formatting internally, assuming you set the format of course. If you'd like you can e-mail me at dyoung at infragistics.com.
Thanks Petar for doing research and creating product idea. It looks like type "date" always displays long date with time stamp, it occupies lots of space on screen, I don't think it's usable, we are planning to remove igList because of this limitation. looks like iglist is meant for string type data only.
Date displayed as "Sat Feb 05 2011 16:00:00 GMT-0800 (Pacific Standard Time)" which is not acceptable, do you know, if there is any other way to display short date like "Sat Feb 05 2011" (using itemTemplate & customBindings)?
Thanks
After further research this functionality has been determined to be a new product idea. I have sent this product idea directly to our Product Management team. Our product team chooses new product ideas for development based on popular feedback from our customer base. Infragistics continues to monitor application development for all of our products, so as trends appear in requested features, we can plan accordingly.
Your reference number for this product idea is: PI12060029.If you would like to follow up on your product idea at a later point, you may contact Developer Support management via email. Please include the reference number of your product idea in the subject and body of your email message. You can reach Developer Support management through the following email address: dsmanager@infragistics.com
Thank you for your request.