在使用FastAdmin 键值组件(Fieldlist) 如果键名为纯数字时,保存后排序失败,将变成键名由小到大的排列方式,用起来很不方便
可以自己修改 public/assets/js/require-form.js 文件,将里面的 fieldlist 替换成下面的,只修改了加粗部分,直接替换会方便些
fieldlist: function (form) {
//绑定fieldlist
if ($(".fieldlist", form).length > 0) {
require(['dragsort', 'template'], function (undefined, Template) {
var prefix='~*orderByKey*~';
//刷新隐藏textarea的值
var refresh = function (container) {
var data = {};
var name = container.data("name");
var textarea = $("textarea[name='" + name + "']", form);
var template = container.data("template");
$.each($("input,select,textarea", container).serializeArray(), function (i, j) {
var reg = /\[(\w+)\]\[(\w+)\]$/g;
var match = reg.exec(j.name);
if (!match)
return true;
match[1] = "x" + parseInt(match[1]);
if (typeof data[match[1]] == 'undefined') {
data[match[1]] = {};
}
data[match[1]][match[2]] = j.value;
});
var result = template ? [] : {};
$.each(data, function (i, j) {
if (j) {
if (!template) {
if (j.key != '') {
result[prefix + j.key] = j.value;
}
} else {
result.push(j);
}
}
});
textarea.val(JSON.stringify(result).replaceAll(prefix,''));
};
//追加一行数据
var append = function (container, row, initial) {
var tagName = container.data("tag") || (container.is("table") ? "tr" : "dd");
var index = container.data("index");
var name = container.data("name");
var template = container.data("template");
var data = container.data();
index = index ? parseInt(index) : 0;
container.data("index", index + 1);
row = row ? row : {};
row = typeof row.key === 'undefined' || typeof row.value === 'undefined' ? {key: '', value: row} : row;
var options = container.data("fieldlist-options") || {};
var vars = {index: index, name: name, data: data, options: options, key: row.key, value: row.value, row: row.value};
var html = template ? Template(template, vars) : Template.render(Form.config.fieldlisttpl, vars);
var obj = $(html);
if ((options.deleteBtn === false || options.removeBtn === false) && initial)
obj.find(".btn-remove").remove();
if (options.dragsortBtn === false && initial)
obj.find(".btn-dragsort").remove();
if ((options.readonlyKey === true || options.disableKey === true) && initial) {
obj.find("input[name$='[key]']").prop("readonly", true);
}
obj.attr("fieldlist-item", true);
obj.insertAfter($(tagName + "[fieldlist-item]", container).length > 0 ? $(tagName + "[fieldlist-item]:last", container) : $(tagName + ":first", container));
if ($(".btn-append,.append", container).length > 0) {
//兼容旧版本事件
$(".btn-append,.append", container).trigger("fa.event.appendfieldlist", obj);
} else {
//新版本事件
container.trigger("fa.event.appendfieldlist", obj);
}
return obj;
};
var fieldlist = $(".fieldlist", form);
//表单重置
form.on("reset", function () {
setTimeout(function () {
fieldlist.trigger("fa.event.refreshfieldlist");
});
});
//监听文本框改变事件
$(document).on('change keyup changed', ".fieldlist input,.fieldlist textarea,.fieldlist select", function () {
var container = $(this).closest(".fieldlist");
refresh(container);
});
//追加控制(点击按钮)
fieldlist.on("click", ".btn-append,.append", function (e, row) {
var container = $(this).closest(".fieldlist");
append(container, row);
// refresh(container);
});
//移除控制(点击按钮)
fieldlist.on("click", ".btn-remove", function () {
var container = $(this).closest(".fieldlist");
var tagName = container.data("tag") || (container.is("table") ? "tr" : "dd");
$(this).closest(tagName).remove();
refresh(container);
});
//追加控制(通过事件)
fieldlist.on("fa.event.appendtofieldlist", function (e, row) {
var container = $(this);
append(container, row);
refresh(container);
});
//根据textarea内容重新渲染
fieldlist.on("fa.event.refreshfieldlist", function () {
var container = $(this);
var textarea = $("textarea[name='" + container.data("name") + "']", form);
//先清空已有的数据
$("[fieldlist-item]", container).remove();
var json = {};
try {
json = JSON.parse(textarea.val());
if(!Array.isArray(json)){
json = JSON.parse(textarea.val().replaceAll('":',prefix+'":'));
}
} catch (e) {
}
$.each(json, function (i, j) {
if (typeof j == 'string') {
i = i.replaceAll(prefix,'');
}
append(container, {key: i, value: j}, true);
});
});
//拖拽排序
fieldlist.each(function () {
var container = $(this);
var tagName = container.data("tag") || (container.is("table") ? "tr" : "dd");
container.dragsort({
itemSelector: tagName,
dragSelector: ".btn-dragsort",
dragEnd: function () {
refresh(container);
},
placeHolderTemplate: $("<" + tagName + "/>")
});
if (typeof container.data("options") === 'object' && container.data("options").appendBtn === false) {
$(".btn-append,.append", container).hide();
}
$("textarea[name='" + container.data("name") + "']", form).on("fa.event.refreshfieldlist", function () {
//兼容旧版本事件
$(this).closest(".fieldlist").trigger("fa.event.refreshfieldlist");
});
});
fieldlist.trigger("fa.event.refreshfieldlist");
});
}
},
原创文章,作者:admin,如若转载,请注明出处:https://ntib.cn/305.html