Question

我在构建正确的jTemplates格式时遇到了问题 - 希望得到一些帮助。这就是我所拥有的：带有WebMethod的ASP.NET页面。此WebMethod将数据返回给jQuery。然后应该由jTemplates处理数据，但我不确定jTemplate的格式。

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Text;
using Microsoft.Practices.EnterpriseLibrary.Data;
using System.Data.Common;
using System.Web.Services;
using System.Linq;
using System.Web.Script.Services;

public partial class jpaging : System.Web.UI.Page
{
    [WebMethod]
    public static IEnumerable PagingData(int Page, int PageSize)
    {
        // talk to database and return datatable
        Database db = DatabaseFactory.CreateDatabase();
        using (DbCommand cmd = db.GetStoredProcCommand("Paging"))
        {
            db.AddParameter(cmd, "@Page", DbType.Int32, 4, ParameterDirection.Input, true, 10, 0, null, DataRowVersion.Default, Page);
            db.AddParameter(cmd, "@PageSize", DbType.Int32, 4, ParameterDirection.Input, true, 10, 0, null, DataRowVersion.Default, PageSize);
            using (DataTable dt = (db.ExecuteDataSet(cmd)).Tables[0])
            {
                var t = from data in dt.AsEnumerable() select data.ItemArray;
                return t;
            }
        }
    }
}

“return t”返回的数据采用以下格式。

{"d":[
 [1,1,"First 1","Last 1",301],
 [2,2,"First 2","Last 2",301],
 [3,3,"First 3","Last 3",301],
 [4,4,"First 4","Last 4",301],
 [5,5,"First 5","Last 5",301],
 [6,6,"First 6","Last 6",301],
 [7,7,"First 7","Last 7",301],
 [8,8,"First 8","Last 8",301],
 [9,9,"First 9","Last 9",301],
 [10,10,"First 10","Last 10",301]
]}

我使用以下代码将数据解析为jTemplates：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="jpaging.aspx.cs" Inherits="jpaging" EnableViewState="false" %>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="paging/jquery-jtemplates.js" type="text/javascript"></script>
<script type="text/javascript">

var currentPage = 1;
var pageSize = 10;

$(document).ready(function () {
   loadData(1); 
});

function loadData(page) {
   currentPage = page;
   $.ajax({
       type: "POST",
       url: "jpaging.aspx/PagingData",
       data: "{'Page':'" + page + "', 'PageSize':'" + pageSize + "'}",
       contentType: "application/json; charset=utf-8",
       dataType: "json",
       success: function (msg) {
           doTemplating(msg); 
           // ....
       }
   });
}

function doTemplating(msg) {
    $('#cont').setTemplateURL('/mytemplate.htm', null, { filter_data: false });
    $('#cont').processTemplate(msg);
}

</script>
</head>
<body>

   <table id="rsstable" cellspacing="0">
    <thead>
       <tr><th>ID</th><th>First</th><th>Last</th></tr>
    </thead>
    <tbody id="cont"></tbody>
   </table>

</body>
</html>

我不确定应该如何构建mytemplate.htm：

{#foreach $T.d as post}
<tr>      
  <td> <-- what to write here for column1? --> </td>
  <td> <-- what to write here for column2? --> </td>
  <td> <-- what to write here for column3? --> </td>
</tr>
{#/for}

我尝试使用{$ T.post [0]}之类的东西，但这不起作用。

作为旁注，我希望避免从WebMethod返回这样的内容：

    var feeds = from feed in dt.AsEnumerable()
            select new
            {
                EmployeeID = feed["EmployeeID"],
                FirstName = feed["FirstName"],
                LastName = feed["LastName"],
                Total = feed["TotalRows"]
            };
     return feeds;

如果是这种情况，我会做这样的事情：

{#foreach $T.d as post}
<tr>
  <td>{$T.post.EmployeeID}</td>
  <td>{$T.post.FirstName}</td>
  <td>{$T.post.LastName}</td>
</tr>
{#/for}

...但我希望避免这种情况，使模板对其他返回数据更通用/可用。

有什么建议吗？： - ）

Answer 1

我不确定JSONP适合你在做什么？ JSONP仅支持GET HTTP操作，即不支持POST。见这里：Post data to JsonP

您可以使用CORS执行跨域帖子，请参阅此处：http://enable-cors.org/

我建议使用firebug并使用调试点来检查返回变量或使用这种记录方式：How can I display a JavaScript object?。这将允许您查看返回的内容。之后，您可以将问题范围缩小到专门用于JTemplate。您也可以尝试构建到jquery中的模板，名为jquery.tmpl http://api.jquery.com/jquery.tmpl/

jQuery和jTemplates - 如何获得正确的值？

1 个答案: