143 lines
5.4 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/**
* @author horken wong <horken.wong@gmail.com>
* @version: v1.0.0
* https://github.com/horkenw/bootstrap-table
* Click to edit row for bootstrap-table
*/
(function ($) {
'use strict';
$.extend($.fn.bootstrapTable.defaults, {
clickEdit: false
});
function setDivision(node, options){
var $option = $('<option />');
if(options){
$(options).each(function(i, v){
$option.clone().text(v.idxNum + ' ' +v.name).val(v.idxNum).appendTo(node);
})
}
else{
console.log('Please setup options first!!')
}
}
function clikcToEdit(evt, tarNode){
var txt = [], table = evt,
submit = '<button type="button" class="btn btn-primary btn-sm editable-submit"><i class="glyphicon glyphicon-ok"></i></button>',
cancel = '<button type="button" class="btn btn-default btn-sm editable-cancel"><i class="glyphicon glyphicon-remove"></i></button>';
var replaceData = function(){
txt = [];
tarNode.find('td').find('input[type="text"]').each(function(i, td){
txt.push($(td).eq(0).val());
});
tarNode.find('select').each(function(i, td){
txt.push($('#'+td.id+' option:selected').val());
});
$('#table').bootstrapTable('updateRow', {
index: table.$data.thId,
row: {
noOld: txt[0],
area: tarNode.find('select').eq(0).children(':selected').text(),
town: tarNode.find('select').eq(1).children(':selected').text(),
address: txt[1]
}
});
$('#tooling').remove();
table.editing = true;
// updateToServerSide(table.$data.itemid, txt);
return false;
};
var recoveryData = function(){
$('#table').bootstrapTable('updateRow', {
index: table.$data.thId,
row: {},
});
$('#tooling').remove();
table.editing = true;
return false;
};
if(table.editing){
var rootid = 0;
table.editing = false;
table.columns.forEach(function(column, i){
if (!column.editable) return;
switch(column.editable){
case 'input':
var div=$('<div class="editable-input col-md-12 col-sm-12 col-xs-12" style="position: relative;"/>');
txt.push(tarNode.find('td').eq(column.fieldIndex).text());
div.append($('<input type="text" class="form-control input-sm"/>'));
div.append($('<span class="clear"><i class="fa fa-times-circle-o" aria-hidden="true"></i></span>'));
tarNode.find('td').eq(column.fieldIndex).text('').append(div);
break;
case 'select':
var select=$('<select id="'+column.field+'">'), options = $.selectArray[column.field];
tarNode.find('td').eq(column.fieldIndex).text('').append(select);
setDivision($('#'+column.field), options);
break;
case 'textarea':
break;
default:
console.log(column.fieldIndex+' '+column.editable);
}
}, evt);
for(var i=0, l=txt.length; i<l; i++){
tarNode.find('input[type="text"]').eq(i).val(txt[i]);
}
tarNode.find('td').last().append('<div id="tooling" class="editable-buttons"/>');
$('.clear').on('click', function(){ $(this).parent().find('input').val('');});
$(submit).on('click', replaceData).appendTo('#tooling');
$(cancel).on('click', recoveryData).appendTo('#tooling');
}
}
function updateToServerSide(item, data){
var itemid = $(item).find('a').attr('href').match(/\d+/g)[0];
var datas = {'treeId': itemid, 'oldTreeSerialNo': data[0], 'adminDivision': data[2], 'adminUnit': data[3], 'treeAddr': data[1]}; //傳送至伺服器端的Data產生處需手動修改對應表格
store( 'data/update', datas)
}
var BootstrapTable = $.fn.bootstrapTable.Constructor,
_initTable = BootstrapTable.prototype.initTable,
_initBody = BootstrapTable.prototype.initBody;
BootstrapTable.prototype.initTable = function(){
var that = this;
this.$data = {};
_initTable.apply(this, Array.prototype.slice.apply(arguments));
if (!this.options.clickEdit) {
return;
}
};
BootstrapTable.prototype.initBody = function () {
var that = this;
_initBody.apply(this, Array.prototype.slice.apply(arguments));
if (!this.options.clickEdit) {
return;
}
var table = this.$tableBody.find('table');
that.editing=true;
table.on('click-row.bs.table', function (e, row, $element, field) {
if(field ==='no') return; //|| field ==='noOld'
this.$data.thId = $element.data().index;
this.$data.itemid = $element.data().uniqueid;
this.$data.divi = parseInt(row.area);
this.$data.town=parseInt(row.town);
clikcToEdit(this, $element);
}.bind(this));
};
})(jQuery);