Create html table with Parsed JSON in Jquery with images and input fields added -
i have seen many examples on internet regarding looping through json object , printing in html table. issue bit different need first column image next few columns json data json array , input field in last column (the value input field provided json array well).
here full json have tabledata contains array of information need create html table with:
{"approvername":"","emailaddress":"","companyname":"abc","address":{"streetaddress1":"12 blahblah","streetaddress2":"","state":"on","zipcode":"","country":"so","phonenumber":""},"tabledata":[{"vendorpart":"aaaaa","partdescription":"n/a","price":"0.00","quantity":"28"},{"vendorpart":"bbbbbbb","partdescription":"n/a","price":"0.00","quantity":"3"},{"vendorpart":"cccccc","partdescription":"n/a","price":"0.00","quantity":"25"}]} this jquery's ajax success function hit's webservice , get's data (just know how json object being used/created):
success: function(data, status, jqxhr) { var xml = $($.parsexml(data)), // parse xml string document, , wrap jquery json = xml.find("string").text(), // text of xml jsonobj = $.parsejson(json); // parse json string $('#approver').val(jsonobj.approvername); $('#emailaddress').val(jsonobj.emailaddress); $('#address1').val(jsonobj.address.streetaddress1); $('#address2').val(jsonobj.address.streetaddress2); $('#postalcode').val(jsonobj.address.zipcode); $('#city').val(jsonobj.address.state); $('#country').val(jsonobj.address.country); $('#phone').val(jsonobj.address.phonenumber); }, after input fields assigned need setup form look (hard-coded @ moment)
based on image see how first column image, second - fourth columns data jsonobj , fourth input field must create value coming jsonobj.
here code input:
<input class="quantityclass" type="number" name="quantity" min="0" /> i know, did lot of css on table if render table jquery css still take effect @ right time? hope js/css run @ same time.
Comments
Post a Comment