工作日志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("");
            }
            

        }        
    });    
}

 

posted @ 2015-09-07 10:28  山档子  阅读(183)  评论(0编辑  收藏  举报