MVC - 11(下).jquery.tmpl.js 接收JSON类型数据循环

继续 mvc-11(上).dto:http://www.cnblogs.com/tangge/p/3840060.html

jquery.tmpl.js 下载:http://pan.baidu.com/s/1o68w7Ke

 

1.前台

Index.cshtml

@{
    ViewBag.Title = "学员列表";
}
@section headSection{
    <script type="text/x-jquery-tmpl" id="trtemp">
        <tr>
            <th>${StudentID}</th>
            <th>${Cid}</th>
            <th>${Name}</th>
            <th>${Gender}</th>
            <th>操作</th>
        </tr>
    </script>

    <script type="text/javascript">
        $(function () {
            //0.关闭Jquery的浏览器缓存
            $.ajaxSetup({ cache: false });
            loadPageList(1);
        });

        //根据页码 异步请求数据
        function loadPageList(pageIndex) {
            $.get("/Stu/List/" + pageIndex, null, function (jsonData) {
                if (jsonData.Statu=="OK") {
                    //alert(jsonData.Msg);
                    $("#trtemp").tmpl(jsonData.Data.PageData).appendTo("#tableList");
                }
                alert(jsonData.msg);
            },"json");
        }
    </script>
}
<table id="tableList" border="1" cellspacing="0" cellpadding="0" width="100%">
    <tr>
        <th>ID</th>
        <th>班级名</th>
        <th>姓名</th>
        <th>性别</th>
        <th>操作</th>
    </tr>
</table>

 

但是要报错

TypeError: $(...).tmpl is not a function

$("#trtemp").tmpl(jsonData.Data.PageData).appendTo("#tableList");

 

找了半天原因,结果查看页面源代码

 

这里,在_Layout.cshtml里面,引入juqey和tmpl,然后注释调

@Scripts.Render("~/bundles/jquery")

MVC - 11(下).jquery.tmpl.js 接收JSON类型数据循环

时间: 2024-10-31 00:41:54

MVC - 11(下).jquery.tmpl.js 接收JSON类型数据循环的相关文章

让jquery.tmpl.js支持index序号

在写Web程序时,想简单处理会使用JS模板,常用的是Jquery的jquery.tmpl.js插件.整个插件还是比较好用的,后续有机会结合实际应用案例,分享下应用方法. 本次文章想分享的一点是其中的一个很小的细节:支持行标index. 具体的使用场景是:通过表格展示数据,同时第一列为序号,会存在删除.新增行的按钮操作. 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <script src="../_common/jquery

springMVC框架下JQuery传递并解析Json数据

json作为一种轻量级的数据交换格式,在前后台数据交换中占领着很重要的地位.Json的语法很简单,採用的是键值对表示形式.JSON 能够将 JavaScript 对象中表示的一组数据转换为字符串,然后就能够在函数之间轻松地传递这个字符串,或者在异步应用程序中将字符串从 Web 客户机传递给server端程序,也能够从server端程序传递json格式的字符串给前端并由前端解释.这个字符串是符合json语法的,而json语法又是javascript语法的子集,所以javascript很easy解释

jquery模板jquery.tmpl.js使用教程(附jquery.tmpl.js下载)

使用js tempate的意义:用js对json数据处理生成html,如果不复杂还可以,复杂了就不好处理了,而且让js代码看起来特不优雅,维护这种代码等于自杀啊,别谈扩展性了...介绍一个jquery模板 jquery.tmpl.js,使用案例如下: <!DOCTYPE html> <html> <head> <title></title> <meta http-equiv="Content-Type" content=

Struts2+Jquery实现ajax并返回json类型数据

主要实现步骤如下: 1.JSP页面使用脚本代码执行ajax请求 2.Action中查询出需要返回的数据,并转换为json类型模式数据 3.配置struts.xml文件 4.页面脚本接受并处理数据 网上看到很多关于Struts2+ajax+jquery+json的例子,但是很多都不完整,也看不明白,主要原因是返回jsno类型数据和原来的返回字符串类型数据不一样,并且网友们实现步骤没有说清楚,让初学的朋友捉摸不透到底该怎么做. 我做了个简单的demo,供网友们学习,最后我会附上链接,可以下载整个de

使用Python向MySQL数据库中存入json类型数据

0.说明 因为出于个人项目的需要,获取到的数据都是json类型的,并且都要存入MySQL数据库中,因为json类型数据不像一般的文本数据,所以在存入MySQL时需要注意的问题很多. 在网上找了很多方法,整理了一下比较实用可靠的,总结下来就是下面的过程: MySQL表中需要保证存储json数据的列类型为BLOB: 使用sql语句时,使用MySQLdb.excape_string函数来对json数据进行转义: 查询数据时,将结果使用json.loads就能够得到原来的Python数据类型: 下面就来

C#操作json类型数据

将对象序列化为 JavaScript 对象表示法 (JSON),并将 JSON 数据反序列化为对象. 此类不能继承. // msdn 例子: [csharp] view plaincopy namespace SL_DataContractJsonSerializer { public partial class Page : UserControl { public Page() { InitializeComponent(); } //This uses an event handler, 

jquery.tmpl.js 模板引擎用法

1.0 引入: <script src="/js/jquery.tmpl.min.js"></script> 2.0 模板: <script type="text/x-jquery-tmpl" id="tmpl"> <li> <h5><a href="/news/Detail/${NewsId}">${Title}</a></h5>

通过Jquery中Ajax获取json文件数据

1. JSON(JavaScript Object Notation): javaScript对象表示法: 是存储和交换文本信息的语法,比xml更小,更快,更易解析. 2. JSON基本书写格式 : 名称/值对. 例如: "Student":"Tom" Json值可以是: 数字(整数或浮点数) 字符串(在双引号中) 逻辑值(true或者false) 数组(在方括号中) 对象(在花括号中) null  例如(对象):{"name":"to

js读取解析JSON类型数据

原文地址:http://www.ablanxue.com/prone_3691_1.html JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式.同时,JSON是 JavaScript 原生格式,这意味着在 JavaScript 中处理 JSON数据不须要任何特殊的 API 或工具包. 本文主要是对JS操作JSON的要领做下总结. 在JSON中,有两种结构:对象和数组. 1. 一个对象以"{"