You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

8 lines
7.0 KiB
JavaScript

/**
* 可编辑表格插件
* 如果编辑表格中有用到,下拉框和日期,必须先引入
* bootstrap-select 和 bootstrap-datetimepicker两个控件
* @author lizx <851697971@qq.com>
* @version 1.0
* @date 2015-10-13
*/(function(c){function l(a,m){a.enableAppend=!0;var f=c(m),b=f.parent(),d=a.data[b.data("index")],b=b.children().index(f),e=a.columns["column"+b];if(e.edit&&"object"==typeof e.edit){f.data("oldVal")||f.data("oldVal",c.trim(d[e.field]));var b=f.innerHeight()-3,h=f.innerWidth()-2;f.data("style",f.attr("style"));f.attr("style","margin:0px;padding:1px!important;");var g="";!0==e.edit.required&&(g="\u5fc5\u586b\u9879");d=null==d[e.field]||""==d[e.field]?"":d[e.field];f.html('\x3cdiv style\x3d"margin:0;padding:0;overflow:hidden;border:solid 0px red;height:'+b+"px;width:"+h+'px;"\x3e\x3cinput type\x3d"text" placeholder\x3d"'+g+'" value\x3d"'+d+'" style\x3d"margin-left: 0px; margin-right: 0px; padding-top: 1px; padding-bottom: 1px; width:100%;height:100%"\x3e\x3c/div\x3e');f.width(h);g=f.find("input");e.edit.type&&"text"!=e.edit.type?"select"==e.edit.type?g.bootstrapSelect(e.edit):"date"==e.edit.type&&(f.html('\x3cdiv style\x3d"margin:0;padding:0;overflow:hidden;border:solid 0px red;height:'+b+"px;width:"+h+'px;" class\x3d"input-group date form_datetime" data-link-field\x3d"dtp_editable_input"\x3e\x3cinput class\x3d"form-control" type\x3d"text" value\x3d"'+d+'"\x3e\x3cspan class\x3d"input-group-addon"\x3e\x3cspan class\x3d"glyphicon glyphicon-th"\x3e\x3c/span\x3e\x3c/span\x3e\x3c/div\x3e\x3cinput type\x3d"hidden" id\x3d"dtp_editable_input" value\x3d"'+d+'"/\x3e'),a.$body.find(".form_datetime").datetimepicker({weekStart:1,todayBtn:1,autoclose:1,todayHighlight:1,startView:2,forceParse:0,language:"zh-CN",format:"yyyy-mm-dd hh:ii:ss",pickerPosition:"bottom-left",showMeridian:1})):(e.edit.click&&"function"===typeof e.edit.click&&g.unbind("click").bind("click",function(a){e.edit.click.call(this,a)}),e.edit.focus&&"function"===typeof e.edit.focus&&g.unbind("focus").bind("focus",function(a){e.edit.focus.call(this,a)}),g.unbind("blur").on("blur",function(a){e.edit.blur&&"function"===typeof e.edit.blur&&e.edit.blur.call(this,a)}));f.data("field",e.field)}}function k(a){var b=!1;null!=a.prevEditRow&&(a.prevEditRow.find("td").closest("td").siblings().html(function(f,t){c(this).attr("style",c(this).data("style"));var d=c(this).find('input[type\x3d"text"]').val(),e=c(this).find('input[type\x3d"hidden"]').val();"object"!=typeof c(this).find('input[type\x3d"text"]').bootstrapSelect("getText")&&c(this).find('input[type\x3d"text"]').bootstrapSelect("destroy");if(void 0!=d)return c(this).data("oldVal")!=(e?e:c.trim(d))&&(a.data[a.prevEditRow.data("index")][c(this).data("field")]=e?e:c.trim(d),b=!0),!0!=a.columns["column"+f].edit.required||null!=d&&""!=d?c.trim(d):(a.enableAppend=!1,'\x3cspan style\x3d"color:red;"\x3e\u5fc5\u586b\u9879\u4e0d\u80fd\u4e3a\u7a7a\x3c/span\x3e')}),b||a.prevEditRow.hasClass("editable-insert")?a.prevEditRow.addClass("editable-modify"):a.prevEditRow.removeClass("editable-modify"))}c.extend(c.fn.bootstrapTable.defaults,{editable:!1});var b=c.fn.bootstrapTable.Constructor,n=b.prototype.init,p=b.prototype.initBody,q=b.prototype.onSort,r=b.prototype.append,s=b.prototype.initHeader;c.extend(!0,b.COLUMN_DEFAULTS,{edit:{type:"text"}});b.prototype.init=function(){n.apply(this,Array.prototype.slice.apply(arguments));var a=this;a.prevEditRow=null;a.columns={};a.insertRowVal={};a.enableAppend=!0;if(a.options.editable){var b=this.getColumns();c.each(b,function(f,b){c.each(b,function(d,e){!isNaN(e.fieldIndex)&&0<=e.fieldIndex&&(e.checkbox&&(e.edit=!1),a.columns["column"+e.fieldIndex]=e,a.insertRowVal[e.field]="")})})}};b.prototype.initHeader=function(){s.apply(this,Array.prototype.slice.apply(arguments));this.$container.find(".fixed-table-header").addClass("success")};b.prototype.initBody=function(){var a=this,b={};a.$body&&a.$body.find("\x3etr").each(function(a){c(this).attr("class")&&(b[a]=c(this).attr("class"))});p.apply(this,Array.prototype.slice.apply(arguments));if(a.options.editable){this.initEdit();for(var f in b)a.$body.find("\x3etr").eq(f).attr("class",b[f]);c.each(a.columns,function(b,d){d.edit&&"select"==d.edit.type&&(d.edit=c.extend({},c.fn.bootstrapSelect.defaults,d.edit),0<d.edit.data.length?a.$body.find("\x3etr").each(function(){if(1>a.getData().length)return!0;var e=a.data[c(this).data("index")],b=c(this).find("td").eq(d.fieldIndex);c.each(d.edit.data,function(a,c){c[d.edit.valueField]==e[d.field]&&b.html(c[d.edit.textField])})}):d.edit.url&&c.ajax({url:d.edit.url,type:"post",data:"json"==d.edit.paramsType?JSON.stringify(d.edit.params):d.edit.params,dataType:"json",success:function(e){d.edit.onLoadSuccess.call(this,e);a.$body.find("\x3etr").each(function(){if(1>a.getData().length)return!0;var b=a.data[c(this).data("index")],f=c(this).find("td").eq(d.fieldIndex);c.each(e,function(a,c){c[d.edit.valueField]==b[d.field]&&f.html(c[d.edit.textField])})});d.edit.data=e;d.edit.url=null},error:function(a,c,b){d.edit.onLoadError.call(this);d.edit.data=[];d.edit.url=null;throw d.field+" \u5217\u4e0b\u62c9\u6846\u6570\u636e\u52a0\u8f7d\u5931\u8d25";}}))})}};b.prototype.removeRow=function(a){var c=this.options.data.length;isNaN(a)||(this.options.data.splice(a,1),c!==this.options.data.length&&(this.initBody(),1>this.getData().length&&this.$body.find("\x3etr").addClass("no-records-found")))};b.prototype.append=function(){var a=this;a.enableAppend&&(arguments[0]=c.extend({},a.insertRowVal,arguments[0]),r.apply(this,Array.prototype.slice.apply(arguments)),a.options.editable&&(a.$body.find("\x3etr:last").addClass("editable-insert"),setTimeout(function(){a.$body.find("\x3etr:last").click()},150)))};b.prototype.onSort=function(){q.apply(this,Array.prototype.slice.apply(arguments));this.options.editable&&this.initEdit()};b.prototype.getData=function(){return this.searchText||this.searchCallback?this.data:this.options.data};b.prototype.getColumns=function(){return this.options.columns};b.prototype.getModiDatas=function(){var a=this,b=[];a.$body.find(".editable-modify").each(function(){b.push(a.data[c(this).data("index")])});return b};b.prototype.getColTotal=function(a){this.getData();var b=0;this.$body.find("\x3etr").each(function(){var f=0,f=c(this).hasClass("editable-select")?c(this).find("td").eq(a).find("input").val():c(this).find("td").eq(a).html();isNaN(f)||(b+=Number(f))});return b};b.prototype.initEdit=function(){var a=this,b=this.getData();this.$body.delegate("\x3etr","click",function(){var f=c(this);f.hasClass("editable-select")||1>b.length||(f.removeClass("no-records-found"),f.addClass("editable-select"),k(a),a.prevEditRow=f,a.$body.find("\x3e tr").not(this).removeClass("editable-select"),f.find("td").closest("td").siblings().html(function(b,c){l(a,this)}))});c(document).bind("mousedown",function(b){b=c(b.target);b.parents().andSelf().is(a.$body)||b.parents().andSelf().is(c(".datetimepicker"))||setTimeout(function(){k(a);a.prevEditRow=null;a.$body.find("\x3e tr").removeClass("editable-select")},10)})};c.fn.bootstrapTable.methods.push("getColumns","getModiDatas","removeRow","getColTotal")})(jQuery);