1408 lines
51 KiB
JavaScript
1408 lines
51 KiB
JavaScript
|
/**
|
|||
|
|
* jQuery ligerUI 1.3.3
|
|||
|
|
*
|
|||
|
|
* http://ligerui.com
|
|||
|
|
*
|
|||
|
|
* Author daomi 2015 [ gd_star@163.com ]
|
|||
|
|
*
|
|||
|
|
*/
|
|||
|
|
(function ($)
|
|||
|
|
{
|
|||
|
|
|
|||
|
|
$.fn.ligerForm = function ()
|
|||
|
|
{
|
|||
|
|
return $.ligerui.run.call(this, "ligerForm", arguments);
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
$.ligerui.getConditions = function (form, options)
|
|||
|
|
{
|
|||
|
|
if (!form) return null;
|
|||
|
|
form = liger.get($(form));
|
|||
|
|
if (form && form.toConditions) return form.toConditions();
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
$.ligerDefaults = $.ligerDefaults || {};
|
|||
|
|
$.ligerDefaults.Form = {
|
|||
|
|
width: null, // 表单的宽度
|
|||
|
|
//控件宽度
|
|||
|
|
inputWidth: 180,
|
|||
|
|
//标签宽度
|
|||
|
|
labelWidth: 90,
|
|||
|
|
//间隔宽度
|
|||
|
|
space: 40,
|
|||
|
|
rightToken: '：',
|
|||
|
|
//标签对齐方式
|
|||
|
|
labelAlign: 'left',
|
|||
|
|
//控件对齐方式
|
|||
|
|
align: 'left',
|
|||
|
|
|
|||
|
|
autoTypePrev : 'ui-',
|
|||
|
|
//字段
|
|||
|
|
/*
|
|||
|
|
数组的集合,支持的类型包括在$.ligerDefaults.Form.editors,这个editors同Grid的editors继承于base.js中提供的编辑器集合,具体可以看liger.editors
|
|||
|
|
字段的参数参考 127行左右的 $.ligerDefaults.Form_fields,
|
|||
|
|
ui内置的编辑表单元素都会调用ui的表单插件集合,所以这些字段都有属于自己的"liger对象",可以同liger.get("[ID]")的方式获取，这里的[ID]获取方式优先级如下：
|
|||
|
|
1,定义了field.id 则取field.id
|
|||
|
|
2,如果是下拉框和PopupEdit，并且定义了comboboxName，则取comboboxName(如果表单定义了prefixID,需要加上)
|
|||
|
|
3,默认取field.name(如果表单定义了prefixID,需要加上)
|
|||
|
|
*/
|
|||
|
|
fields: [],
|
|||
|
|
//创建的表单元素是否附加ID
|
|||
|
|
appendID: true,
|
|||
|
|
//生成表单元素ID、Name的前缀
|
|||
|
|
prefixID: null,
|
|||
|
|
//json解析函数
|
|||
|
|
toJSON: $.ligerui.toJSON,
|
|||
|
|
labelCss: null,
|
|||
|
|
fieldCss: null,
|
|||
|
|
spaceCss: null,
|
|||
|
|
onAfterSetFields: null,
|
|||
|
|
// 参数同 ligerButton
|
|||
|
|
buttons: null, //按钮组
|
|||
|
|
readonly: false, //是否只读
|
|||
|
|
editors: {}, //编辑器集合,使用同$.ligerDefaults.Grid.editors
|
|||
|
|
//验证
|
|||
|
|
validate: null,
|
|||
|
|
//不设置validate属性到inuput
|
|||
|
|
unSetValidateAttr: false,
|
|||
|
|
tab: null,
|
|||
|
|
clsTab: 'ui-tabs-nav ui-helper-clearfix',
|
|||
|
|
clsTabItem: 'ui-state-default',
|
|||
|
|
clsTabItemSelected: 'ui-tabs-selected',
|
|||
|
|
clsTabContent: 'ui-tabs-panel ui-widget-content'
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
$.ligerDefaults.FormString = {
|
|||
|
|
invalidMessage: '存在{errorCount}个字段验证不通过，请检查!',
|
|||
|
|
detailMessage: '详细',
|
|||
|
|
okMessage: '确定'
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
$.ligerDefaults.Form.editors.textarea =
|
|||
|
|
{
|
|||
|
|
create: function (container, editParm, p)
|
|||
|
|
{
|
|||
|
|
var editor = $('<textarea class="l-textarea" />');
|
|||
|
|
var id = (p.prefixID || "") + editParm.field.name;
|
|||
|
|
if ($("#" + id).length)
|
|||
|
|
{
|
|||
|
|
editor = $("#" + id);
|
|||
|
|
}
|
|||
|
|
editor.attr({
|
|||
|
|
id: id,
|
|||
|
|
name: id
|
|||
|
|
});
|
|||
|
|
if (editParm.field.editor && editParm.field.editor.height)
|
|||
|
|
{
|
|||
|
|
editor.height(editParm.field.editor.height);
|
|||
|
|
}
|
|||
|
|
if (p.readonly) editor.attr("readonly", true);
|
|||
|
|
container.append(editor);
|
|||
|
|
return editor;
|
|||
|
|
},
|
|||
|
|
getValue: function (editor, editParm)
|
|||
|
|
{
|
|||
|
|
return editor.val();
|
|||
|
|
},
|
|||
|
|
setValue: function (editor, value, editParm)
|
|||
|
|
{
|
|||
|
|
editor.val(value);
|
|||
|
|
},
|
|||
|
|
resize: function (editor, width, height, editParm)
|
|||
|
|
{
|
|||
|
|
editor.css({
|
|||
|
|
width: width - 2
|
|||
|
|
}).parent().css("width", "auto");
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
$.ligerDefaults.Form.editors.hidden =
|
|||
|
|
{
|
|||
|
|
create: function (container, editParm, p)
|
|||
|
|
{
|
|||
|
|
var editor = $('<input type = "hidden" />');
|
|||
|
|
var id = (p.prefixID || "") + editParm.field.name;
|
|||
|
|
if ($("#" + id).length)
|
|||
|
|
{
|
|||
|
|
editor = $("#" + id);
|
|||
|
|
}
|
|||
|
|
//添加options.attr属性的设置
|
|||
|
|
editor.attr($.extend({
|
|||
|
|
id: id,
|
|||
|
|
name: id
|
|||
|
|
}, editParm.field.attr));
|
|||
|
|
var eo = editParm.field.editor || editParm.field.options;
|
|||
|
|
eo && editor.val(eo.value);
|
|||
|
|
container.append(editor);
|
|||
|
|
return editor;
|
|||
|
|
},
|
|||
|
|
getValue: function (editor, editParm)
|
|||
|
|
{
|
|||
|
|
return editor.val();
|
|||
|
|
},
|
|||
|
|
setValue: function (editor, value, editParm)
|
|||
|
|
{
|
|||
|
|
editor.val(value);
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
$.ligerDefaults.Form_fields = {
|
|||
|
|
name: null, //字段name
|
|||
|
|
textField: null, //文本框name
|
|||
|
|
type: null, //表单类型
|
|||
|
|
editor: null, //编辑器扩展
|
|||
|
|
label: null, //Label
|
|||
|
|
labelInAfter: false, //label显示在后面
|
|||
|
|
afterContent: null, //后置内容
|
|||
|
|
beforeContent : null, //前置内容
|
|||
|
|
hideSpace: false,
|
|||
|
|
hideLabel: false,
|
|||
|
|
rightToken: null,
|
|||
|
|
attrRender: null,
|
|||
|
|
style : null,
|
|||
|
|
containerCls : null,
|
|||
|
|
newline: true, //换行显示
|
|||
|
|
op: null, //操作符 附加到input
|
|||
|
|
vt: null, //值类型 附加到input
|
|||
|
|
attr: null, //属性列表 附加到input
|
|||
|
|
validate: null //验证参数，比如required:true
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
$.ligerDefaults.Form_editor = {
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
//description 自动创建自定义风格的表单-编辑器构造函数
|
|||
|
|
//格式为：
|
|||
|
|
//{
|
|||
|
|
// name: jinput.attr("name"),
|
|||
|
|
// control: {
|
|||
|
|
// getValue: function ()
|
|||
|
|
// {
|
|||
|
|
// return jinput.val();
|
|||
|
|
// },
|
|||
|
|
// setValue: function (value)
|
|||
|
|
// {
|
|||
|
|
// jinput.val(value);
|
|||
|
|
// }
|
|||
|
|
// }
|
|||
|
|
//}
|
|||
|
|
//editorBulider -> editorBuilder 命名错误
|
|||
|
|
//param {jinput} 表单元素jQuery对象 比如input、select、textarea
|
|||
|
|
$.ligerDefaults.Form.editorBulider = function (jinput)
|
|||
|
|
{
|
|||
|
|
//这里this就是form的ligerui对象
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
if (!jinput || !jinput.length) return;
|
|||
|
|
var options = {}, ltype = jinput.attr("ltype"), field = {};
|
|||
|
|
if (p.readonly) options.readonly = true;
|
|||
|
|
options = $.extend({
|
|||
|
|
width: (field.width || p.inputWidth) - 2
|
|||
|
|
}, field.options, field.editor, options);
|
|||
|
|
var control = null;
|
|||
|
|
|
|||
|
|
if (ltype == "autocomplete")
|
|||
|
|
options.autocomplete = true;
|
|||
|
|
if (jinput.is("select") && ltype != "none")
|
|||
|
|
{
|
|||
|
|
control = jinput.ligerComboBox(options);
|
|||
|
|
}
|
|||
|
|
else if (jinput.is(":password") && ltype != "none")
|
|||
|
|
{
|
|||
|
|
control = jinput.ligerTextBox(options);
|
|||
|
|
}
|
|||
|
|
else if (jinput.is(":radio") && ltype != "none")
|
|||
|
|
{
|
|||
|
|
control = jinput.ligerRadio(options);
|
|||
|
|
}
|
|||
|
|
else if (jinput.is(":checkbox") && ltype != "none")
|
|||
|
|
{
|
|||
|
|
control = jinput.ligerCheckBox(options);
|
|||
|
|
}
|
|||
|
|
else if (jinput.is("textarea") && ltype != "none")
|
|||
|
|
{
|
|||
|
|
jinput.addClass("l-textarea");
|
|||
|
|
|
|||
|
|
control = {
|
|||
|
|
getValue: function ()
|
|||
|
|
{
|
|||
|
|
return jinput.val();
|
|||
|
|
},
|
|||
|
|
setValue: function (value)
|
|||
|
|
{
|
|||
|
|
jinput.val(value);
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
}
|
|||
|
|
else if (ltype && ltype != "none")
|
|||
|
|
{
|
|||
|
|
if (jinput.is(":text"))
|
|||
|
|
{
|
|||
|
|
switch (ltype)
|
|||
|
|
{
|
|||
|
|
case "select":
|
|||
|
|
case "combobox":
|
|||
|
|
case "autocomplete":
|
|||
|
|
control = jinput.ligerComboBox(options);
|
|||
|
|
break;
|
|||
|
|
case "spinner":
|
|||
|
|
control = jinput.ligerSpinner(options);
|
|||
|
|
break;
|
|||
|
|
case "date":
|
|||
|
|
control = jinput.ligerDateEditor(options);
|
|||
|
|
break;
|
|||
|
|
case "popup":
|
|||
|
|
control = jinput.ligerPopupEdit(options);
|
|||
|
|
break;
|
|||
|
|
case "currency":
|
|||
|
|
control = options.currency = true;
|
|||
|
|
case "float":
|
|||
|
|
case "number":
|
|||
|
|
options.number = true;
|
|||
|
|
control = jinput.ligerTextBox(options);
|
|||
|
|
break;
|
|||
|
|
case "int":
|
|||
|
|
case "digits":
|
|||
|
|
options.digits = true;
|
|||
|
|
default:
|
|||
|
|
control = jinput.ligerTextBox(options);
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
else if (jinput.is(":hidden"))
|
|||
|
|
{
|
|||
|
|
switch (ltype)
|
|||
|
|
{
|
|||
|
|
case "select":
|
|||
|
|
case "combobox":
|
|||
|
|
case "autocomplete":
|
|||
|
|
control = jinput.ligerComboBox(options);
|
|||
|
|
break;
|
|||
|
|
case "checkboxlist":
|
|||
|
|
control = jinput.ligerCheckBoxList(options);
|
|||
|
|
break;
|
|||
|
|
case "radiolist":
|
|||
|
|
control = jinput.ligerRadioList(options);
|
|||
|
|
break;
|
|||
|
|
case "listbox":
|
|||
|
|
control = jinput.ligerListBox(options);
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
else //没有定义ltype的 text or hidden
|
|||
|
|
{
|
|||
|
|
var classname = jinput.get(0).className;
|
|||
|
|
if (classname)
|
|||
|
|
{
|
|||
|
|
var autoTypePrev = p.autoTypePrev || "ui-";
|
|||
|
|
if (classname.indexOf(autoTypePrev) != -1)
|
|||
|
|
{
|
|||
|
|
classname = classname.replace(autoTypePrev, "");
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if (!classname && (jinput.is(":hidden") || jinput.is(":text")) && jinput.attr("name")) //没有匹配的classname
|
|||
|
|
{
|
|||
|
|
control = {
|
|||
|
|
getValue: function ()
|
|||
|
|
{
|
|||
|
|
return jinput.val();
|
|||
|
|
},
|
|||
|
|
setValue: function (value)
|
|||
|
|
{
|
|||
|
|
jinput.val(value);
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
}
|
|||
|
|
else
|
|||
|
|
{
|
|||
|
|
switch (classname)
|
|||
|
|
{
|
|||
|
|
case "textbox":
|
|||
|
|
case "password":
|
|||
|
|
control = jinput.ligerTextBox(options);
|
|||
|
|
break;
|
|||
|
|
case "datepicker":
|
|||
|
|
control = jinput.ligerDateEditor(options);
|
|||
|
|
break;
|
|||
|
|
case "spinner":
|
|||
|
|
control = jinput.ligerSpinner(options);
|
|||
|
|
break;
|
|||
|
|
case "checkbox":
|
|||
|
|
control = jinput.ligerCheckBox(options);
|
|||
|
|
break;
|
|||
|
|
case "combobox":
|
|||
|
|
control = jinput.ligerComboBox(options);
|
|||
|
|
break;
|
|||
|
|
case "checkboxlist":
|
|||
|
|
control = jinput.ligerCheckBoxList(options);
|
|||
|
|
break;
|
|||
|
|
case "radiolist":
|
|||
|
|
control = jinput.ligerRadioList(options);
|
|||
|
|
break;
|
|||
|
|
case "listbox":
|
|||
|
|
control = jinput.ligerListBox(options);
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if (!control) return null;
|
|||
|
|
return {
|
|||
|
|
name: jinput.attr("name"),
|
|||
|
|
control: control
|
|||
|
|
};
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//表单组件
|
|||
|
|
$.ligerui.controls.Form = function (element, options)
|
|||
|
|
{
|
|||
|
|
$.ligerui.controls.Form.base.constructor.call(this, element, options);
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
$.ligerui.controls.Form.ligerExtend($.ligerui.core.UIComponent, {
|
|||
|
|
__getType: function ()
|
|||
|
|
{
|
|||
|
|
return 'Form'
|
|||
|
|
},
|
|||
|
|
__idPrev: function ()
|
|||
|
|
{
|
|||
|
|
return 'Form';
|
|||
|
|
},
|
|||
|
|
_init: function ()
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
$.ligerui.controls.Form.base._init.call(this);
|
|||
|
|
//编辑构造器初始化
|
|||
|
|
for (var type in liger.editors)
|
|||
|
|
{
|
|||
|
|
var editor = liger.editors[type];
|
|||
|
|
//如果没有默认的或者已经定义
|
|||
|
|
if (!editor || type in p.editors) continue;
|
|||
|
|
p.editors[type] = liger.getEditor($.extend({
|
|||
|
|
type: type,
|
|||
|
|
master: g
|
|||
|
|
}, editor));
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
_render: function ()
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
var jform = $(this.element);
|
|||
|
|
g.form = jform.is("form") ? jform : jform.parents("form:first");
|
|||
|
|
//生成ligerui表单样式
|
|||
|
|
$("input,select,textarea", jform).each(function ()
|
|||
|
|
{
|
|||
|
|
var result = p.editorBulider.call(g, $(this));
|
|||
|
|
if (result)
|
|||
|
|
{
|
|||
|
|
g.autoEditors = g.autoEditors || [];
|
|||
|
|
g.autoEditors.push(result);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
if (g.autoEditors && g.autoEditors.length && p.validate)
|
|||
|
|
{
|
|||
|
|
g.validate = g.validate || {};
|
|||
|
|
$(g.autoEditors).each(function ()
|
|||
|
|
{
|
|||
|
|
var name = this.name;
|
|||
|
|
var control = this.control;
|
|||
|
|
if (name && control.inputText && control.inputText.attr("validate"))
|
|||
|
|
{
|
|||
|
|
var v = null, vm = null;
|
|||
|
|
eval("v = " + control.inputText.attr("validate"));
|
|||
|
|
if (v)
|
|||
|
|
{
|
|||
|
|
g.validate.rules = g.validate.rules || {};
|
|||
|
|
g.validate.rules[name] = v;
|
|||
|
|
}
|
|||
|
|
if (control.inputText.attr("validateMessage"))
|
|||
|
|
{
|
|||
|
|
eval("vm = " + control.inputText.attr("validateMessage"));
|
|||
|
|
if (vm)
|
|||
|
|
{
|
|||
|
|
g.validate.messages = g.validate.messages || {};
|
|||
|
|
g.validate.messages[name] = vm;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
g.set(p);
|
|||
|
|
g.initValidate();
|
|||
|
|
if (p.buttons)
|
|||
|
|
{
|
|||
|
|
var jbuttons = $('<ul class="l-form-buttons"></ul>').appendTo(jform);
|
|||
|
|
$(p.buttons).each(function ()
|
|||
|
|
{
|
|||
|
|
var jbutton = $('<li><div></div></li>').appendTo(jbuttons);
|
|||
|
|
$("div:first", jbutton).ligerButton(this);
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
if (!g.element.id) g.element.id = g.id;
|
|||
|
|
//分组 收缩/展开
|
|||
|
|
$("#" + g.element.id + " .togglebtn").live('click', function ()
|
|||
|
|
{
|
|||
|
|
if ($(this).hasClass("togglebtn-down")) $(this).removeClass("togglebtn-down");
|
|||
|
|
else $(this).addClass("togglebtn-down");
|
|||
|
|
var boxs = $(this).parent().nextAll("ul,div");
|
|||
|
|
for (var i = 0; i < boxs.length; i++)
|
|||
|
|
{
|
|||
|
|
var jbox = $(boxs[i]);
|
|||
|
|
if (jbox.hasClass("l-group")) break;
|
|||
|
|
if ($(this).hasClass("togglebtn-down"))
|
|||
|
|
{
|
|||
|
|
jbox.hide();
|
|||
|
|
} else
|
|||
|
|
{
|
|||
|
|
jbox.show();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
_setWidth: function (value)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
if (value) g.form.width(value);
|
|||
|
|
},
|
|||
|
|
getEditor: function (name)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
if (!g.editors) return;
|
|||
|
|
var o = find(null);
|
|||
|
|
if (o) return o;
|
|||
|
|
if (p.tab && p.tab.items)
|
|||
|
|
{
|
|||
|
|
for (var i = 0; i < p.tab.items.length; i++)
|
|||
|
|
{
|
|||
|
|
var item = p.tab.items[i];
|
|||
|
|
var o = find(item, i);
|
|||
|
|
if (o) return o;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return null;
|
|||
|
|
function find(tabitem, tabindex)
|
|||
|
|
{
|
|||
|
|
var fields = tabitem == null ? p.fields : tabitem.fields;
|
|||
|
|
for (var i = 0, l = fields.length; i < l; i++)
|
|||
|
|
{
|
|||
|
|
var field = fields[i];
|
|||
|
|
var eIndex = tabindex == null ? i : "tab" + tabindex + "_" + i;
|
|||
|
|
if (field.name == name && g.editors[eIndex])
|
|||
|
|
{
|
|||
|
|
return g.editors[eIndex].control;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
getField: function (index)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
if (!p.fields) return null;
|
|||
|
|
return p.fields[index];
|
|||
|
|
},
|
|||
|
|
toConditions: function ()
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
var conditions = [];
|
|||
|
|
|
|||
|
|
$(p.fields).each(function (fieldIndex, field)
|
|||
|
|
{
|
|||
|
|
var name = field.name, textField = field.textField, editor = g.editors[fieldIndex];
|
|||
|
|
if (!editor || !name) return;
|
|||
|
|
var value = editor.editor.getValue.call(g, editor.control, {
|
|||
|
|
field: field
|
|||
|
|
});
|
|||
|
|
if (value != null && value !== "")
|
|||
|
|
{
|
|||
|
|
conditions.push({
|
|||
|
|
op: field.operator || "like",
|
|||
|
|
field: name,
|
|||
|
|
value: value,
|
|||
|
|
type: field.type || "string"
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
return conditions;
|
|||
|
|
},
|
|||
|
|
//预处理字段 , 处理分组
|
|||
|
|
_preSetFields: function (fields)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options, lastVisitedGroup = null, lastVisitedGroupIcon = null;
|
|||
|
|
//分组： 先填充没有设置分组的字段
|
|||
|
|
$(p.fields).each(function (i, field)
|
|||
|
|
{
|
|||
|
|
if (p.readonly || field.readonly || (field.editor && field.editor.readonly))
|
|||
|
|
{
|
|||
|
|
//if (!field.editor) field.editor = {};
|
|||
|
|
//field.editor.readonly = field.editor.readonly || true;
|
|||
|
|
delete field.validate;
|
|||
|
|
}
|
|||
|
|
if (field.type == "hidden") return;
|
|||
|
|
field.type = field.type || "text";
|
|||
|
|
if (field.newline == null) field.newline = true;
|
|||
|
|
if (lastVisitedGroup && !field.group)
|
|||
|
|
{
|
|||
|
|
field.group = lastVisitedGroup;
|
|||
|
|
field.groupicon = lastVisitedGroupIcon;
|
|||
|
|
}
|
|||
|
|
if (field.group)
|
|||
|
|
{
|
|||
|
|
field.group = field.group.toString().replace(/^\s\s*/, '').replace(/\s\s*$/, '');
|
|||
|
|
lastVisitedGroup = field.group;
|
|||
|
|
lastVisitedGroupIcon = field.groupicon;
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
_setReadonly: function (readonly)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
if (readonly && g.editors)
|
|||
|
|
{
|
|||
|
|
for (var index in g.editors)
|
|||
|
|
{
|
|||
|
|
var control = g.editors[index].control;
|
|||
|
|
if (control && control._setReadonly) control._setReadonly(true);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
_setFields: function (fields)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
if ($.isFunction(p.prefixID)) p.prefixID = p.prefixID(g);
|
|||
|
|
var jform = $(g.element).addClass("l-form");
|
|||
|
|
g._initFieldsValidate({
|
|||
|
|
fields: fields
|
|||
|
|
});
|
|||
|
|
g._initFieldsHtml({
|
|||
|
|
panel: jform,
|
|||
|
|
fields: fields
|
|||
|
|
});
|
|||
|
|
g._createEditors({
|
|||
|
|
fields: fields
|
|||
|
|
});
|
|||
|
|
g.trigger('afterSetFields');
|
|||
|
|
},
|
|||
|
|
_initFieldsValidate: function (e)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
var fields = e.fields;
|
|||
|
|
g.validate = g.validate || {};
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
if (fields && fields.length)
|
|||
|
|
{
|
|||
|
|
$(fields).each(function (index, field)
|
|||
|
|
{
|
|||
|
|
var name = field.name,
|
|||
|
|
readonly = (field.readonly || (field.editor && field.editor.readonly)) ? true : false,
|
|||
|
|
txtInputName = (p.prefixID || "") + (field.textField || field.id || field.name);
|
|||
|
|
if (field.validate && !readonly)
|
|||
|
|
{
|
|||
|
|
g.validate.rules = g.validate.rules || {};
|
|||
|
|
g.validate.rules[txtInputName] = field.validate;
|
|||
|
|
if (field.validateMessage)
|
|||
|
|
{
|
|||
|
|
g.validate.messages = g.validate.messages || {};
|
|||
|
|
g.validate.messages[txtInputName] = field.validateMessage;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
_initFieldsHtml: function (e)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
var jform = e.panel,
|
|||
|
|
fields = e.fields,
|
|||
|
|
idPrev = e.idPrev || g.id,
|
|||
|
|
tabindex = e.tabindex;
|
|||
|
|
$(">.l-form-container", jform).remove();
|
|||
|
|
var lineWidth = 0, maxWidth = 0;
|
|||
|
|
if (fields && fields.length)
|
|||
|
|
{
|
|||
|
|
g._preSetFields(fields);
|
|||
|
|
var out = ['<div class="l-form-container">'],
|
|||
|
|
appendULStartTag = false,
|
|||
|
|
lastVisitedGroup = null,
|
|||
|
|
groups = [];
|
|||
|
|
$(fields).each(function (index, field)
|
|||
|
|
{
|
|||
|
|
if (!field.group) field.group = "";
|
|||
|
|
if ($.inArray(field.group, groups) == -1)
|
|||
|
|
groups.push(field.group);
|
|||
|
|
});
|
|||
|
|
$(groups).each(function (groupIndex, group)
|
|||
|
|
{
|
|||
|
|
$(fields).each(function (i, field)
|
|||
|
|
{
|
|||
|
|
if (field.group != group) return;
|
|||
|
|
var index = $.inArray(field, fields);
|
|||
|
|
var name = field.id || field.name, newline = field.newline;
|
|||
|
|
var inputName = (p.prefixID || "") + (field.id || field.name);
|
|||
|
|
if (!name) return;
|
|||
|
|
if (field.type == "hidden")
|
|||
|
|
{
|
|||
|
|
if (!$("#" + inputName).length)
|
|||
|
|
out.push('<div style="display:none" id="' + (idPrev + "|" + i) + '"></div>');
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
var toAppendGroupRow = field.group && field.group != lastVisitedGroup;
|
|||
|
|
if (index == 0 || toAppendGroupRow) newline = true;
|
|||
|
|
if (newline)
|
|||
|
|
{
|
|||
|
|
lineWidth = 0;
|
|||
|
|
if (appendULStartTag)
|
|||
|
|
{
|
|||
|
|
out.push('</ul>');
|
|||
|
|
appendULStartTag = false;
|
|||
|
|
}
|
|||
|
|
if (toAppendGroupRow)
|
|||
|
|
{
|
|||
|
|
out.push('<div class="l-group');
|
|||
|
|
if (field.groupicon)
|
|||
|
|
out.push(' l-group-hasicon');
|
|||
|
|
out.push('">');
|
|||
|
|
if (field.groupicon)
|
|||
|
|
out.push('<img src="' + field.groupicon + '" />');
|
|||
|
|
out.push('<span>' + field.group + '</span></div>');
|
|||
|
|
lastVisitedGroup = field.group;
|
|||
|
|
}
|
|||
|
|
out.push('<ul>');
|
|||
|
|
appendULStartTag = true;
|
|||
|
|
}
|
|||
|
|
out.push('<li class="l-fieldcontainer');
|
|||
|
|
if (newline)
|
|||
|
|
{
|
|||
|
|
out.push(' l-fieldcontainer-first');
|
|||
|
|
}
|
|||
|
|
if (field.containerCls)
|
|||
|
|
{
|
|||
|
|
out.push(' ' + field.containerCls);
|
|||
|
|
}
|
|||
|
|
out.push('"');
|
|||
|
|
if (field.style)
|
|||
|
|
{
|
|||
|
|
out.push(' style="' + field.style + '"');
|
|||
|
|
}
|
|||
|
|
out.push(' fieldindex="' + index + '"');
|
|||
|
|
if (tabindex != null)
|
|||
|
|
{
|
|||
|
|
out.push(' tabindex="' + tabindex + '"');
|
|||
|
|
}
|
|||
|
|
if (field.attrRender)
|
|||
|
|
{
|
|||
|
|
out.push(' ' + field.attrRender());
|
|||
|
|
}
|
|||
|
|
out.push('><ul>');
|
|||
|
|
//append field 编辑后面自定义内容
|
|||
|
|
if (field.beforeContent) //前置内容
|
|||
|
|
{
|
|||
|
|
var beforeContent = $.isFunction(field.beforeContent) ? field.afterContent(field) : field.beforeContent;
|
|||
|
|
beforeContent && out.push(beforeContent);
|
|||
|
|
}
|
|||
|
|
if (!field.hideLabel && !field.labelInAfter)
|
|||
|
|
{
|
|||
|
|
out.push(g._buliderLabelContainer(field, index));
|
|||
|
|
}
|
|||
|
|
//append input
|
|||
|
|
out.push(g._buliderControlContainer(field, index, e.idPrev));
|
|||
|
|
if (field.labelInAfter)
|
|||
|
|
{
|
|||
|
|
out.push(g._buliderLabelContainer(field, index));
|
|||
|
|
}
|
|||
|
|
//append field 编辑后面自定义内容
|
|||
|
|
if (field.afterContent)
|
|||
|
|
{
|
|||
|
|
var afterContent = $.isFunction(field.afterContent) ? field.afterContent(field) : field.afterContent;
|
|||
|
|
afterContent && out.push(afterContent);
|
|||
|
|
}
|
|||
|
|
//append space
|
|||
|
|
if (!field.hideSpace)
|
|||
|
|
{
|
|||
|
|
out.push(g._buliderSpaceContainer(field, index));
|
|||
|
|
}
|
|||
|
|
out.push('</ul></li>');
|
|||
|
|
|
|||
|
|
lineWidth += (field.width || p.inputWidth || 0);
|
|||
|
|
lineWidth += (field.space || p.space || 0);
|
|||
|
|
lineWidth += (field.labelWidth || p.labelWidth || 0);
|
|||
|
|
if (lineWidth > maxWidth) maxWidth = lineWidth;
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
if (appendULStartTag)
|
|||
|
|
{
|
|||
|
|
out.push('</ul>');
|
|||
|
|
appendULStartTag = false;
|
|||
|
|
}
|
|||
|
|
out.push('<div class="l-clear"></div>');
|
|||
|
|
out.push('</div>');
|
|||
|
|
jform.append(out.join(''));
|
|||
|
|
if (!p.width || maxWidth > p.width)
|
|||
|
|
{
|
|||
|
|
//jform.width(maxWidth + 10);
|
|||
|
|
}
|
|||
|
|
$(".l-group .togglebtn", jform).remove();
|
|||
|
|
$(".l-group", jform).width(jform.width() * 0.95).append("<div class='togglebtn'></div>");
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
_createEditors : function(e)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
var fields = e.fields,
|
|||
|
|
idPrev = e.idPrev || g.id,
|
|||
|
|
editPrev = e.editPrev || "";
|
|||
|
|
g.editors = g.editors || {};
|
|||
|
|
var jform = $(g.element);
|
|||
|
|
$(fields).each(function (fieldIndex, field)
|
|||
|
|
{
|
|||
|
|
var container = document.getElementById(idPrev + "|" + fieldIndex),
|
|||
|
|
editor = p.editors[field.type],
|
|||
|
|
editId = editPrev + fieldIndex;
|
|||
|
|
if (!container) return;
|
|||
|
|
container = $(container);
|
|||
|
|
var editorControl = g._createEditor(editor, container, {
|
|||
|
|
field: field
|
|||
|
|
}, container.width(), container.height());
|
|||
|
|
if (!editorControl) return;
|
|||
|
|
if (g.editors[editId] && g.editors[editId].control && g.editors[editId].control.destroy)
|
|||
|
|
{
|
|||
|
|
g.editors[editId].control.destroy();
|
|||
|
|
}
|
|||
|
|
g.editors[editId] = {
|
|||
|
|
control: editorControl,
|
|||
|
|
editor: editor
|
|||
|
|
};
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
getChanges: function ()
|
|||
|
|
{
|
|||
|
|
//本函数返回当前数据与上一次数据之间的差异. 如果没有差异, 则返回空对象.
|
|||
|
|
//注意!! getData会导致数据被刷新. 必须严格控制getData的调用.
|
|||
|
|
//调用本函数不会导致刷新数据.
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
var originData = g.data;
|
|||
|
|
var curData = g.getData();
|
|||
|
|
g.data = originData;
|
|||
|
|
|
|||
|
|
var c = {};
|
|||
|
|
for (var k in originData)
|
|||
|
|
{
|
|||
|
|
if (curData[k] != originData[k])
|
|||
|
|
c[k] = curData[k];
|
|||
|
|
}
|
|||
|
|
return c;
|
|||
|
|
},
|
|||
|
|
setEnabled: function (arg, isEnabled)
|
|||
|
|
{
|
|||
|
|
var fieldNames = [];
|
|||
|
|
if ($.isArray(arg)) fieldNames = arg;
|
|||
|
|
if (typeof (arg) == "string") fieldNames.push(arg);
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
setEnabledInFields(p.fields);
|
|||
|
|
if (p.tab && p.tab.items)
|
|||
|
|
{
|
|||
|
|
for (var i = 0; i < p.tab.items.length; i++)
|
|||
|
|
{
|
|||
|
|
var item = p.tab.items[i];
|
|||
|
|
setEnabledInFields(item.fields, i);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
function setEnabledInFields(fields, tabIndex)
|
|||
|
|
{
|
|||
|
|
$(fields).each(function (fieldIndex, field)
|
|||
|
|
{
|
|||
|
|
var name = field.name,
|
|||
|
|
textField = field.textField,
|
|||
|
|
editPrev = tabIndex == null ? "" : "tab" + tabIndex + "_",
|
|||
|
|
editor = g.editors[editPrev + fieldIndex];
|
|||
|
|
if (!editor || !name) return;
|
|||
|
|
if (!editor.editor || !editor.editor.setEnabled) return;
|
|||
|
|
if ($.inArray(name, fieldNames) == -1) return;
|
|||
|
|
editor.editor.setEnabled(editor.control, isEnabled);
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
setVisible: function (arg, isVisible)
|
|||
|
|
{
|
|||
|
|
var fieldNames = [];
|
|||
|
|
if ($.isArray(arg)) fieldNames = arg;
|
|||
|
|
if (typeof (arg) == "string") fieldNames.push(arg);
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
setVisibleInFields(p.fields);
|
|||
|
|
if (p.tab && p.tab.items)
|
|||
|
|
{
|
|||
|
|
for (var i = 0; i < p.tab.items.length; i++)
|
|||
|
|
{
|
|||
|
|
var item = p.tab.items[i];
|
|||
|
|
setVisibleInFields(item.fields, i);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
function setVisibleInFields(fields, tabIndex)
|
|||
|
|
{
|
|||
|
|
$(fields).each(function (fieldIndex, field)
|
|||
|
|
{
|
|||
|
|
var name = field.name;
|
|||
|
|
if ($.inArray(name, fieldNames) == -1) return;
|
|||
|
|
g._setFieldPanelVisible(tabIndex, fieldIndex, isVisible);
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
_setFieldPanelVisible: function (tabindex, fieldindex, visible)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
if (tabindex == null)
|
|||
|
|
{
|
|||
|
|
$("li.l-fieldcontainer[fieldindex=" + fieldindex + "]", g.element)[visible ? 'show' : 'hide']();
|
|||
|
|
}
|
|||
|
|
else
|
|||
|
|
{
|
|||
|
|
$("div."+p.clsTabContent+"[data-index=" + tabindex + "] li.l-fieldcontainer[fieldindex=" + fieldindex + "]", g.element)[visible ? 'show' : 'hide']();
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
getData: function ()
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
g.data = g.formData || {};
|
|||
|
|
|
|||
|
|
if (g.autoEditors && g.autoEditors.length)
|
|||
|
|
{
|
|||
|
|
$(g.autoEditors).each(function ()
|
|||
|
|
{
|
|||
|
|
var name = this.name;
|
|||
|
|
var control = this.control;
|
|||
|
|
if (name && control && control.getValue)
|
|||
|
|
{
|
|||
|
|
g.data[name] = control.getValue();
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
getFieldValueToData(p.fields);
|
|||
|
|
if (p.tab && p.tab.items)
|
|||
|
|
{
|
|||
|
|
for (var i = 0; i < p.tab.items.length; i++)
|
|||
|
|
{
|
|||
|
|
var item = p.tab.items[i];
|
|||
|
|
getFieldValueToData(item.fields, i);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
function getFieldValueToData(fields, tabIndex)
|
|||
|
|
{
|
|||
|
|
$(fields).each(function (fieldIndex, field)
|
|||
|
|
{
|
|||
|
|
|
|||
|
|
var name = field.name,
|
|||
|
|
textField = field.textField,
|
|||
|
|
editPrev = tabIndex == null ? "" : "tab" + tabIndex + "_",
|
|||
|
|
editor = g.editors[editPrev + fieldIndex];
|
|||
|
|
if (!editor) return;
|
|||
|
|
if (name)
|
|||
|
|
{
|
|||
|
|
var value = editor.editor.getValue.call(g, editor.control, {
|
|||
|
|
field: field
|
|||
|
|
});
|
|||
|
|
g._setValueByName(g.data, name, value);
|
|||
|
|
}
|
|||
|
|
if (textField && editor.editor.getText)
|
|||
|
|
{
|
|||
|
|
var value = editor.editor.getText.call(g, editor.control, {
|
|||
|
|
field: field
|
|||
|
|
});
|
|||
|
|
g._setValueByName(g.data, textField, value);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
return g.data;
|
|||
|
|
},
|
|||
|
|
_setData: function (data)
|
|||
|
|
{
|
|||
|
|
this.setData(data);
|
|||
|
|
},
|
|||
|
|
setData: function (data)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
g.data = data || {};
|
|||
|
|
|
|||
|
|
if (g.autoEditors && g.autoEditors.length)
|
|||
|
|
{
|
|||
|
|
$(g.autoEditors).each(function ()
|
|||
|
|
{
|
|||
|
|
var name = this.name;
|
|||
|
|
var control = this.control;
|
|||
|
|
if (name && g.data[name] && control && control.setValue)
|
|||
|
|
{
|
|||
|
|
control.setValue(g.data[name]);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
setDataToFields(p.fields);
|
|||
|
|
if (p.tab && p.tab.items)
|
|||
|
|
{
|
|||
|
|
for (var i = 0; i < p.tab.items.length; i++)
|
|||
|
|
{
|
|||
|
|
var item = p.tab.items[i];
|
|||
|
|
setDataToFields(item.fields, i);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
function setDataToFields(fields, tabIndex)
|
|||
|
|
{
|
|||
|
|
$(fields).each(function (fieldIndex, field)
|
|||
|
|
{
|
|||
|
|
var name = field.name,
|
|||
|
|
textField = field.textField,
|
|||
|
|
editPrev = tabIndex == null ? "" : "tab" + tabIndex + "_",
|
|||
|
|
editor = g.editors[editPrev + fieldIndex];
|
|||
|
|
if (!editor) return;
|
|||
|
|
if (name && (name in g.data))
|
|||
|
|
{
|
|||
|
|
var value = g._getValueByName(g.data, name);
|
|||
|
|
editor.editor.setValue.call(g,editor.control, value, {
|
|||
|
|
field: field
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
if (textField && (textField in g.data))
|
|||
|
|
{
|
|||
|
|
var text = g._getValueByName(g.data, textField);
|
|||
|
|
editor.editor.setText.call(g, editor.control, text, {
|
|||
|
|
field: field
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
_setValueByName: function (data, name, value)
|
|||
|
|
{
|
|||
|
|
if (!data || !name) return null;
|
|||
|
|
if (name.indexOf('.') == -1)
|
|||
|
|
{
|
|||
|
|
data[name] = value;
|
|||
|
|
}
|
|||
|
|
else
|
|||
|
|
{
|
|||
|
|
try
|
|||
|
|
{
|
|||
|
|
new Function("data,value", "data." + name + "=value;")(data, value);
|
|||
|
|
}
|
|||
|
|
catch (e)
|
|||
|
|
{
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
_getValueByName: function (data, name)
|
|||
|
|
{
|
|||
|
|
if (!data || !name) return null;
|
|||
|
|
if (name.indexOf('.') == -1)
|
|||
|
|
{
|
|||
|
|
return data[name];
|
|||
|
|
}
|
|||
|
|
else
|
|||
|
|
{
|
|||
|
|
try
|
|||
|
|
{
|
|||
|
|
return new Function("data", "return data." + name + ";")(data);
|
|||
|
|
}
|
|||
|
|
catch (e)
|
|||
|
|
{
|
|||
|
|
return null;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//验证
|
|||
|
|
valid: function ()
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
if (!g.form || !g.validator) return true;
|
|||
|
|
return g.form.valid();
|
|||
|
|
},
|
|||
|
|
showFieldError: function (name, errorText)
|
|||
|
|
{
|
|||
|
|
var element = $("[name=" + name + "]", this.element);
|
|||
|
|
if (element.hasClass("l-textarea"))
|
|||
|
|
{
|
|||
|
|
element.addClass("l-textarea-invalid");
|
|||
|
|
}
|
|||
|
|
else if (element.hasClass("l-text-field"))
|
|||
|
|
{
|
|||
|
|
element.parent().addClass("l-text-invalid");
|
|||
|
|
}
|
|||
|
|
$(element).removeAttr("title").ligerHideTip();
|
|||
|
|
$(element).attr("title", errorText).ligerTip({
|
|||
|
|
distanceX: 5,
|
|||
|
|
distanceY: -3,
|
|||
|
|
auto: true
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
hideFieldError: function (name)
|
|||
|
|
{
|
|||
|
|
var element = $("[name=" + name + "]", this.element);
|
|||
|
|
if (element.hasClass("l-textarea"))
|
|||
|
|
{
|
|||
|
|
element.removeClass("l-textarea-invalid");
|
|||
|
|
}
|
|||
|
|
else
|
|||
|
|
{
|
|||
|
|
element.parent().removeClass("l-text-invalid");
|
|||
|
|
}
|
|||
|
|
$(element).removeAttr("title").ligerHideTip();
|
|||
|
|
},
|
|||
|
|
//设置验证
|
|||
|
|
initValidate: function ()
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
if (!g.form || !p.validate || !g.form.validate)
|
|||
|
|
{
|
|||
|
|
g.validator = null;
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
var validate = p.validate == true ? {} : p.validate;
|
|||
|
|
var validateOptions = $.extend({
|
|||
|
|
errorPlacement: function (lable, element)
|
|||
|
|
{
|
|||
|
|
if (!$(lable).html())
|
|||
|
|
{
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
if (!element.attr("id"))
|
|||
|
|
{
|
|||
|
|
var eleid = new Date().getTime();
|
|||
|
|
element.attr("id", eleid);
|
|||
|
|
lable.attr("for", eleid);
|
|||
|
|
}
|
|||
|
|
if (element.hasClass("l-textarea"))
|
|||
|
|
{
|
|||
|
|
element.addClass("l-textarea-invalid");
|
|||
|
|
}
|
|||
|
|
else if (element.hasClass("l-text-field"))
|
|||
|
|
{
|
|||
|
|
element.parent().addClass("l-text-invalid");
|
|||
|
|
}
|
|||
|
|
$(element).removeAttr("title").ligerHideTip();
|
|||
|
|
$(element).attr("title", $(lable).html()).ligerTip({
|
|||
|
|
distanceX: 5,
|
|||
|
|
distanceY: -3,
|
|||
|
|
auto: true
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
success: function (lable)
|
|||
|
|
{
|
|||
|
|
var eleId = lable.attr("for");
|
|||
|
|
if (!eleId) return;
|
|||
|
|
var element = $("#" + eleId);
|
|||
|
|
if (element.hasClass("l-textarea"))
|
|||
|
|
{
|
|||
|
|
element.removeClass("l-textarea-invalid");
|
|||
|
|
}
|
|||
|
|
else
|
|||
|
|
{
|
|||
|
|
element.parent().removeClass("l-text-invalid");
|
|||
|
|
}
|
|||
|
|
$(element).removeAttr("title").ligerHideTip();
|
|||
|
|
}
|
|||
|
|
}, validate, {
|
|||
|
|
rules: g.validate.rules,
|
|||
|
|
messages: g.validate.messages
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
g.validator = g.form.validate(validateOptions);
|
|||
|
|
},
|
|||
|
|
setFieldValidate: function (name, validate, messages)
|
|||
|
|
{
|
|||
|
|
var jele = $("[name=" + name + "]");
|
|||
|
|
if (!jele.length || !jele.rules) return;
|
|||
|
|
var oldRule = jele.rules("remove");
|
|||
|
|
if (oldRule) //旧的验证移除验证结果
|
|||
|
|
{
|
|||
|
|
if (jele.hasClass("l-text-field"))
|
|||
|
|
{
|
|||
|
|
jele.parent().removeClass("l-text-invalid");
|
|||
|
|
}
|
|||
|
|
jele.removeAttr("title").ligerHideTip();
|
|||
|
|
if (oldRule.required)//旧的验证包括必填规则，移除*
|
|||
|
|
{
|
|||
|
|
jele.parents("li:first").next("li:first").find(".l-star").remove();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if (!validate)//没有定义新的验证规则
|
|||
|
|
{
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
var rule = $.extend({}, validate, { messages: messages });
|
|||
|
|
jele.rules("add", rule);
|
|||
|
|
if (validate.required)
|
|||
|
|
{
|
|||
|
|
//验证包括必填规则，添加*
|
|||
|
|
jele.parents("li:first").next("li:first").append('<span class="l-star">*</span>');
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//提示 验证错误信息
|
|||
|
|
showInvalid: function ()
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
if (!g.validator) return;
|
|||
|
|
var invalidMessage = p.invalidMessage.replace('{errorCount}', g.validator.errorList.length);
|
|||
|
|
if (p.showInvalid)
|
|||
|
|
{
|
|||
|
|
p.showInvalid(invalidMessage);
|
|||
|
|
} else
|
|||
|
|
{
|
|||
|
|
var jmessage = $('<div><div class="invalid">' + invalidMessage + '<a class="viewInvalidDetail" href="javascript:void(0)">' + p.detailMessage + '</a></div><div class="invalidDetail" style="display:none;">' + getInvalidInf(g.validator.errorList) + '</div></div>');
|
|||
|
|
jmessage.find("a.viewInvalidDetail:first").bind('click', function ()
|
|||
|
|
{
|
|||
|
|
$(this).parent().next("div.invalidDetail").toggle();
|
|||
|
|
});
|
|||
|
|
$.ligerDialog.open({
|
|||
|
|
type: 'error',
|
|||
|
|
width: 350,
|
|||
|
|
showMax: false,
|
|||
|
|
showToggle: false,
|
|||
|
|
showMin: false,
|
|||
|
|
target: jmessage,
|
|||
|
|
buttons: [
|
|||
|
|
{
|
|||
|
|
text: p.okMessage, onclick: function (item, dailog)
|
|||
|
|
{
|
|||
|
|
dailog.close();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
_createEditor: function (editorBuilder, container, editParm, width, height)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
try
|
|||
|
|
{
|
|||
|
|
var editor = editorBuilder.create.call(this, container, editParm, p);
|
|||
|
|
if (editor && editorBuilder.resize)
|
|||
|
|
editorBuilder.resize.call(this, editor, width, height, editParm);
|
|||
|
|
return editor;
|
|||
|
|
} catch (e)
|
|||
|
|
{
|
|||
|
|
return null;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//标签部分
|
|||
|
|
_buliderLabelContainer: function (field)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
var label = field.label || field.display;
|
|||
|
|
var labelWidth = field.labelWidth || field.labelwidth || p.labelWidth;
|
|||
|
|
var labelAlign = field.labelAlign || p.labelAlign;
|
|||
|
|
if (label)
|
|||
|
|
{
|
|||
|
|
var rightToken = field.rightToken;
|
|||
|
|
if (rightToken == null || rightToken == "") rightToken = p.rightToken;
|
|||
|
|
label += rightToken;
|
|||
|
|
}
|
|||
|
|
var out = [];
|
|||
|
|
out.push('<li');
|
|||
|
|
if (p.labelCss)
|
|||
|
|
{
|
|||
|
|
out.push(' class="' + p.labelCss + '"');
|
|||
|
|
}
|
|||
|
|
out.push(' style="');
|
|||
|
|
if (/px$/i.test(labelWidth) || /auto/i.test(labelWidth) || /%$/i.test(labelWidth))
|
|||
|
|
{
|
|||
|
|
out.push('width:' + labelWidth + ';');
|
|||
|
|
}
|
|||
|
|
else if (labelWidth)
|
|||
|
|
{
|
|||
|
|
out.push('width:' + labelWidth + 'px;');
|
|||
|
|
}
|
|||
|
|
if (labelAlign && labelAlign != "top")
|
|||
|
|
{
|
|||
|
|
out.push('text-align:' + labelAlign + ';');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
out.push('">');
|
|||
|
|
if (label)
|
|||
|
|
{
|
|||
|
|
out.push(label);
|
|||
|
|
}
|
|||
|
|
out.push('</li>');
|
|||
|
|
return out.join('');
|
|||
|
|
},
|
|||
|
|
//控件部分
|
|||
|
|
_buliderControlContainer: function (field, fieldIndex, idPrev)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
var width = field.width || p.inputWidth,
|
|||
|
|
align = field.align || field.textAlign || field.textalign || p.align,
|
|||
|
|
out = [],
|
|||
|
|
idPrev = idPrev || g.id;
|
|||
|
|
var labelAlign = field.labelAlign || p.labelAlign;
|
|||
|
|
out.push('<li');
|
|||
|
|
out.push(' id="' + (idPrev + "|" + fieldIndex) + '"');
|
|||
|
|
if (p.fieldCss)
|
|||
|
|
{
|
|||
|
|
out.push(' class="' + p.fieldCss + '"');
|
|||
|
|
}
|
|||
|
|
out.push(' style="');
|
|||
|
|
if (/px$/i.test(width) || /auto/i.test(width) || /%$/i.test(width))
|
|||
|
|
{
|
|||
|
|
out.push('width:' + width + ';');
|
|||
|
|
}
|
|||
|
|
else if (width)
|
|||
|
|
{
|
|||
|
|
out.push('width:' + width + 'px;');
|
|||
|
|
}
|
|||
|
|
if (align)
|
|||
|
|
{
|
|||
|
|
out.push('text-align:' + align + ';');
|
|||
|
|
}
|
|||
|
|
if (labelAlign == "top")
|
|||
|
|
{
|
|||
|
|
out.push('clear:both;');
|
|||
|
|
}
|
|||
|
|
out.push('">');
|
|||
|
|
out.push('</li>');
|
|||
|
|
return out.join('');
|
|||
|
|
},
|
|||
|
|
//间隔部分
|
|||
|
|
_buliderSpaceContainer: function (field)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
var spaceWidth = field.space || field.spaceWidth || p.space;
|
|||
|
|
if (field.space === 0 || field.spaceWidth === 0) spaceWidth = 0;
|
|||
|
|
var out = [];
|
|||
|
|
out.push('<li');
|
|||
|
|
if (p.spaceCss)
|
|||
|
|
{
|
|||
|
|
out.push(' class="' + p.spaceCss + '"');
|
|||
|
|
}
|
|||
|
|
out.push(' style="');
|
|||
|
|
if (/px$/i.test(spaceWidth) || /auto/i.test(spaceWidth) || /%$/i.test(spaceWidth))
|
|||
|
|
{
|
|||
|
|
out.push('width:' + spaceWidth + ';');
|
|||
|
|
}
|
|||
|
|
if (spaceWidth)
|
|||
|
|
{
|
|||
|
|
out.push('width:' + spaceWidth + 'px;');
|
|||
|
|
}
|
|||
|
|
out.push('">');
|
|||
|
|
if (field.validate && field.validate.required)
|
|||
|
|
{
|
|||
|
|
out.push("<span class='l-star'>*</span>");
|
|||
|
|
}
|
|||
|
|
out.push('</li>');
|
|||
|
|
return out.join('');
|
|||
|
|
},
|
|||
|
|
_getInputAttrHtml: function (field)
|
|||
|
|
{
|
|||
|
|
var out = [], type = (field.type || "text").toLowerCase();
|
|||
|
|
if (type == "textarea")
|
|||
|
|
{
|
|||
|
|
field.cols && out.push('cols="' + field.cols + '" ');
|
|||
|
|
field.rows && out.push('rows="' + field.rows + '" ');
|
|||
|
|
}
|
|||
|
|
out.push('ltype="' + type + '" ');
|
|||
|
|
field.op && out.push('op="' + field.op + '" ');
|
|||
|
|
field.vt && out.push('vt="' + field.vt + '" ');
|
|||
|
|
if (field.attr)
|
|||
|
|
{
|
|||
|
|
for (var attrp in field.attr)
|
|||
|
|
{
|
|||
|
|
out.push(attrp + '="' + field.attr[attrp] + '" ');
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return out.join('');
|
|||
|
|
},
|
|||
|
|
_setTab: function (tab)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
if (!tab || !tab.items) return;
|
|||
|
|
var jtab = $('<div class="l-form-tabs"></div>').appendTo(g.element);
|
|||
|
|
var jtabNav = $('<ul class="' + p.clsTab + '" original-title="">').appendTo(jtab);
|
|||
|
|
for (var i = 0; i < tab.items.length; i++)
|
|||
|
|
{
|
|||
|
|
var tabItem = tab.items[i],
|
|||
|
|
jnavItem = $('<li class="'+p.clsTabItem+'"><a href="javascript:void(0)"></a></li>').appendTo(jtabNav),
|
|||
|
|
jcontentItem = $('<div class="'+p.clsTabContent+'">').appendTo(jtab),
|
|||
|
|
idPrev = g.id + "|tdb" + i;
|
|||
|
|
jnavItem.add(jcontentItem).attr("data-index", i);
|
|||
|
|
if (tabItem.id)
|
|||
|
|
{
|
|||
|
|
jnavItem.attr("data-id", tabItem.id);
|
|||
|
|
}
|
|||
|
|
jnavItem.find("a:first").text(tabItem.title);
|
|||
|
|
g._initFieldsValidate({
|
|||
|
|
fields: tabItem.fields
|
|||
|
|
});
|
|||
|
|
g._initFieldsHtml({
|
|||
|
|
panel: jcontentItem,
|
|||
|
|
fields: tabItem.fields,
|
|||
|
|
tabindex : i,
|
|||
|
|
idPrev: idPrev
|
|||
|
|
});
|
|||
|
|
g._createEditors({
|
|||
|
|
fields: tabItem.fields,
|
|||
|
|
idPrev: idPrev,
|
|||
|
|
editPrev: 'tab' + i + "_"
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
jtabNav.find("li").click(function ()
|
|||
|
|
{
|
|||
|
|
$(this).addClass(p.clsTabItemSelected);
|
|||
|
|
}, function ()
|
|||
|
|
{
|
|||
|
|
$(this).removeClass(p.clsTabItemSelected);
|
|||
|
|
}).click(function ()
|
|||
|
|
{
|
|||
|
|
var index = $(this).attr("data-index");
|
|||
|
|
g.selectTab(index);
|
|||
|
|
});
|
|||
|
|
g.selectTab(0);
|
|||
|
|
},
|
|||
|
|
selectTab: function (index)
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
var jtab = $(g.element).find(".l-form-tabs:first");
|
|||
|
|
var links = jtab.find(".ui-tabs-nav li"), contents = jtab.find(".ui-tabs-panel");
|
|||
|
|
|
|||
|
|
links.filter("[data-index=" + index + "]")
|
|||
|
|
.addClass(p.clsTabItemSelected);
|
|||
|
|
links.filter("[data-index!=" + index + "]")
|
|||
|
|
.removeClass(p.clsTabItemSelected);
|
|||
|
|
contents.filter("[data-index=" + index + "]").show();
|
|||
|
|
contents.filter("[data-index!=" + index + "]").hide();
|
|||
|
|
},
|
|||
|
|
destroy: function ()
|
|||
|
|
{
|
|||
|
|
try
|
|||
|
|
{
|
|||
|
|
var g = this, p = this.options;
|
|||
|
|
liger.remove(this);
|
|||
|
|
for (var index in g.editors)
|
|||
|
|
{
|
|||
|
|
var control = g.editors[index].control;
|
|||
|
|
if (control && control.destroy) control.destroy();
|
|||
|
|
}
|
|||
|
|
$(g.element).remove();
|
|||
|
|
}
|
|||
|
|
catch (e)
|
|||
|
|
{
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
|
|||
|
|
function getInvalidInf(errorList)
|
|||
|
|
{
|
|||
|
|
var out = [];
|
|||
|
|
$(errorList).each(function (i, error)
|
|||
|
|
{
|
|||
|
|
var label = $(error.element).parents("li:first").prev("li:first").html();
|
|||
|
|
var message = error.message;
|
|||
|
|
out.push('<div>' + label + ' ' + message + '</div>');
|
|||
|
|
});
|
|||
|
|
return out.join('');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
})(jQuery);
|