JQgrid在添加和编辑时,弹出的编辑框里面,难免会很有一些默认必填的选项,但是这个插件我没有在官网文档里面找到默认给这些项加必填提示的参数,只有在点击提交的时候才有参数校验对必填项进行验证提示。
所以我在源码里面做了一下修改,如下,位置在 editGridRow->callback for each()-> createData -> callback for each()里面,具体如下图
//判断这个标签是否是必填项,是的话在标签上加入 * 标记
var node =obj.p.colModel[i];
var label = obj.p.colNames[i];
if (typeof(node.editable) != "undefined" && node.editable
&& typeof(node.editrules) != "undefined" && typeof(node.editrules.required) != "undefined"
&& node.editrules.required )
label = obj.p.colNames[i] + "*";
$("td:eq("+(cp-2)+")",trdata[0]).html(frmopt.label === undefined ? label: frmopt.label);
效果图如图:
最后再将这个代码所在的方法的完整代码贴一下
function createData(rowid,obj,tb,maxcols){
var nm, hc,trdata, cnt=0,tmp, dc,elc, retpos=[], ind=false,
tdtmpl = "<td class='CaptionTD'> </td><td class='DataTD'> </td>", tmpl="", i; //*2
for (i =1; i<=maxcols;i++) {
tmpl += tdtmpl;
}
if(rowid !== '_empty') {
ind = $(obj).jqGrid("getInd",rowid);
}
$(obj.p.colModel).each( function(i) {
nm = this.name;
// hidden fields are included in the form
if(this.editrules && this.editrules.edithidden === true) {
hc = false;
} else {
hc = this.hidden === true ? true : false;
}
dc = hc ? "style='display:none'" : "";
if ( nm !== 'cb' && nm !== 'subgrid' && this.editable===true && nm !== 'rn') {
if(ind === false) {
tmp = "";
} else {
if(nm === obj.p.ExpandColumn && obj.p.treeGrid === true) {
tmp = $("td[role='gridcell']:eq("+i+")",obj.rows[ind]).text();
} else {
try {
tmp = $.unformat.call(obj, $("td[role='gridcell']:eq("+i+")",obj.rows[ind]),{rowId:rowid, colModel:this},i);
} catch (_) {
tmp = (this.edittype && this.edittype === "textarea") ? $("td[role='gridcell']:eq("+i+")",obj.rows[ind]).text() : $("td[role='gridcell']:eq("+i+")",obj.rows[ind]).html();
}
if(!tmp || tmp === " " || tmp === " " || (tmp.length===1 && tmp.charCodeAt(0)===160) ) {tmp='';}
}
}
var opt = $.extend({}, this.editoptions || {} ,{id:nm,name:nm, rowId: rowid}),
frmopt = $.extend({}, {elmprefix:'',elmsuffix:'',rowabove:false,rowcontent:''}, this.formoptions || {}),
rp = parseInt(frmopt.rowpos,10) || cnt+1,
cp = parseInt((parseInt(frmopt.colpos,10) || 1)*2,10);
if(rowid === "_empty" && opt.defaultValue ) {
tmp = $.isFunction(opt.defaultValue) ? opt.defaultValue.call($t) : opt.defaultValue;
}
if(!this.edittype) {this.edittype = "text";}
if($t.p.autoencode) {tmp = $.jgrid.htmlDecode(tmp);}
elc = $.jgrid.createEl.call($t,this.edittype,opt,tmp,false,$.extend({},$.jgrid.ajaxOptions,obj.p.ajaxSelectOptions || {}));
//if(tmp === "" && this.edittype == "checkbox") {tmp = $(elc).attr("offval");}
//if(tmp === "" && this.edittype == "select") {tmp = $("option:eq(0)",elc).text();}
if(rp_ge[$t.p.id].checkOnSubmit || rp_ge[$t.p.id].checkOnUpdate) {rp_ge[$t.p.id]._savedData[nm] = tmp;}
$(elc).addClass("FormElement");
if( $.inArray(this.edittype, ['text','textarea','password','select']) > -1) {
$(elc).addClass("ui-widget-content ui-corner-all");
}
trdata = $(tb).find("tr[rowpos="+rp+"]");
if(frmopt.rowabove) {
var newdata = $("<tr><td class='contentinfo' colspan='"+(maxcols*2)+"'>"+frmopt.rowcontent+"</td></tr>");
$(tb).append(newdata);
newdata[0].rp = rp;
}
if ( trdata.length===0 ) {
trdata = $("<tr "+dc+" rowpos='"+rp+"'></tr>").addClass("FormData").attr("id","tr_"+nm);
$(trdata).append(tmpl);
$(tb).append(trdata);
trdata[0].rp = rp;
}
//判断这个标签是否是必填项,是的话在标签上加入 * 标记,mujave 2019-11-27
var node =obj.p.colModel[i];
var label = obj.p.colNames[i];
if (typeof(node.editable) != "undefined" && node.editable
&& typeof(node.editrules) != "undefined" && typeof(node.editrules.required) != "undefined"
&& node.editrules.required )
label = obj.p.colNames[i] + "*";
$("td:eq("+(cp-2)+")",trdata[0]).html(frmopt.label === undefined ? label: frmopt.label);
// end
$("td:eq("+(cp-1)+")",trdata[0]).append(frmopt.elmprefix).append(elc).append(frmopt.elmsuffix);
if(this.edittype==='custom' && $.isFunction(opt.custom_value) ) {
opt.custom_value.call($t, $("#"+nm,"#"+frmgr),'set',tmp);
}
$.jgrid.bindEv.call($t, elc, opt);
retpos[cnt] = i;
cnt++;
}
});
if( cnt > 0) {
var idrow = $("<tr class='FormData' style='display:none'><td class='CaptionTD'></td><td colspan='"+ (maxcols*2-1)+"' class='DataTD'><input class='FormElement' id='id_g' type='text' name='"+obj.p.id+"_id' value='"+rowid+"'/></td></tr>");
idrow[0].rp = cnt+999;
$(tb).append(idrow);
if(rp_ge[$t.p.id].checkOnSubmit || rp_ge[$t.p.id].checkOnUpdate) {rp_ge[$t.p.id]._savedData[obj.p.id+"_id"] = rowid;}
}
return retpos;
}