easyui中的 combobox的应用

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">    
    <title>My JSP 'seach.jsp' starting page</title>   
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">    
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
    <jsp:include page="${path}/inc.jsp"></jsp:include>
    <script type="text/javascript">
         $(function(){
             $('#tt').datagrid({
                      url:"",
                      title:"",
                      fit : true,
                      pagination : true,
                      toolbar : "#seach-tb"
                  });    
            }); 
         
            
            /*  window.onload = function(){  
                $('#loancardClass').combobox({  
                    //相当于html >> select >> onChange事件  
                    onChange:function(){  
                        alert('fucking !!!!');  
                    }
                }) ; 
                }    */
           /*  function searchClass() {//查询
                 var sqlopt =$('#loancardClass').combobox('getValue');
                 if(sqlopt=='0'){
                     $('#tt').datagrid({
                         url:"",
                         title:"本企业查询结果",
                         fit : true,
                         pagination : true,
                         columns : [[
                                     {field:'ck',checkbox:false},
                                     {
                                         field : 'borrnamecn',
                                         title : '借款机构',
                                         width : 200,
                                         align:'left',
                                     },{
                                         field : 'certno',
                                         title : '组织机构代码',
                                         width : 100,
                                         align:'center',
                                      }
                                     ]],
                                     toolbar : "#seach-tb"
                     });    
                      var opt=$('#tt').datagrid('options');
                        opt.url=('loancard/loancardList');
                     $('#tt').datagrid('load', {
                         borrnamecn:$('#orgname').val(),
                         certno:$('#orgacode').val()
                     });
                 }
                 if(sqlopt=='1'){
                     $('#tt').datagrid({
                         url :"",
                         title : "投资企业信息",
                         fit : true,
                         pagination : true,
                         columns : [ [{
                             field : 'invecorpname',
                             title : '被投资单位名称',
                             width : 260,
                             align:'left',
                             formatter : function(value, rec) {
                                 return rec.id.invecorpname;
                             }
                         },{
                             field : 'invecorpborrcode',
                             title : '组织机构代码',
                             width : 100,
                             align:'center',
                             formatter : function(value, rec) {
                                 return rec.id.invecorpborrcode;
                             }
                         }]],
                     toolbar : "#seach-tb"
                     });
                      var opt=$('#tt').datagrid('options');
                        opt.url=('vloancardTz/vloancardTzList');
                     $('#tt').datagrid('load', {
                     borrnamecn:$('#orgname').val(),
                     certno:$('#orgacode').val()
                     });
                 }
                 
             }*/
                
            function searchClass() {//查询
                 var sqlopt =$('#loancardClass').combobox('getValue');
                  var opt=$('#tt').datagrid('options');
                 if(sqlopt=='0'){
               opt.url=('loancard/loancardList');
                     }
                 else if(sqlopt=='1'){
                     opt.url=('vloancardZb/vloancardZbList');    
                 }
                 else if(sqlopt=='2'){                  
                    opt.url=('vloancardTz/searchTz');                     
                 }
                 $('#tt').datagrid('load', {
                     borrnamecn:$('#orgname').val(),
                          certno:$('#orgacode').val()
                 });
             }
            
             window.onload = function(){
            $('#loancardClass').combobox({                
                onChange:function(rec){
                    if(rec=='0')
                        {
                        $('#tt').datagrid({                       
                            columns : [[
                                        {field:'ck',checkbox:false},
                                        {
                                            field : 'borrnamecn',
                                            title : '借款机构',
                                            width : 200,
                                            align:'left',
                                        },{
                                            field : 'certno',
                                            title : '组织机构代码',
                                            width : 100,
                                            align:'center',
                                         }
                                        ]],
                                        toolbar : "#seach-tb"
                        });    
                        }
                    else if (rec=='1'){
                        $('#tt').datagrid({
                         columns : [ [
                               {field:'ck',checkbox:false},{
                                field : 'contname',
                                title : '出资单位名称',
                                width : 260,
                                align:'left',
                                formatter : function(value, rec) {
                                    return rec.id.contname;
                                }
                            },{
                                field : 'contcardno',
                                title : '组织机构代码',
                                width : 100,
                                align:'center',
                                formatter : function(value, rec) {
                                    return rec.id.contcardno;
                                }
                            }]],
                            toolbar : "#seach-tb"
                        });
                    } 
                    
                    else if (rec=='2'){
                        $('#tt').datagrid({                   
                            columns : [ [
                              {field:'ck',checkbox:false},{
                                field : 'invecorpname',
                                title : '被投资单位名称',
                                width : 260,
                                align:'left',
                                formatter : function(value, rec) {
                                    return rec.id.invecorpname;
                                }
                            },{
                                field : 'invecorpborrcode',
                                title : '组织机构代码',
                                width : 100,
                                align:'center',
                                formatter : function(value, rec) {
                                    return rec.id.invecorpborrcode;
                                }
                            }]],
                            toolbar : "#seach-tb"
                        });
                    }
                    
                }
            });
             }
            
    </script>
    

  </head>
  
  <body>
  <div class="easyui-panel" data-options="fit : true,border : false">
     <div id="seach-tb" class="datagrid-toobar" style="padding:5px">
            <div>
                企业名称:<input type="text" class="formblue" style="width:100px" id="orgname" name="orgname"> 
                组织机构代码:<input type="text" class="formblue" style="width:100px" id="orgacode" name="orgacode">    
                查询类别:<select class="easyui-combobox" id="loancardClass" name="loancardClass"
                 style="width:90px" >
                    <option value="">请选择</option>
                    <option value="0">本企业</option>
                    <option value="1">股东企业</option>
                    <option value="2">投资企业</option>
                </select> 
                <a onclick="searchClass()" class="easyui-linkbutton" iconCls="icon-search">查询</a>
            </div>
        </div>
            <table id="tt"></table>            
            </div>
  </body>
</html>

企业名称: 组织机构代码: 查询类别:查询
 
主要是根据下拉框的选择体现不同的datagrid的形式和样表……实现选择,通过A的筛选查询到股东B可以使用视图的方式建立联系,方法如下:
CREATE VIEW  
 
[ < database_name > .] [ < owner > .]  
 
    view_name [ ( column [ ,...n ] ) ]  
 
   [ WITH < view_attribute > [ ,...n ] ]  
 
AS  
 
select_statement   
   [ WITH CHECK OPTION ]  
 
< view_attribute > ::=  
 
 { ENCRYPTION | SCHEMABINDING |  
 
      VIEW_METADATA }

然后再把视图作为一张表去在前后台使用。

 

 

心得2 ,easyui中的在html中渲染了class="easyui-linkbutton",后,在js的函数中onselect,onclick都失效,因为封装的的bug,只有重新渲染方可实现。

posted @ 2013-09-02 15:16  tested  阅读(732)  评论(0编辑  收藏  举报