Jump to content
Larry Ullman's Book Forums

Search the Community

Showing results for tags 'html elements'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Single Editions
    • Modern Javascript: Develop and Design
    • The Yii Book
    • Effortless Flex 4 Development
    • Building a Web Site with Ajax: Visual QuickProject
    • Ruby: Visual QuickStart Guide
    • C++ Programming: Visual QuickStart Guide
    • C Programming: Visual QuickStart Guide
    • Adobe AIR: Visual QuickPro Guide
  • PHP and MySQL for Dynamic Web Sites: Visual QuickPro Guide
    • PHP and MySQL for Dynamic Web Sites: Visual QuickPro Guide (5th Edition)
    • PHP and MySQL for Dynamic Web Sites: Visual QuickPro Guide (4th Edition)
    • PHP 6 and MySQL 5 for Dynamic Web Sites: Visual QuickPro Guide (3rd Edition)
    • PHP and MySQL for Dynamic Web Sites: Visual QuickPro Guide (2nd Edition)
    • PHP and MySQL for Dynamic Web Sites: Visual QuickPro Guide (1st Edition)
  • PHP for the Web: Visual QuickStart Guide
    • PHP for the Web: Visual QuickStart Guide (5th Edition)
    • PHP for the Web: Visual QuickStart Guide (4th Edition)
    • PHP for the Web: Visual QuickStart Guide (3rd Edition)
    • PHP for the World Wide Web: Visual QuickStart Guide (2nd Edition)
    • PHP for the World Wide Web: Visual QuickStart Guide (1st Edition)
  • Effortless E-commerce with PHP and MySQL
    • Effortless E-Commerce with PHP and MySQL (2nd Edition)
    • Effortless E-Commerce with PHP and MySQL
  • PHP Advanced: Visual QuickPro Guide
    • PHP Advanced and Object-Oriented Programming: Visual QuickPro Guide (3rd Edition)
    • PHP 5 Advanced: Visual QuickPro Guide (2nd Edition)
    • PHP Advanced: Visual QuickPro Guide
  • MySQL: Visual QuickStart Guide
    • MySQL: Visual QuickStart Guide (2nd Edition)
    • MySQL: Visual QuickStart Guide (1st Edition)
  • Other
    • Announcements
    • Newsletter, Blog, and Other Topics
    • Forum Issues
    • Social

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Found 1 result

  1. EDIT: In the meantime I solved this - the answer is at the end Hi, First of all - I apologize - my English is bad. I have this JSON data in file mydata.json: [ {"name": "Aster", "product": "aster", "stock": "10", "price": "2.99"}, {"name":"Daffodil","product":"daffodil","stock":"12","price":"1.99"}, {"name":"Rose","product":"rose","stock":"2","price":"4.99"}, {"name":"Peony","product":"peony","stock":"0","price":"1.50"}, {"name":"Primula","product":"primula","stock":"1","price":"3.12"}, {"name":"Snowdrop","product":"snowdrop","stock":"15","price":"0.99"} ] I want to use this JSON to create the following HTML elements (using jQuery/Ajax): <div class="dcell"> <img src="images/aster.png"/> <label for="aster">Aster:</label> <input type="text" id="aster" name="aster" value="0" stock="10" price="2.99" required> </div> <div class="dcell"> <img src="images/daffodil.png"/> <label for="daffodil">Daffodil:</label> <input type="text" id="daffodil" name="daffodil" value="0" stock="12" price="1.99" required > </div> <div class="dcell"> <img src="images/rose.png"/> <label for="rose">Rose:</label> <input type="text" id="rose" name="rose" value="0" stock="2" price="4.99" required> </div> <div class="dcell"> <img src="images/peony.png"/> <label for="peony">Peony:</label> <input type="text" id="peony" name="peony" value="0" stock="0" price="1.50" required> </div> <div class="dcell"> <img src="images/primula.png"/> <label for="primula">Primula:</label> <input type="text" id="primula" name="primula" value="0" stock="1" price="3.12" required > </div> <div class="dcell"> <img src="images/snowdrop.png"/> <label for="snowdrop">Snowdrop:</label> <input type="text" id="snowdrop" name="snowdrop" value="0" stock="15" price="0.99" required> </div> but I'm not sure how to solve this problem (using jQuery/Ajax). I started this: <script type="text/javascript"> $(function() { $("<button>Ajax</button>").appendTo("#buttonDiv").click(function(e) { $.getJSON("mydata.json", function(data) { ///?????????????????????????????? }); e.preventDefault(); }); }); </script> ... and I don't know how to do it. Do you know how I could do this, is there a simple and elegant way to do this? Thank you in advance! Solution (it's so easy // embarrassed): $.getJSON("mydata.json", function(data) { var html = ''; $.each(data, function(key, value){ html += '<div class="dcell">'; html += '<img src="images/'+value.product+'.png"/>'; html += '<label for="'+value.product+'">'+value.name+':</label>'; html += '<input type="text" id="'+value.product+'" name="'+value.product+'" value="0" stock="'+value.stock+'" price="'+value.price+'" required>'; html += '</div>'; }); $('#yourContainerId').html(html); });
×
×
  • Create New...