Json：解析以顯示在HTML中使用JQuery

我想解析從我的ASP.NET MVC 1.0 Web應用程序中的JSON頁面的數據。我需要將這些數據顯示在頁面加載的表格中，而且我遇到了很多麻煩，主要是因爲我以前從未使用過JSON。 JQuery網站也給出了相當可怕的例子。這是我到目前爲止，我需要幫助寫一個函數：Json：解析以顯示在HTML中使用JQuery

$("document").ready(function() { 
     $.getJSON("http://localhost:1909/encoders", 
      function(data) { 
       $.each(data.items, function() { 

       }); 
      }); 
    });

上面的網址目前只顯示JSON和兩列，我從SQL Server產生JSON越來越有EncoderName和EncoderStatus。該id是displayencoders。

謝謝！

編輯：我的控制器看起來是這樣的：

[UrlRoute(Name = "GetEncoders", Path = "encoders")] 
     public ActionResult GetEncoders() { 
      var encoders = Database.GetEncoders(); 

      return Json(encoders); 
     }

當編譯我的/編碼器/樣子：

{ 

    * EncoderName: "rmcp2-encoder" 
    * EncoderStatus: "inactive" 

}

來源

2010-01-14 user177215

什麼是服務器端代碼的樣子？ – tvanfosson 2010-01-14 19:49:29

另外，你的JSON是什麼樣的？ – 2010-01-14 20:05:08

$("document").ready(function() { 
    $.getJSON("http://localhost:1909/encoders", function(data) { 

     $("#div-my-table").text("<table>"); 

     $.each(data, function(i, item) { 
      $("#div-my-table").append("<tr><td>" + item.EncoderName +"</td><td>" + item.EncoderStatus + "</td></tr>"); 
     }); 

     $("#div-my-table").append("</table>"); 

    }); 
});

來源

2010-01-14 20:17:27 yojimbo87

謝謝你的完美！ – user177215 2010-01-14 20:24:56

有趣的是，我使用幾乎相同的方法，而是解析json，我實際上應用html格式從我的控制器中的輔助方法的json結構。所以基本上，我的控制器返回完全格式化的json結果，並且所有jquery函數所要做的就是將其放置在相關的div中，在本例中爲$（'＃propertyList'）。html（data）。

這裏還挺它的外觀上的觀點：

<script type='text/javascript'> 
    function GetLocationHighlites() { 
     $.ajaxSetup({ cache: false }); 
     $.getJSON('/en/Property/GetLocationHighlites/', null, 
      function(data) { JsonData(data); }); 
    } 

    function JsonData(data) { 
     if (data.length != 0) { 
      $('#propertyList').html(data); 
      $('#propertyList').slideDown('fast'); 
      return false; 
     } 
    }; 

    $(document).ready(function() { 
     GetLocationHighlites(); 
    }); 
</script>

，並在控制器：

public JsonResult GetLocationHighlites() 
    { 
     IBlockData block = WebPagesMapper.GetLocationHighlites(propertiesWorldwideLuxury); 
     string htmlBlock = string.Format(_block, block.Header, block.Content); 
     return Json(htmlBlock); 
    }

_block在上述JsonResult GetLocationHighlites（）是一個字符串線沿線的常數：

private string _block = @"<div class='Block'> 
         <div class='header'> 
         {0} 
         </div> 
         <div class='BlockContent-body'> 
         {1} 
         </div> 
        </div>";

我對這個問題感興趣，在這種情況下，我的（微弱:)嘗試ke ep it DRY。

來源

2010-01-14 21:18:28 jimi

當然，你也可以ALSO/ALTERNATIVELY返回一個字符串（而不是Json結果）。我實際上必須考慮上面的答案，並意識到這可能是我的目的'最好的例子'。所以，我現在（鑑於）：

$.get('/en/Property/GetLocationHighlites/'

而不是：

$.getJSON('/en/Property/GetLocationHighlites/'

，並修改了控制器的功能：

public string GetLocationHighlites() 
{ 
    IBlockData block = WebPagesMapper.GetLocationHighlites(propertiesWorldwideLuxury); 
    string htmlBlock = string.Format(_block, block.Header, block.Content); 
    return htmlBlock; 
}

希望這不會把水攪渾。 ..

來源

2010-01-14 23:28:15 jimi

Json：解析以顯示在HTML中使用JQuery

回答

相關問題