ajax 動態生成二級聯動下拉列表

無限級二級菜單，愈來愈多的被應用，譬如省級->市級的二級菜單

思路：一級下拉列表select 綁定一個id， jqury獲取到該下拉列表的checked屬性值，經過ajax請求獲取到該值所對應的二級內容，而後jquery修改二級下拉列表的內容，便可實現動態生成二級聯動下拉列表

示例：

下拉列表

                <td width="40%">一級分類
                    <select id="head_one">
                        <option value="-1">所有</option>
                        <volist name="ones" id="val">
                        <option value="{$val.id}">{$val.cname}</option>
                        </volist>
                    </select>
                </td>
                <td width="40%">二級分類
                    <select id="head_two">
                        <option value="-1">所有</option>
                    </select>
                </td>

jqury post獲取

        $("#head_one").change(function(){
            var parentId = $("#head_one").val();
            if(parentId == -1)
                return false;
            $.ajax({
                url : '{:U("Info/checkTwoCategory")}',
                type : 'POST',
                data : {
                    'parentId' : parentId,
                },
                dataType : 'json',
                error:function()
                {
                    alert('Error loading data!');
                },
                success:function(msg)
                {
                    $("#head_two").empty();  
                    $.each(eval(msg), function(i, item) {  
                        $("<option value='" + item.id + "'>" + item.cname + "</option>").appendTo($("#head_two"));
                    });
                }
            });
            
        });

便可實現二級聯動下拉列表