`

YUI样式的一点心得

    博客分类:
  • js
阅读更多
<%@ page language="java" import="java.util.Date" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>  
<%@include file="/public/jsp/init.jsp"%>   
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="${pageContext.request.contextPath}/public/ui/yui/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/public/ui/yui/connection/connection-min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate"> 
<title>小姐维护</title>
<p:jsLib>
{<c:out escapeXml="false" value="${uiLibs}"/>,
components:['PORTAL.widget.form',
'PORTAL.widget.datatable',
'PORTAL.widget.button',
'PORTAL.widget.container','connection']}
</p:jsLib>
<Script language="javaScript">
PORTAL.namespace("page");
var D = PORTAL.widget.DialogFactory;

//页面初始化
YAHOO.util.Event.onDOMReady(function(){
});

//外部接口
(function(){
PORTAL.page.interface = {
hiddenDialog:function(){
D.get('dialog1').hide();
},
//tmpObj,用于记录iframe 中的dataTable 对象
tmpObj:{},
setItemValue:function(rs){
var obj = PORTAL.page.interface.tmpObj;
obj.datatable.updateCell(obj.record,"itemName",rs.getData("name"));
        obj.datatable.updateCell(obj.record,"itemVersion",rs.getData("ecn"));
        D.get('vendorItemDialog').hide();
}
};

})();

//页面业务类
(function(){
PORTAL.page.bussiness={
//处理返回成功的函数
handleSuccess:function(o) {
if (o.responseText !== undefined) {
var result=eval("("+o.responseText+")");
alert(o.responseText);
}
},
handleFailure:function(o) {
//处理失败的函数
if (o.responseText !== undefined) {
alert("HTTP状态: " + o.status);
alert("HTTP状态代码的信息: " + o.statusText);
}
},
doSave:function(){//新增保存方法

alert('提交');
//回调函数
var callback = {
success:function(o){
var status = YAHOO.lang.JSON.parse(o.responseText);
        if(!status.status){        
        alert("×错误!(请选择正确选项)");
        YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("succeMes"),"display","none");
YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("errorMes"),"display","none");
YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("excepMes"),"display","block");
window.setTimeout(function(){
YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("errorMes"),"display","none");
},3000);
        }else{
alert("√保存成功!");
YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("succeMes"),"display","block");
YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("errorMes"),"display","none");
YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("excepMes"),"display","none");
window.setTimeout(function(){
YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("succeMes"),"display","none");
},3000);
}
},failure: function(o) {
            alert(o.responseText);
            YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("succeMes"),"display","none");
YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("errorMes"),"display","block");
YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("excepMes"),"display","none");
window.setTimeout(function(){
YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("excepMes"),"display","none");
},3000);
            }
};
var id = document.getElementById("Pid").value;
var no = document.getElementById("vendorNo").value;
var name = document.getElementById("vendorname").value;
var canBeConsumed = document.getElementById("canBeConsumed").checked;
var canBeReceived = document.getElementById("canBeReceived").checked;
var desc = document.getElementById("desc").value;
var sUrl= PORTAL.constant.CONTEXT_PATH +"/views/masterData/vendor/vendorMaintenanceAction!doSave.action";
var postData="Pid="+id+"&vendorNo="+no+"&vendorname="+name+"&canBeConsumed="+canBeConsumed+"&canBeReceived="+canBeReceived+"&desc="+desc;
alert(postData);
var request = YAHOO.util.Connect.asyncRequest("POST",sUrl,callback, postData);
},
canBeConsumedValue:function (){// 可接受人员 alert("select");
var obj = document.getElementById("selectCanBeConsumed");
var index = obj.selectedIndex; // 选中索引
var value = obj.options[index].value; // 选中值
if(value!=null){
document.getElementById("canBeConsumed").value=value;
}else{
document.getElementById("canBeConsumed").value=" ";
}
},
canBeReceivedValue:function (){//可消人员 alert("select1");
var obj = document.getElementById("selectCanBeReceived");
alert(obj);
var index = obj.selectedIndex; // 选中索引
alert(index);
var value = obj.options[index].value; // 选中值
if(value!=null){
document.getElementById("canBeReceived").value=value;
}else{
document.getElementById("canBeReceived").value=" ";
}
},
getVendorDetail:function (){//得到单个客户
//回调函数
var callback = {
success:function(o){
var status = YAHOO.lang.JSON.parse(o.responseText);
        if(!status.status){        
        alert("×错误!(改小姐不存在!请重新输入!)");
        YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("succeMes"),"display","none");
YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("errorMes"),"display","block");
YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("excepMes"),"display","none");
window.setTimeout(function(){
YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("errorMes"),"display","none");
},3000);
        }else{
        YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("succeMes"),"display","block");
YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("errorMes"),"display","none");
YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("excepMes"),"display","none");
window.setTimeout(function(){
YAHOO.util.Dom.setStyle(YAHOO.util.Dom.get("succeMes"),"display","none");
},3000);
        YAHOO.util.Dom.get("vendorNo").value=status.result.no;
YAHOO.util.Dom.get("vendorname").value=status.result.name;
YAHOO.util.Dom.get("canBeConsumed").value=status.result.canBeConsumed;
YAHOO.util.Dom.get("canBeReceived").value=status.result.canBeReceived;
YAHOO.util.Dom.get("desc").value=status.result.desc;
YAHOO.util.Dom.get("createUser").value=status.result.createUser.id;
YAHOO.util.Dom.get("createDate").value=status.result.createDate;
YAHOO.util.Dom.get("modifyUser").value=status.result.modifyUser.id;
YAHOO.util.Dom.get("modifyDate").value=status.result.modifyDate;
}
},failure: function(o) {
            alert(o.responseText);
            } //处理成功对应的函数
};
alert("fdsfdsfsfds");
var no = document.getElementById("vendorNo").value;
alert("jagdjhfjsdhgf");
var postData = "vendorNO="+no;
alert("====================="+no);
var sUrl= PORTAL.constant.CONTEXT_PATH +"/views/masterData/vendor/vendorMaintenance/vendorMaintenanceAction!getVendorDetail.action";
alert(sUrl);

try{
var request = YAHOO.util.Connect.asyncRequest("POST",sUrl,callback, postData);
}catch(ex){alert(ex.message);}
},
find:function(){//模糊查询
//回调函数
var callback = {
success:function(o){
var status = YAHOO.lang.JSON.parse(o.responseText);
        if(!status.status){        
        alert("×错误!(请选择正确选项)");
        }else{
alert("√查询成功!");
}
},failure: function(o) {
            alert(o.responseText);
            } //处理成功对应的函数
};
var vendorName = document.getElementById("vendorname").value;
var vendorNo = document.getElementById("vendorNo").value;
var postData = "vendorname="+vendorName+"&vendorNo="+vendorNo;
alert("fddddddd");
var path= PORTAL.constant.CONTEXT_PATH+"/views/masterData/vendor/vendorMaintenance/vendorList.jsp?vendorNo="+vendorNo+"&vendorname="+vendorName;
var panel = D.show("dialog1", 
            { fixedcenter : true,
              visible : true, 
              constraintoviewport : true,
              header:"供应商列表",
              body:"<iframe frameborder=0 width='500px' height='350px' src='"+path+"'></iframe>",
              buttons : [ 
                          { text:"取消", handler:function(){
this.hide();
}}]
             } );
},
setFormValue:function(obj){//给表单赋值
YAHOO.util.Dom.get("vendorNo").value=obj.getData("no");
alert(YAHOO.util.Dom.get("vendorNo").value);
YAHOO.util.Dom.get("vendorname").value=obj.getData("name");
YAHOO.util.Dom.get("desc").value=obj.getData("desc");
YAHOO.util.Dom.get("canBeConsumed ").value=obj.getData("canBeConsumed");
YAHOO.util.Dom.get("canBeReceived").value=obj.getData("canBeReceived");
YAHOO.util.Dom.get("createUser").value=obj.getData("createUser").id;
YAHOO.util.Dom.get("createDate").value=obj.getData("createDate");
YAHOO.util.Dom.get("modifyUser").value=obj.getData("modifyUser").id;
YAHOO.util.Dom.get("modifyDate").value=obj.getData("modifyDate");
YAHOO.util.Dom.get("Pid").value=obj.getData("Pid");
},
showAddItemWin:function(){

var path= PORTAL.constant.CONTEXT_PATH+"/views/masterData/vendor/vendorMaintenance/item.jsp";
var panel2 = D.show("dialog2", 
            { fixedcenter : true,
              visible : true, 
              constraintoviewport : true,
              header:"物料明细",
              body:"<iframe frameborder=0 width='500px' height='350px' src='"+path+"'></iframe>",
              buttons : [ 
                          { text:"取消", handler:function(){
this.hide();
}}]
             } );
}
};
})();

</Script>
</head>


<body onload="setTab('two',2,7 ,'jt',1,2)" class="yui-skin-sam">
<div  class="cncom_bg">
<div class="con_bg">
<jsp:include page="/views/fragment/top.jsp"/>  
<jsp:include page="/views/fragment/nav.jsp"/>           
    <div class="cncom_main">
    <div class="comm_left">
        <div class="comm_left_box">            
           <div class="comm_left_tx_vo">
<div class="comcn_teb_h2_vo">
                <span class="h2_lead">供应商维护</span>
                <span class="float_right"></span>
</div>
<table id="mytable_vo" class="ccn_tab_vo" cellspacing="0" summary="">
<%session.setAttribute("site","BYD-mes");%>
  <tr>
    <th scope="row"  class="spec">地点 :</th>
    <td><%=session.getAttribute("site") %></td>
    <td>用户登录地点</td>
  </tr>
  <tr>
    <th scope="row"   class="specalt">小姐编号 :</th>
    <td class="alt"><input class="cc_inp_a" tabIndex="2"  type="text"  name="no" id="vendorNo"/>
<input class="icon_select" type="button" name="select" title="查询"   value=""
onclick="PORTAL.page.bussiness.find()" />
<input class="sear_but_vo" name="ss" type="button" value="检索" onclick="PORTAL.page.bussiness.getVendorDetail()"/>
<input class="sear_but_vo"

value="清空" name="abc" type="reset" />
</td>
  </tr>  
</table>
            </div>
<!--
<div class="bydit_success">√查询成功!</div>
<div class="bydit_exceptional" >×异常!(请选择正确选项)</div>            
<div class="bydit_error" >×错误!(请选择正确选项)</div>   
-->
<div class="x_con_coom">
<div class="table_middle_h2_xx_bg">
<div class="table_middle_h2_xx">
<div class="table_middle_b_q_textx">
<ul>
    <li class="hover" id="jt1" onClick="setTab('jt',1,2)">基本信息</li>
    <li id="jt2" onClick="setTab('jt',2,2)">明细</li>
</ul>
</div>
</div>
</div>
</div>
<div class="xcon_cont">

<div class="jt_con_a"  id="con_jt_1">
<%session.setAttribute("user","超级赛亚人");%>
<table id="mytable" class="ccn_tab_vo" cellspacing="0" summary="">
<tr>
<th colspan="2" class="nobg" scope="col">&nbsp;</th>
</tr>
<tr>
<th scope="row" class="spec">建档人 :</th>
<td>${user }</td>
</tr>
<tr>
<th scope="row" class="specalt">修改人 :</th>
<td class="alt">${user}</td>
</tr>
<tr>
<th scope="row" class="spec">建档时间 :</th>
<td><%="2010-10-26 09:39:23"%></td>
</tr>
<tr>
<th scope="row" class="specalt">修改时间 :</th>
<td class="alt"><%="2010-10-26 09:39:23"%></td>
</tr>

</table>
<form  action="${pageContext.request.contextPath}/views/masterData/vendor/vendorMaintenanceAction.action" method="post">
<table id="mytable" class="ccn_tab" cellspacing="0" summary="">
<caption>详细信息</caption>
   <tr>
    <th colspan="2" class="nobg" scope="col"  >&nbsp;</th>
  </tr>
  <tr>
    <th scope="row"  class="spec">供应商名称 :</th>
    <td>
<input class="cc_inp_a" tabIndex="2" type="text"  name="vv" id="vendorname"/>
</td>
  </tr>
  <tr>
    <th scope="row"  class="spec">供应商详细 :</th>
    <td>
<input class="cc_inp_a" tabIndex="2" type="text"   name="hh" id="desc"/>
</td>
  </tr>
  <tr>
    <th scope="row"   class="specalt">可接受物料 :</th>
    <td class="alt">
<input name="canBeConsumed" id="canBeConsumed" type="checkbox" />
    </td>
  </tr>
  <tr>
    <th scope="row"  class="spec">可消耗物料 :</th>
    <td>
<input name="canBeReceived" id="canBeReceived" type="checkbox"  />
</td>
  </tr>
<tr>
<th class="yesbg" scope="col"></th>
<th class="yesbg" scope="col"><input class="button_ll"
value="保存" name="" type="button"
onclick="PORTAL.page.bussiness.doSave()" /> <input class="button_ll"
value="清空" name="" type="reset" /></th>
</tr>

   
 
</table>
   <input type="hidden" name="pid" id="Pid" >
</form>
</div>



<div class="jt_con_b" id="con_jt_2" style="display: none">
<div class="cncom_main">
<div class="comm_left">
        <div class="comm_left_box">
          <div class="comcn_teble">           
             <iframe frameborder=0 width="100%" height="100%" marginheight=0 marginwidth=0 src="vendorItem.jsp" ></iframe>
          </div>
        </div>
  </div>
</div>
</div>  
   
</div>   
         
        </div>
    </div>      
<jsp:include page="/views/fragment/right.jsp"/>      
      <!--comm_right-->
    </div> 
<jsp:include page="/views/fragment/footer.jsp"/>
</div>
</div>
</body>
</html>
分享到:
评论

相关推荐

    YUI 入门教程YUI 入门教程YUI 入门教程

    YUI教程YUI 入门教程YUI 入门教程YUI 入门教程

    yuicompressor-yui compressor

    yuicompressor-2.4.2.jar yuicompressor-2.4.7.jar jsZip.exe yuicompressor yui compressor js压缩工具 javascript压缩工具 css压缩工具 ------------------------------------ //压缩JS java -jar yui...

    yui_2.9.0前端UI

    YUI 库,全称Yahoo! UI Library。是一组工具和控件,用JavaScript写成, 为的是用DOM 脚本,DHTML和AJAX等技术创建丰富的网页交互式应用程序。 YUI 基于BSD协议,对所有的使用方式都是免费的。YUI 项目包括YUI 库和两...

    yui3-master.zip

    yui3-master.zip

    从YUI2到YUI3看前端的演变 pdf

    个人以为在现阶段,这种方式有一点激进,否能为广大用户所接受并发扬光大,还需要时间检验。YUI是个“学院派”的框架,以性能和严谨著称,易用性相对而言弱了一些。它能否在已经拉开的 JavaScript 框架大战中胜出,...

    yuitest YUI测试工具

    YUI Test is a complete testing framework for JavaScript and Web applications. You can use the simple JavaScript syntax to write unit tests that can be run in web browsers or on the command line, as ...

    高效WEB前端开发之路:YUI3.15

     本书作者便是在此背景下,以国外最优秀的JavaScript框架之一——Yahoo User Interface Library(简称YUI)的最新版本YUI 3.15为基础编写而成。本书通过通俗易懂的语言和大量丰富的实例,帮助读者解决实际生产环境...

    yui_2.6.0r2

    yui_2.6.0r2 yui_2.6.0r2 yui_2.6.0r2 yui_2.6.0r2 yui_2.6.0r2

    yui 资源包

    yui 源码下载,3.9.0 r2 包,最新版本

    yuicompressor,给YUI Compressor添加右键命令

    YUI Compressor非常好用,特别是JS的混淆是众多JS Coding的最爱。可惜官网提供的版本都不具备右键功能,每次压缩都要cmd输入一些命令实在是繁琐,本文就介绍如何给YUI Compressor添加右键命令,方便使用。 网上已有...

    js 压缩YUI

    雅虎的东西,简单的操作很好用 使用例子:java -jar D:\yuicompressor\yuicompressor\yuicompressor.jar E:\js\all.js -o E:\wap\wap2\js\all-min.js --charset utf-8 当然要装jdk了 不然就玩完了

    雅虎 用户接口库YUI

    YUI资料 雅虎 用户接口库 中文说明及如何使用学习 Yui组件分成2类:工具包和控件库 Yui 工具包 Yui 工具包利用DOM脚本来简化...DOM:DOM工具包提供更简单的DOM脚本的功能调用方式,包含元素的位置和CSS样式的管理。

    YUI中文文档CHM

    YAHOO YUI 中文文档 AJAX 详细 比较好用

    yui压缩

    yui压缩

    从YUI2到YUI3看前端的演变

    从YUI2到YUI3看前端的演变

    YUI3 dialog组件

    基于YUI3的dialog组件该组件是基于YUI3开发的,功能强大,详细见http://www.qiqicartoon.com

    yahoo yui 实例教程

    利用Yahoo YUI库做的一个TREE实例,很详细的阐述了YUI的使用原理

    YUI3 完整包

    Yahoo! UI Library (YUI) 是一个开放源代码的 JavaScript 函数库,为了能建立一个高互动的网页,它采用了AJAX, DHTML 和 DOM 等程式码技术。它也包含了许多 CSS 资源。

    yui_3.8.1.zip

    yui_3.8.1.zip

    yuicompressor-2.4.8.jar

    yuicompressor.jar是JS压缩工具、前端优化神器、yuicompressor-2.4.8.jar

Global site tag (gtag.js) - Google Analytics