my json is not getting parsed through query.

my json is not getting parsed through query.

Hi

My json is not getting available. both are in same folder. Please tell where i am wrong. I am pasting both html and json here:


  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5. <title>Table</title>
  6. <script type="text/javascript" src="./jquery-1.8.2.js"></script>
  7. <script type="text/javascript" src="./table.json"></script>
  8. <script type="text/javascript">
  9. $.getJSON('table.json', function(data){
  10. alert(data);
  11. $(data.ItemisedBill).each(function(index,element){
  12. $('#tableData').append('<tr><td><input type="checkbox" name="chk"/></td><td>1</td><td><input type="text"/></td>');
  13. });
  14. });

  15. </script>
  16. </head>
  17. <body>
  18. <input type="button" value="Add Row" id="addRow" />
  19.     <input type="button" value="Delete Row" id="deleteRow" />
  20.     <table id="tableData" width="550px" border="1">
  21.      <tr>
  22.      <th>CheckBox</th>
  23.      <th>Serial No.</th>
  24.      <th>Item</th>
  25.      <th>Price</th>
  26.      <th>Quantity</th>
  27.      <th>SubTotal</th>
  28.      </tr>
  29.     </table>
  30. </body>
  31. </html>


Json:

  1. var ItemisedBill= [{
  2. "item":"name1",
  3. "price":"20",
  4. "quantity":2
  5. },
  6. {
  7. "item":"name2",
  8. "price":"30",
  9. "quantity":1
  10. },
  11. {
  12. "item":"name3",
  13. "price":"40",
  14. "quantity":3
  15. },
  16. {
  17. "item":"name4",
  18. "price":"14",
  19. "quantity":1
  20. },
  21. {
  22. "item":"name5",
  23. "price":"44",
  24. "quantity":4
  25. }
  26. ];

Thanks!