表格字段排序

huangjiateng

浏览: 37877 次

最近访客更多访客>>

liaoshuiping

zhangyy130

j-docer

B00lean

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

<%@ page language="java" pageEncoding="UTF-8"%>
<%@ include file="/page/common/pageTaglib.jsp"%>
<script type="text/javascript">
//查询
    $(document).ready(function(){
    $("#btnSearch").click(function(){
    document.getElementsByName("pageInfor.pageNow")[0].value = 1;
    $("#form0").attr('action','<%=request.getContextPath()%>/orderTraceAction.do?method=queryOrderTraceList');
    $("#form0")[0].submit();
    });
    });


    $(document).ready(function(){
    $("#btnClear").click(function(){
    $("#orderNo").val("") ;
    $("#model").val("") ;
    $("#materialName").val("") ;
    $("#years").val("") ;
    $("#orderDateBegin").val("") ;
    $("#orderDateEnd").val("") ;
    $("#orderState").val("") ;
    });
    });


    function showOrderDetail(customerId,orderNo,materialCode,model,price,years,area){
    <%--
    $("#paramCustomerId").val(customerId) ;
    $("#paramOrderNo").val(orderNo) ;
    $("#paramMaterialCode").val(materialCode) ;
    $("#paramModel").val(model) ;
    $("#paramPrice").val(price) ;
    $("#paramYears").val(years) ;
    $("#paramArea").val(area) ;
       $("#form0").attr('action','<%=request.getContextPath()%>/orderTraceAction.do?method=queryOrderTraceDetailList');
    $("#form0")[0].submit();
    --%>


    var url = "<%=request.getContextPath()%>/orderTraceAction.do?method=queryOrderTraceDetailList"
    + "&paramOrderTraceVO.customerId=" + customerId
    + "&paramOrderTraceVO.orderNo=" + orderNo
    + "&paramOrderTraceVO.materialCode=" + materialCode
    + "&paramOrderTraceVO.model=" + model
    + "&paramOrderTraceVO.price=" + price
    + "&paramOrderTraceVO.years=" + years
    + "&paramOrderTraceVO.area=" + area;

    var arg = {"paramCustomerId":customerId, "paramOrderNo":orderNo,
    "paramMaterialCode":materialCode, "paramModel":model,
    "paramPrice":price, "paramYears":years, "paramArea":years};
    window.showModalDialog(url, arg, "dialogWidth:920px;dialogHeight:280px;center:yes;help:no;status:no;resizable:no");

    }

    var label = document.createElement("label");
    label.style.fontFamily = "webdings";
    label.innerText = "5"; // 5：升序（默认） 6：降序

    function sort(column, col_index, type, isInput) {

    var tr = document.getElementById("tr");
    var th = tr.childNodes[col_index];
    var key = th.innerText.charAt(th.innerText.length - 1);
    if (key == "5") {
    label.innerText = "6";
    } else {
    label.innerText = "5";
    }
    // 判断是升序还是降序 5：升序（默认） 6：降序

    if (label.innerText == "5") {
    flag = true;
    } else {
    flag = false;
    }
    var tbody = document.getElementById("tbody");
    myUtil.tableSort(tbody, col_index, type, flag, isInput);
    th.appendChild(label);
    }

var myUtil = function() {};
/**
* 表格排序
* @param tbody 表的tbody对象
* @param col_index 列号，从零开始

* @param type 数据类型。number为数字排序，string为字符排序（默认）

* @param flag 升序：true，降序：false
* @param flag 是否是Input（此项目专用）

* @author 王正镇

*/
myUtil.tableSort = function(tbody, col_index, type, flag, isInput)
{
var row_count = tbody.rows;
var row_ary = new Array(row_count.length);

for (var i = 0; i < row_count.length; i++)
{
row_ary[i] = row_count[i];
}

if (isInput) {
type.toLowerCase() == "number" ?
row_ary.sort(myUtil.orderNum_input(col_index)) : row_ary.sort(myUtil.orderStr_input(col_index));
} else {
type.toLowerCase() == "number" ?
row_ary.sort(myUtil.orderNum(col_index)) : row_ary.sort(myUtil.orderStr(col_index));
}
flag ? null : row_ary.reverse();
for (var i = 0; i < row_ary.length; i++)
{
tbody.appendChild(row_ary[i]);
}
};

/**
* 按字符排序，配合tableSort使用，已自动完成
* @param {Object} col_index
* @author 王正镇

*/
myUtil.orderStr = function(col_index)
{
return function compareTo(tr1, tr2)
{
var s1 = tr1.cells[col_index].outerText;
var s2 = tr2.cells[col_index].outerText;
return s1.localeCompare(s2);
};
};

/**
* 按字符排序，配合tableSort使用，已自动完成
* @param {Object} col_index
* @author 王正镇

*/
myUtil.orderStr_input = function(col_index)
{
return function compareTo(tr1, tr2)
{
var s1 = tr1.cells[col_index].childNodes[0].title;
var s2 = tr2.cells[col_index].childNodes[0].title;
return s1.localeCompare(s2);
};
};

