add_tab
- add_tab(container, tab_name, options)
使用范围: client
编程语言: javascript
父类: Task
描述说明
add_tab 方法为 container 创建一个选项卡。
container 是一个容器（container）元素的 JQuery 对象。
``tab_name``要创建的选项卡的名称。
用户能使用 options 指定可选参数。
options 是一个有下列属性的对象：
tab_id- 标识选项卡的唯一字符串show_close_btn- 如果将其设置为true，将出现能够用来关闭这个选项卡的 “关闭按钮” 。set_active- 如果将其设置为true，那么将激活新创建的选项卡（显示其内容）。on_close- 一个可以在单击关闭按钮时调用的回调函数。
该函数返回 JQuery 对象，它是带有 tab-pane 样式类的 div ，当选项卡被激活时，将显示其内容。
示例
下面的代码将为编辑 “客户主表(Customers catalog)” 创建一个选项卡。 代码中使用了 create_inputs 方法。
function on_edit_form_created(item) {
var container = item.edit_form.find('.tabs');
task.init_tabs(container);
item.create_inputs(task.add_tab(container, 'Customer'),
{fields: ['firstname', 'lastname', 'company', 'support_rep_id']}
);
item.create_inputs(task.add_tab(container, 'Address'),
{fields: ['country', 'state', 'address', 'postalcode']}
);
item.create_inputs(task.add_tab(container, 'Contact'),
{fields: ['phone', 'fax', 'email']}
);
}
下面是 “客户主表(Customers catalog)” 的编辑 html 的模板
<div class="customers-edit">
<div class="form-body">
<div class="tabs">
</div>
</div>
<div class="form-footer">
<button type="button" id="ok-btn" class="btn btn-ary expanded-btn">
<i class="icon-ok"></i> OK<small class="muted"> [Ctrl+Enter]</small>
</button>
<button type="button" id="cancel-btn" class="btn expanded-btn">
<i class="icon-remove"></i> Cancel
</button>
</div>
</div>