首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

报表字段排序

2012-09-21 
表格字段排序%@ page languagejava pageEncodingUTF-8%%@ include file/page/common/pageTagli

表格字段排序
<%@ 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"/>


<!--right begin-->
<div 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"  stylestyleId="orderDateBegin"/>
          到 <html:text property="orderTraceVO.orderDateEnd" readonly="true" stylestyleId="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" value="查询" id="btnSearch"/>
        <input type="button" value="清除" id="btnClear"/>
        </td>
      </tr>       
      </table>
     </div>         
   
<table id="table_data" width="100%" border="0" cellpadding="0" cellspacing="0" 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 formId="form0" actionPageIndex="/orderTraceAction.do?method=queryOrderTraceList"/>
</div>
<!--left end-->
</div>
<div style="height:0; clear:both"></div>
</div>
</div>
<div style="clear:left"></div>
<!--left end-->
</html:form>

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

热点排行