/**
* 数字排序，配合tableSort使用，已自动完成
* @param {Object} col_index
* @author 王正镇

*/
myUtil.orderNum = function(col_index)
{
return function compareTo(tr1, tr2)
{
var s1 = tr1.cells[col_index].outerText;
var s2 = tr2.cells[col_index].outerText;
return s1 - s2;
};
};

/**
* 数字排序，配合tableSort使用，已自动完成
* @param {Object} col_index
* @author 王正镇

*/
myUtil.orderNum_input = function(col_index)
{
return function compareTo(tr1, tr2)
{
var s1 = tr1.cells[col_index].childNodes[0].title;
var s2 = tr2.cells[col_index].childNodes[0].title;
return s1 - s2;
};
};

</script>
<html:form action="/orderTraceAction.do?method=queryOrderTraceList" enctype="multipart/form-data" styleId="form0">
<html:hidden property="pageInfor.pageNow"/>
<html:hidden property="pageInfor.pageSize"/>
<html:hidden property="orderTraceVO.lineId" styleId="lineId"/>

<html:hidden property="paramOrderTraceVO.customerId" styleId="paramCustomerId"/>
<html:hidden property="paramOrderTraceVO.orderNo" styleId="paramOrderNo"/>
<html:hidden property="paramOrderTraceVO.materialCode" styleId="paramMaterialCode"/>
<html:hidden property="paramOrderTraceVO.model" styleId="paramModel"/>
<html:hidden property="paramOrderTraceVO.price" styleId="paramPrice"/>
<html:hidden property="paramOrderTraceVO.years" styleId="paramYears"/>
<html:hidden property="paramOrderTraceVO.area" styleId="paramArea"/>


<div class="middle_container">
<div class="current_position">您当前位置：首页 > 会员管理 > 订单跟踪</div>
<div class="discuss_area">
<script type=text/javascript>
$(document).ready(function(){
var stause=false;
var current_x=0;
var screen_width=$(window).width();
$(".user_menu li[name!=user_icon]").click(function(){
$(".user_menu li[name!=user_icon]").each(function(){
$(this).removeClass("on");
$(this).addClass("off");
});
$(this).removeClass("off");
$(this).addClass("on");
});
});
</script>


<%@ include file="/page/frontpage/member/memberleftmenu.jsp"%>



<div class="right_user">
<div class="search_area">
<table class="data_table" width="100%">
<tr>
<th colspan="4" align="left"><b>订单跟踪</b></th>
</tr>
    <tr>
    <td>订单号</td>
    <td>
    <html:text property="orderTraceVO.orderNo" styleId="orderNo"/>
    </td>
    <td>规格</td>
    <td>
    <html:text property="orderTraceVO.model" styleId="model"/>
    </td>
    </tr>
    <tr>
    <td>物料名称</td>
    <td>
    <html:text property="orderTraceVO.materialName" styleId="materialName"/>
    </td>
    <td>年份</td>
    <td>
<html:text property="orderTraceVO.years" styleId="years"/>
    </td>
    </tr>
    <tr>
    <td>订单日期</td>
    <td>
    从<html:text property="orderTraceVO.orderDateBegin" readonly="true" styleClass="date-pick-front" styleId="orderDateBegin"/>
    到 <html:text property="orderTraceVO.orderDateEnd" readonly="true" styleClass="date-pick-front" styleId="orderDateEnd"/>
    </td>
    <td>单据状态</td>
    <td>
    <html:select property="orderTraceVO.orderState" styleId="orderState">
    <option value="">=选择=</option>
    <option value="1">未审核</option>
    <option value="2">已审核</option>
    </html:select>
    <script type="text/javascript">
     var orderState
     ='<bean:write name="orderTraceForm" property="orderTraceVO.orderState"/>';
     //勾选

     if (orderState=='1'){
     document.getElementById('orderTraceVO.orderState').value="1";
   }
   if (orderState=='2'){
     document.getElementById('orderTraceVO.orderState').value="2";
   }
       </script>

    </td>
    </tr>
    <tr>
    <td colspan="20">
    <input type="button" class="button_bg1" value="查询" id="btnSearch"/>
    <input type="button" class="button_bg1" value="清除" id="btnClear"/>
    </td>
    </tr>
    </table>
   </div>

<table id="table_data" width="100%" border="0" cellpadding="0" cellspacing="0" class="data_table">
<tr id="tr">
    <th><a href="javascript: sort(this, 0, 'string', false);">订单号</a></th>
    <th><a href="javascript: sort(this, 1, 'string', false);">品牌</a></th>
    <th><a href="javascript: sort(this, 2, 'string', false);">名称</a></th>
    <th>规格</th>
    <th style="width: 40px;"><a href="javascript: sort(this, 4, 'string', false);">产地</a></th>
    <th>年份</th>
