﻿/*
ui，$.jbecool核心之一。
*/
(function ($) {
    $.jbecool.ui = {};
})(jQuery);

/////////////////////////////jbecool.jMyMultiSelector///////////////////////////////
/*
author:jerry
history:
v1.0 jerry N级联动

使用方法：
例子：
<script>
var sheng=[{label:"湖南省",value:43},{label:"湖北省",value:44}];
var shi=[{label:"长沙市",value:431,parent:43},{label:"湘潭市",value:432,parent:43},{label:"武汉市",value:441,parent:44}];
var xian=[{label:"雨湖区",value:4321,parent:432},{label:"岳塘区",value:4322,parent:432}];
</script>
<div class="becool_jMyMultiSelector">
<select dataProvider="sheng"><option value="-1">--请选择--</option></select>
<select dataProvider="shi"><option value="-1">--请选择--</option></select>
<select dataProvider="xian"><option value="-1">--请选择--</option></select>
</div>
*/
(function ($) {
    $.fn.jMyMultiSelector = function () {
        return this.each(function () {
            
            //所有select的数据源，是二维数组
            var dataProviderAll=[];
            //所有select的初始值（已写入的option)，是二维数组
            var initsAll=[];
            //一共有多少个select
            var counts=0;
            
            //初始化各种数据
            $(this).children("select").each(function (i) {
                var _dataProvider=eval($(this).attr("dataProvider"));
                var _inits = [];
                $(this).children("option").each(function () {
                    _inits.push({ value: $(this).val(), label: $(this).text()});
                });

                dataProviderAll[i]=_dataProvider;
                initsAll[i]=_inits;

                //填充第一个下拉框的对应数据
                if(i==0)
                {
                    for (var j = 0; j < _dataProvider.length;j++) {
                        $("<option value='"+_dataProvider[j].value+"' parent='"+_dataProvider[j].parent+"'>"+_dataProvider[j].label+"</option>").appendTo($(this));
                    }
                }
                counts++;
            });

            //进行真正的联动逻辑
            $(this).children("select").each(function (i) {
                var _which=i;

                //最后一个select不做任何触发事件，也不做下面的事件绑定，即便trigger也无效
                if(_which==counts-1)
                    return;

                //每个select发生选择改变时
                $(this).change(function () {
                    //看自己是否有下级select，这个函数不是很靠谱，在最后一个的时候得到的结果还是最后一个（当然，按jquery规则来说是对的），所以前面加上if(_which==counts-1)的判断
                    var next = $(this).next("select");
                    if (next){
                        //清空下拉框
                        next.empty();
                        //先填充初始值
                        for (var j = 0; j < initsAll[_which].length; j++) {
                            $("<option value='"+initsAll[_which][j].value+"' parent='"+initsAll[_which][j].parent+"' selected='selected'>"+initsAll[_which][j].label+"</option>").appendTo(next);
                        }
                        //根据数据源得到next内应该填充的数据
                        var v=$(this).find('option:selected').val();
                        var nextOptions=dataProviderAll[_which+1];
                        for (var k = 0; k < nextOptions.length; k++) {
                            //如果next的parent是我选择的值，就填充
                            if(nextOptions[k].parent==v)
                            {
                                $("<option value='"+nextOptions[k].value+"' parent='"+nextOptions[k].parent+"'>"+nextOptions[k].label+"</option>").appendTo(next);
                            }
                        }

                        //让下下级产生联动反应，例如第一级改变了选择，结果第三级还停留在上次的选择状态
                        next.trigger("change");
                    }
                });
            });
        });
    };
})(jQuery);

$(function () {
    $(".becool_jMyMultiSelector").jMyMultiSelector();
});

/////////////////////////////jbecool.jMyCheckboxSelector///////////////////////////////
/*
author:fy
history:
v1.0 fy 复选框动作
v1.1 jerry 重修修订

使用方法：
例子：
*/
$(function ()
{
    $(".becool_jMyCheckboxSelector").click(function ()
    {
        var _selectedIndices = "";
        var _parent = $(this);
        var container = $(this).attr("groupname");
        var checked = $(this).attr("checked");
        $(".becool_jMyCheckbox").each(function ()
        {
            //勾选
            if (container == $(this).attr("groupname"))
            {
                if (checked)
                {
                    _selectedIndices += "{" + ($(this).attr("value")) + "}";
                    $(this).attr("checked", 'true');
                }
                else
                {
                    $(this).removeAttr("checked");
                    _selectedIndices.replace("{" + ($(this).attr("value")) + "}", "");
                }
            }

            //点击单个
            $(this).click(function ()
            {
                if ($(this).attr("checked") == true)
                    _selectedIndices += "{" + ($(this).attr("value")) + "}";
                else
                    _selectedIndices.replace("{" + ($(this).attr("value")) + "}", "");

                _parent.attr("value", _selectedIndices.replace("}{",",").replace("{","").replace("}",""));
            });
        });

        _parent.attr("value", _selectedIndices.replace("}{", ",").replace("{", "").replace("}", ""));
    })
});


