grouplink ui.grouplink

导航列表

详见http://www.kuaizhan.com/ui/ui-create

呈现样式

具体效果可参见 http://www.kuaizhan.com/ui/ui-create

使用接口 ui.grouplink 可以动态地创建一个链接选择控件

参数(以JS Object形式给出):
    name: input hidden标签的name
    value: input hidden标签的value
    [
        {
            link: 当link_res_type为1表示链接url;当link_res_type为2、3时为空;当link_res_type为5、6时为相对地址
            link_res_id: 如果为文章或者页面时,表示文章或者页面id,
            link_res_type: 链接类型1表示URL,2表示文章,3表示页面,5表示电商,6表示论坛
            link_res_name: 链接名称
        },
        ...
    ]

示例代码:

//grouplink
var form = $("#js-form-grouplink"),
    placeholder = form.find(".js-put-grouplink");
//生成链接列表的html
var html = ui.grouplink.create({
    "nav_theme": "theme1",
    "name": "links",
    sortable: true,
    min: 1,
    max: 6,
    "value": [
        {
            "title": "导航1",
            "link": "javascript:;",
            "link_res_type": 1,
            "link_res_id": 0,
            "link_res_name": "哈哈"
        },
        {
            "title": "导航2",
            "link": "javascript:;",
            "link_res_type": 0,
            "link_res_id": 0,
            "link_res_name": "哈哈"
        },
        {
            "title": "导航3",
            "link": "javascript:;",
            "link_res_type": 2,
            "link_res_id": 0,
            "link_res_name": "哈哈"
        },
        {
            "title": "导航4",
            "link": "javascript:;",
            "link_res_type": 3,
            "link_res_id": 0,
            "link_res_name": "哈哈"
        }
    ]
});

placeholder.replaceWith(html);
//绑定事件
ui.grouplink.init(form);
//数据处理
form.on("change", "input[name='links']", function(e, v) {
    console.log(v);
});