Jquery 模板数据绑定插件的使用方法详解

2020-05-19 07:28:46易采站长站整理

1 绑定后台数据到指定模板(无嵌套,内容均为后台数据原始信息,前台绑定)
以通话记录页为例:
首先指定目标容器:

 <dl class=”box_pannel_content_filled_border none” id=”gvRecCalls”>
   <dd class=”bg_blue”>
    <p class=”width_level_half_2 fl nopitch”></p>
    <p class=”width_level_half_5 bold fl”>被叫号码</p>
    <p class=”width_level_half_5 bold fl”>主叫号码</p>
    <p class=”width_level_half_6 bold fl”>起始时间</p>
    <p class=”width_level_half_4 bold fl” id=”pAmount”>金额($)</p>
    <p class=”width_level_half_4 bold fl”>时长</p>
    <p class=”width_level_half_10 bold fl”>区域</p>
    <p class=”width_level_half_4 bold fl nopitch” name=”pCDRHeader”>CDR ID</p>
    <p class=”width_level_half_2 fl none” name=”pSelectCbHeader”></p>
    <p class=”width_level_half_2 fr none” name=”pDeleteCbHeader”></p>
   </dd>
</dl>

其次指定模板数据:

<dl id=”RecCallsTemplate” >
<dd >
<p class=”center width_level_half_2 fl nopitch”>
<b class=”${CallMode == 1 ? ‘icon_call_in’ : ‘icon_call_out’}” ></b>
</p>
<span class=”width_level_half_5 fl”><span style=”color:#FF0000;”>${CalledStationId}</span></span>
<span class=”width_level_half_5 fl”>${CallingStationId.substr(CallingStationId.indexOf(“*”) + 1)}</span>
<span class=”width_level_half_6 fl”  id=”Start_time” >${StartTime}</span>
<span class=”width_level_half_4 fl”>${CSSCommonJS.ChangeDecimal(Revenue,3)}</span>
<span class=”width_level_half_4 fl”><span style=”color:#FF0000;”>${CSSCommonJS.GetTimeFormatString(RevenueTime)}</span></span>
<span class=”width_level_half_10 fl”>${Location} </span>
<span class=”width_level_half_4 fl nopitch” name=”pCDRHeader” >${CdrId}</span>
<p class=”right width_level_half_2 fr none” name=”pSelectCbHeader”>
<input  type=”checkbox” name=”cbSelect” class=”label” /></p>
<span class=”fl none” name=”pDeleteCbHeader”>
<button class=”crm_btn norm” id=”btDelete”><b>删除</b></button>