zoukankan      html  css  js  c++  java
  • 工作日志WebRoot--编辑页关于处理两个关联的选择框

    案例:点击编辑,弹出界面后每个栏目都有一个默认的数值,但若其中一个选择框发生更改,则触发另一选择框内的数据发生变动(例如组织机构选择发生变动,则相对应的组织机构的下属机构也发生变动)。

    解决思路:组织机构函数中,选择发生变动时,触发并传递数值给下属机构函数。》  组织机构函数正常运行中,触发并传递数值给下属机构函数。

    组织机构函数

    function setOrganization(id,paramsor){
    var type="organization";
    var params = {"token": getStorage("token"), "flag":1};
    var fullurl=getOption("gykj_host")+"organization/list"+"?"+getOption("gykj_callbackparam")+"="+getOption("gykj_callbackfunc");
    //$('#submenu_info').html(fullurl);
    $.ajax({
        url:fullurl,
        type:'get',
        dataType:"jsonp",
        jsonp:getOption("gykj_callbackparam"),
        jsonpCallback:getOption("gykj_callbackfunc"),
        async:false,
        error:function(){
            alert("列表:"+getOption("connectionErrorMessage"));
        },
        success:function(data){
            if(data.resultCode==getOption("resultcode_success")){                
                    var html='<select class="chosen-select form-control"  id="o_id" data-placeholder="选择一个组织机构...">';
                    for(var item in data.data){
                        //var organization = {"o_id": data.data[item].o_id,"o_name":data.data[item].o_name,"logo":data.data[item].logo,"description": data.data[item].description,"flag":1};
                        //alert(data.data[item].organization);
                        var str=JSON.stringify(data.data[item]);
                        html+="<option value='"+str+"' ";
                        if(data.data[item].o_id!=null&&paramsor['organization']!=null&&data.data[item].o_id==paramsor['organization'].o_id){
                            html+=" selected ";
                        }
                        html+=">"+data.data[item].o_name+"</option>";
                    }                
                    
                    html+="</select>";
                    
                    $("#organizations").html(html);    
                    var oid=paramsor['organization'].o_id;
                    $('#o_id').change(function(){     //若组织机构发生变动                        
                        var organizationstr=$('#o_id').val();
                        var obj=JSON.parse(organizationstr);
                         oid=obj.o_id;
                         setmachineGroup(oid,paramsor);//传递并触发变动的组织机构ID给下属机构
                        
                    });                                                
                
            }else{
                alert("错误代码"+data.errorCode+":"+data.message);
            }
            var nullid="";
            setmachineGroup(nullid,paramsor);//递并触发未变动的组织机构ID给下属机构
        }        
    });    
        
    }

    下属机构函数

    function setmachineGroup(oid,paramsor){
    var type="machineGroup";
    var params = {"token": getStorage("token"), "flag":1};
    if(oid==""){//判断传递值odi若为空时,读取默认的下属机构数据
        var fullurl=getOption("gykj_host")+type+"/list"+"?"+getOption("gykj_callbackparam")+"="+getOption("gykj_callbackfunc")+"&token="+getStorage("token");
    }else{//否则执行组织机构变动后对应的下属机构数据
        var fullurl=getOption("gykj_host")+type+"/list"+"?"+getOption("gykj_callbackparam")+"="+getOption("gykj_callbackfunc")+"&o_id="+oid+"&token="+getStorage("token");
    }
        $.ajax({
            url:fullurl,
            type:'get',
            dataType:"jsonp",
            jsonp:getOption("gykj_callbackparam"),
            jsonpCallback:getOption("gykj_callbackfunc"),
            async:false,
            error:function(){
                alert("列表:"+getOption("connectionErrorMessage"));
            },
            success:function(data){
                if(data.resultCode==getOption("resultcode_success")){                
                        var html='<select class="chosen-select form-control"  id="mg_id" data-placeholder="选择一个终端分组..."><option value=""></option>';
                        for(var item in data.data){
                            //var machinegroup = {"mg_id": data.data[item].mg_id,"mg_name":data.data[item].mg_name,"description": data.data[item].description,"flag":1};
                            var machinegroup_str=JSON.stringify(data.data[item]);
                            html+="<option value='"+machinegroup_str+"'";
                            if(data.data[item].mg_id!=null&&paramsor['machinegroup']!=null&&data.data[item].mg_id==paramsor['machinegroup'].mg_id){
                                html+=" selected ";
                            }
                            html+=">"+data.data[item].mg_name+"</option>";
                            
                        }                
                        html+="</select>";
                        $("#machinegroup").html(html);    
                        setSupplier(paramsor);                                                
                        //$('#mg_id').chosen({allow_single_deselect:true}); 
                        
                }else{
                    alert("错误代码"+data.errorCode+":"+data.message);
                    //$("#machinegrouptype").html("");
                }
                
    
            }        
        });    
    }
  • 相关阅读:
    .NET简谈互操作(七:数据封送之介绍)
    C# utf8编码时转换成shiftjis时出现乱码问题的处理
    .NET简谈特性(代码属性)
    著名Channel 9 主持人Robert Green 采访微软一站式示例代码库录像
    SharePoint 2007运行 Edit In DataSheet 时在IE 6下页面卡死的分析和处理方法
    截图工具
    Resharper上手指南
    .NET简谈互操作(三:基础知识之DllImport特性)
    .NET简谈互操作(五:基础知识之提升平台调用性能)
    深度训练(DotNet专场)
  • 原文地址:https://www.cnblogs.com/mailan/p/4788223.html
Copyright © 2011-2022 走看看