Unable To Generate Dynamic Listview Through Jquery Mobile With Json Response?

Here is my Json response format :- {'Value':[{'ID':'1','productID':'10','subsID':'9','MinPrice':'500','MaxPrice':'50000','Subs':'xyz100'}]} Here is my .js code :- function product

Solution 1:

why dont you do this way??

$.each(respPrice.Value, function(index, value) {
      if(respPrice.VarietyID == 0) {
         alert('No product subs list found');
      } else {

       subsId = value.subsID;
       substance = value.Subs;
       minPrice = value.MinPrice;
       maxPrice = value.MaxPrice;       
       $respPrice = '<li class="ui-btn ui-btn-icon-right ui-li-has-arrow ui-li ui-last-child ui-btn-up-e">' + substance + minPrice + '-' + maxPrice + '</li>';

       // append here
       $('#productList').append($respPrice);
     }               
 });

 //andwhen all done, after $.each() refresh the listview
 $('#productList').listview('refresh');

here is a fiddle: http://jsfiddle.net/REthD/19/

Solution 2:

Change

success : function(msg) {
            var respPrice = "";
            $.each(respPrice, function(index, value) {
                if(value.VarietyID == 0) {
                    alert('No product subs list found');
                } else {

                    subsId = value.subsID;
                    substance = value.subs;
                    minPrice = value.MinPrice;
                    maxPrice = value.MaxPrice;
                    respPrice += '<li class="ui-btn ui-btn-icon-right ui-li-has-arrow ui-li ui-last-child ui-btn-up-e">' + substance + minPrice + '-' + maxPrice + '</li>';
                    }

                    } 
 $('#productList').append(respPrice).listview('refresh');          
                });


                },
            error : function(e) {
                console.log(e.message);
                alert('Error Occoured');
            }
        });