How to append dynamic data to images and Div tags in MVC4?

moodween

New Member
Hi all i have which looks like this\[code\] public class ProductItems{ public long ProductID { get; set; } public string ProductName { get; set; } public string ProductDescription { get; set; } public string ImageURL { get; set; } public ProductItems() { if (SKUs == null ) SKUs = new List<productSKU>(); } public List<productSKU> SKUs { get; set; } public List<options> oPTIONS { get; set; }}public class productSKU{ public productSKU() { if (oPTIONS == null) oPTIONS = new List<options>(); } public string productsku { get; set;} public string SKUImageURL { get; set;} public List<options> oPTIONS { get; set; }}public class options{ public long OptionID { get; set; } public string OptionName { get; set;} public string OptionValue { get; set;}}\[/code\]i have data in this model ..i am bindin data to this model like this\[code\] public IEnumerable<ProductItems> GetProductDetail(long ID) { ProductItems items=new ProductItems(); List<ProductItems> objcollection=new List<ProductItems>(); var productdetail=from prod in products.Products where prod.ProductId==ID select new {productid=prod.ProductId,description=prod.ProductDescription,productname=prod.ProductName}; foreach(var detail in productdetail) { items.ProductID=detail.productid; items.ProductName=detail.productname; items.ProductDescription=detail.description; var prodsku=from prodksu in products.ProductSKUs where prodksu.ProductId==ID select prodksu; foreach(var sku in prodsku) { productSKU prdsk=new productSKU(); prdsk.productsku=sku.SKU; prdsk.SKUImageURL=sku.ImageURL; items.SKUs.Add(prdsk); var opt=from PA in products.ProductAttributes join O in products.Options on PA.OptionId equals O.OptionsId where PA.SKU==prdsk.productsku select PA; foreach(var op in opt) { options obj=new options(); obj.OptionID=Convert.ToInt16(op.OptionId); //obj.OptionName=; obj.OptionValue=http://stackoverflow.com/questions/12759769/op.Value; prdsk.oPTIONS.Add(obj); } objcollection.Add(items); } } return objcollection; }\[/code\]now what i want is i want to bind this to my view or append this data to my view,i am trying like this\[code\] $.getJSON("/api/ProductDetails", { ID: '@ViewData["ProdId"]' }, function (data) { $.each(data, function (idx, product) { alert(product.ProductName); alert(product.ProductDescription); $("#productdetails").append('<h2>' + product.ProductName + '</h2><p>' + product.ProductDescription + '</p>'); if(product.SKUs.length>0) { alert(product.SKUs.length); $('<img/>').attr({ src: product.SKUs.SKUImageURL[0] }).appendTo('#defaultimage'); } }); });\[/code\]and this is my view\[code\] <div class="wrapper"><div class="right_section_main" id="productdetails"></div><div class="product-detialsimg-box" id="defaultimage"><div class="right-section" id="allimages"></div></div></div>\[/code\]now i want one of the SKUImageURL to be binded to "defaultimage" div tag and remaining images should be binded to allimages div tagand the opitonsname should be binded to a label "productdetails" div tag and option values should be filled in dropdown for each option name can any tell me how can i append this data to my required tags in my html
 
Back
Top