<th><a href="javascript: sort(this, 6, 'string', false);">订单日期</a></th>
    <th style="width: 40px;"><a href="javascript: sort(this, 7, 'number', false);">数量</a></th>
    <th style="width: 40px;">单价/包</th>
    <th><a href="javascript: sort(this, 9, 'number', false);">金额</a></th>
    <th style="width: 60px;">单据状态</th>
    
    </tr>
    <tbody id="tbody">
<logic:present name="orderTraceForm" property="orderTraceList">
<logic:notEmpty name="orderTraceForm" property="orderTraceList">
<logic:iterate name="orderTraceForm" id="orderTraceList" property="orderTraceList">
<tr>
<td>
<%-- <div title='订单号：<bean:write name="orderTraceList" property="orderNo"/>'>
<input type="text" style="border:none;width:92;height:20" value='<bean:write name="orderTraceList" property="orderNo"/>' readonly="true"/>
</div> --%>
<logic:equal name="orderTraceList" property="orderState" value="2" >
<a href="#"
    onclick="showOrderDetail(
    '<bean:write name="orderTraceList" property="customerId"/>',
    '<bean:write name="orderTraceList" property="orderNo"/>',
    '<bean:write name="orderTraceList" property="materialCode"/>',
    '<bean:write name="orderTraceList" property="model"/>',
    '<bean:write name="orderTraceList" property="price"/>',
    '<bean:write name="orderTraceList" property="years"/>',
    '<bean:write name="orderTraceList" property="area"/>');">
    <font style="color: blue; text-decoration: underline;"><bean:write name="orderTraceList" property="orderNo"/></font>
</a>
</logic:equal>
<logic:notEqual name="orderTraceList" property="orderState" value="2" >
<bean:write name="orderTraceList" property="orderNo"/>
</logic:notEqual>
    </td>
    <td>
<%-- <div title='品牌：<bean:write name="orderTraceList" property="category"/>'>
<input type="text" style="border:none;width:60;height:20" value='<bean:write name="orderTraceList" property="category"/>' readonly="true"/>
</div> --%>
<bean:write name="orderTraceList" property="category"/>
    </td>
<td>
<%-- <div title='名称：<bean:write name="orderTraceList" property="materialName"/>'>
<input type="text" style="border:none;width:60;height:20" value='<bean:write name="orderTraceList" property="materialName"/>' readonly="true"/>
</div> --%>
<bean:write name="orderTraceList" property="materialName"/>
    </td>
    <td>
<bean:write name="orderTraceList" property="model"/>
    </td>
    <td>
<bean:write name="orderTraceList" property="area"/>
    </td>
    <td>
<bean:write name="orderTraceList" property="years"/>
    </td>
<td>
<%-- <div title='订单日期：<bean:write name="orderTraceList" property="orderDate"/>'>
<input type="text" style="border:none;width:65;height:20" value='<bean:write name="orderTraceList" property="orderDate"/>' readonly="true"/>
</div> --%>
<bean:write name="orderTraceList" property="orderDate"/>
    </td>
    <td style="text-align: right;">
<bean:write name="orderTraceList" property="qty"/>
    </td>
    <td style="text-align: right;">
<bean:write name="orderTraceList" property="price"/>
    </td>
    <td style="text-align: right;">
<bean:write name="orderTraceList" property="amount"/>
    </td>
    <td>
        <logic:equal name="orderTraceList" property="orderState" value="2" >
已审核

</logic:equal>
<logic:equal name="orderTraceList" property="orderState" value="1" >
未审核

</logic:equal>
    </td>
    <%-- <td>
    <logic:equal name="orderTraceList" property="orderState" value="2" >
<a href="#"
    onclick="showOrderDetail(
    '<bean:write name="orderTraceList" property="customerId"/>',
    '<bean:write name="orderTraceList" property="orderNo"/>',
    '<bean:write name="orderTraceList" property="materialCode"/>',
    '<bean:write name="orderTraceList" property="model"/>',
    '<bean:write name="orderTraceList" property="price"/>',
    '<bean:write name="orderTraceList" property="years"/>',
    '<bean:write name="orderTraceList" property="area"/>');">
    详细
</a>
</logic:equal>
    </td> --%>
</tr>
</logic:iterate>
</logic:notEmpty>
</logic:present>
</tbody>
</table>
   <div class="page_area">
    <page:page
formName="orderTraceForm" formId="form0" actionPageIndex="/orderTraceAction.do?method=queryOrderTraceList"/>
</div>

</div>
<div style="height:0; clear:both"></div>
</div>
</div>
<div style="clear:left"></div>

</html:form>

<script>
/* document.getElementById("hygl").style.color = "red"; */
var tab = document.getElementById("table_data");
table_tr_color(tab, 1);
</script>

分享到：