Avalon.js 实现列表
<table border="0" cellpadding="0" cellspacing="0" class="tab1" >
<tr>
<td width="7%"> </td>
<td width="19%">运输类型</td>
<td width="7%">包裹类型</td>
<td width="8%">计费重量</td>
<td width="12%" class="sort-box"><span class="sort-price" ms-click='changeTimeSort'>参考时效<font class="sort-img unsort"></font></span></td>
<td width="8%">燃油价</td>
<td width="10%">运输价</td>
<td width="10%" class="sort-box"><span class="sort-price" ms-click='changePriceSort'>总价<font class="sort-img unsort"></font></span></td>
<td class="cz-list" width="10%">操作</td>
<td width="10%"> </td>
</tr>
</table>
//循环AirlLineList
<div class="myTable" ms-repeat="AirlLineList">
<table border="0" cellpadding="0" cellspacing="0" class="tab1" ms-repeat-el="ek.Item" >
<tr>
<td width="7%">
<img ms-src="{{el.logo}}" style="width: 60px; height: 50px;" /></td>
<td width="20%"><span>{{el.TransportName}} ({{el.PackageTypeName}})
<img src="data:images/wenhao.png" style="width: 15px; height: 15px;" ms-if="el.ClientDesc!=null&&el.ClientDesc!=''" ms-mouseover="tipAir(this,el)" ms-mouseout="tipClose(this)" /></span><br />
{{el.AirLineName}}</td>
<td width="7%">{{el.PackageTypeName}}</td>
<td width="8%" ms-if="el.Type!='2'"><span> {{el.weight|number(2,'.',',')}}</span> kg</td>
<td width="8%" ms-if="el.Type=='2'"><span> {{el.weight3}}</span> m³</td>
<td width="12%" ms-if="el.Duration!=null&&el.IsDraw=='0'">
<span>{{el.Duration}}个工作日</span>
</td>
<td width="12%" ms-if="el.Duration!=null&&el.IsDraw=='1'">
<span>{{el.Duration}}个工作日提取</span>
</td>
<td width="8%" >¥<span> {{el.OilPrice|number(2,'.',',')}}</span></td>
<td width="10%">¥<span>{{el.Price2|number(2,'.',',')}}</span></td>
<td width="10%" class="money" >¥<span>{{el.Price|number(2,'.',',')}}</span><img src="data:images/tip_gth.png" style="width: 20px; height: 20px;" ms-mouseover="tipPrice(this,el)" ms-mouseout="tipPriceClose(this)" /></td>
<td class="cz-list" width="10%" ms-click=" checkOrder(el.ZoneID,el.AirLineID,el,this)" align="right">
<p class="xd-btn">下单</p>
</td>
<td class="pull-btn pull-btn1" width="10%"><span ms-if="$index==0&&ek.Count>1" ms-click="openList(this)">
<label class="more">更多</label><img src="data:images/bottom.png" /></span></td>
<td style="display:none" id="calcWeight">{{el.weight|number(2,'.',',')}}</td>
</tr>
<tr ms-if="el.OtherDesc!=null">
<td></td>
<td colspan="6">{{el.OtherDesc}}</td>
<td colspan="3"></td>
</tr>
</table>
</div>
//声明定义avalon
var vm = avalon.define({
$id: 'internationalLineList',
AirlLineList: [], });
//查询方法
function QueryAirLinePriceList() {
debugger;
_czc.push(["_trackEvent", "在线下单", "查询"]); //czc记录点击事件
var country = $('#SendCountry').val();
if (country == null || country == "" || country==0) {
var countryID = $("#countryID").val();
$('#SendCountry').val(countryID)
}
var weight = $("input[name='Quantity']").val();
if (country == "" || country == 0 || weight == "" || weight == 0) {
return false;
} vm.AirlLineList = [];
var expressType = $("#ExpressType").val();
$.ajax({
url: "Handle/NewQueryOrderData.ashx?action=QueryAirlineOrderList",
type: "post",
data: $("#form1").serialize(),
beforeSend: function () {
$("#loading").show();
},
dataType: "json",
success: function (data) {
$("#loading").hide();
if (data.success) {
debugger;
vm.AirlLineList = data.data; hideData();
$('.more').html("更多");
$('.more').next().attr("src", "images/bottom.png");
}
else
{
alert("未查到任何数据!");
} },
error: function (data) {
$("#loading").hide();
}
});
}
Avalon.js 实现列表的更多相关文章
- avalon.js 1.4.6简单列表数据绑定ms-repeat ms-click
1.列表数据绑定 <html> <head> <meta charset="UTF-8"> <meta name="viewpo ...
- MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录
注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...
- avalon.js路由
之前自己写了一个AJAX加载页面的方法:有时候一个页面里面会分区域加载不同的东西(div,html),但是IE的回退按钮,就失去任何意义了: 这两天研究了一下avalon.js的路由: 需要准备: 1 ...
- avalon.js 多级下拉框实现
学习avalon.js的时候,有一个多级下拉框的例子,地址 戳这里 代码实现了联动, 但是逻辑上面理解有点难度,获取选择的值 和 页面初始化 功能存在问题. 在写地图编辑的时候,也用到了多级下拉框,特 ...
- avalon.js实践 svg地图配置工具
MVVM模式,在很多复杂交互逻辑下面,有很大的优势.现在相关的框架也很多,现在项目中使用了avalon.js,选择它的原因,是兼容性的考虑,当然也要支持下国内开发大牛,至于性能方面的,没有实际测试过, ...
- avalon.js实现一个简易日历
使用MVVM框架avalon.js实现一个简易日历 最近在做公司内部的运营管理系统,因为与日历密切相关,同时无需触发条件直接显示在页面上,所以针对这样的功能场景,我就用avalon快速实现了一个简 ...
- 一款轻量级前端框架Avalon.Js
avalon2是一款基于虚拟DOM与属性劫持的 迷你. 易用. 高性能 的 前端MVVM框架, 拥有超优秀的兼容性, 支持移动开发, 后端渲染, WEB Component式组件开发, 无需编译, 开 ...
- 15个Node.js项目列表
前言: Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台,是一个事件驱动I/O服务端JavaScript环境,基于Google的V8引擎,V8引擎执行Javascri ...
- avalon.js的循环操作在表格中的应用
avalon.js的循环操作在表格中的应用 一个JAVA开发,因为做的门户系统中,数据的展示加载的速度很影响使用效果,想到的是尽量少的请求后台,然后接触到了avalon,看介绍这是一个很轻很轻的MVV ...
随机推荐
- 在ubuntu下安装zookeeper
安装java环境,并配置好java相关的环境变量$JAVA_HOME. 1.下载并解压最新稳定的zookeeper文件 wget http://mirrors.cnnic.cn/apache/zook ...
- MacOS系统下简单安装以及配置MongoDB数据库(一)
最近写了一个用node来操作MongoDB完成增.删.改.查.排序.分页功能的示例,并且已经放在了服务器上地址:http://39.105.32.180:3333. 项目一共四部分: 1.MacOS下 ...
- week3_notebooke1
今日内容:编码集合深浅cpoy文件操作函数初始函数函数的返回值函数的传参 初识: # == 数值比较 # is 比较的是内存地址 # id 测试的是内存地址 # 小数据池 str int # int: ...
- Hibernate框架学习(五)——批量查询(概述)
一.HQL查询(Hibernate Query Language)多表查询,但不复杂时使用 Hibernate独家查询语言,属于面向对象的查询语言 1.基本查询 2.条件查询 注意:HQL语句中不可能 ...
- ZBrush中自动保存在哪里
在使用 ZBrush®执行任何会话期间,您都可以设置将文件自动保存,并可以修改保存时间间隔,文件保存位置等设置.发生系统错误后要重新启动ZBrush时,可以从临时文件夹或指定的文件夹中恢复备份文件.如 ...
- servlet中地址详细分析
path路径的写法 假设; 项目名为day01 webroot下存放静态文件demo.html 转发 request.getRequestDispatcherType("path" ...
- pickle模块 no attribute 'dumps'
今天写了一个pickle.py的文件练习pickle模块,代码如下: import pickle dic = {"linga": ('football',)} dic2 = {&q ...
- HDU 6149 Valley Numer II (状压DP 易错题)
题目大意:给你一个无向连通图(n<=30),点分为高点和低点,高点数量<=15,如果两个高点和低点都直接连边,那么我们称这三个点形成一个valley,每个点最多作为一个valley的组成部 ...
- CF449D Jzzhu and Numbers (状压DP+容斥)
题目大意: 给出一个长度为n的序列,构造出一个序列使得它们的位与和为0,求方案数 也就是从序列里面选出一个非空子集使这些数按位与起来为0. 看了好久才明白题解在干嘛,我们先要表示出两两组合位与和为0的 ...
- nginx1.15.8源码安装
useradd www -s /sbin/nologin -M yum -y install gcc pcre-devel openssl-devel cd /usr/local/src wget ...