Output HTML using the Mustache.js template engine

MVC Model

  Public classStudentmodel {[Key] Public intStuid {Get;Set; } [Display (Name="name")] [Stringlength ( -)] [Required (ErrorMessage="name must be filled in")]         Public stringStuname {Get;Set; } [Stringlength ( -)] [Display (Name="Address")] [DataType (datatype.multilinetext)]//[Required (errormessage = "address Required")]         Public stringAddress {Get;Set; } [Display (Name="Age")] [Required (ErrorMessage="age must be filled")] [DisplayFormat (Applyformatineditmode=true, dataformatstring ="{0:C}")]         Public intAge {Get;Set; } }

Studentmodel

Mvc5webcontext

  Public classMvc5webcontext:dbcontext {//You can add the custom code to the this file.        Changes is not being overwritten. //         //If you want the Entity Framework to drop and regenerate your database//automatically whenever the your model schema, use data migrations. //For more information refer to the documentation:// http://msdn.microsoft.com/en-us/data/jj591621.aspx             PublicMvc5webcontext ():Base("Name=mvc5webcontext")        {        }         PublicSystem.data.entity.dbset<mvc5web.models.studentmodel> Studentmodels {Get;Set; } }

Mvc5webcontext

Controller

 Public class Studentcontroller:controller    { public jsonresult jsonlist ()        {            //Studentmodel stu = new Studentmodel { Stuid = Stuname = "wilson100", age = +, Address = "HG"};            return Json (db. Studentmodels, Jsonrequestbehavior.allowget);}        }

View Code

HTML templates

<script id="Template"Type="text/html"> <table border="1"> <tr> <th> name </th> <th> address </th> <th> age </t H> </tr>{{#studentLists}}<tr> <td>{{Stuname}}</td> <td>{{Address}}</td> <td>{{Age}}</td> </tr>        {{/Studentlists}} </table></script>

View Code

Ajax requests for client template output

  $ ("#btnTest"). Click (function  () {                $.get (  data) {                    var Template = $ (' #template '). html ();                    Mustache.parse (template);    // optional, speeds up the future uses                    var rendered = Mustache.render (template, {studentlists:data});                    $ (' #target '). html (rendered);                }             );

View Code

Mustache.js Official information

http://mustache.github.io/

Https://github.com/janl/mustache.js

Output HTML using the Mustache.js template engine