javascript 頁面中的增加 刪除 保存 功能！

$doc.on('click','.btn-funnel-new,.edit_funnel,.charts_add,.postCharts,.charts_remove,.del_funnel',function(e){
e.stopPropagation();
e.preventDefault();
var _this   = $(this);
var oDialog = $('#chartsModal');
switch(true){
case _this.is('.btn-funnel-new'): //add
oDialog.modal('show');
$('#hid_name').val('1');
break;
case _this.is('.edit_funnel'): //edit
oDialog.modal('show');
$('#hid_name').val('2');
var oTr = _this.parents('tr');
var idx = oTr.attr('id');
$('#hid_bj').val(idx);
var tmpl = $('.charts-tem .charts_templ');
var request={
eid_Idx:idx,
}
var ajax = $.ajax({
type: 'POST',
url: getRoleUserUrls('get'),
data: request,
success:function(response){
if(typeof response === 'string') response = $.parseJSON(response);
if(response.success == 1){
oDialog.find('.textName').val(response.data.tempname);
oDialog.find('.charts_templ').remove();
createResponse(response.data.points);
console.log(response.data.points);
}
}
}); 
function createResponse(data){
if(!data) return;
var tmpls = [];
$.each(data,function(){
var _tmpl = tmpl.clone();
$('.modal-title').text('編輯');
_tmpl.find('input[name=t]').val(this.t);
_tmpl.find('input[name=tmpl_name]').val(this.point_name);
_tmpl.find('input[name=sell]').val(this.name);
_tmpl.find('input[name=shun]').val(this.display_index);
tmpls.push(_tmpl);
});
if(!!tmpls.length){
var oForm = oDialog.find('.form-horizontal');
var dom   = oForm.children().last();
(!!dom.length) ? dom.after(tmpls) : oForm.append(tmpls);
}
}
break;
case _this.is('.charts_add'): //sub_add
var oTmpl   = $($('.charts-tem').html());
var oGroup = _this.parents('.charts_templ');
if(oGroup.length){
oGroup.index() == oGroup.parent().children().length - 1 ? oGroup.after(oTmpl.clone()) : oGroup.after(oTmpl.clone());
}
$('.charts_remove')[0].style.display = 'inline-block';
break;
case _this.is('.postCharts'): //add
var oDialog  = _this.parents('#chartsModal');
var tName    = oDialog.find('input[name=textName]').val();
/* var _t       = $('.t'),val();
var _tmpl_name = $('.tmpl_name').val();
var _sell    = $('.sell').val();
var _shun    = $('.shun').val();
if(_t.length = '' && _tmpl_name.length = '' && _sell.length = '' && _shun.length = ''){
alert("請把內容填寫完整！");
return false;
}  */
var idx = $('#hid_bj').val();
var rule = {};
$('.charts_templ',oDialog).each(function(i,v){
var ary = {};
var _me = $(this);
$.each(_me.find('input'),function(){
ary[this.name] = this.value;
});
rule[i] = ary;
})
var h_input = $('#hid_name').val();
if(h_input == 1){
var request = {
textName:tName,
rule:rule
};
var ajax = $.ajax({
type: 'POST',
url: getRoleUserUrls('add'),
data: request
});
}else if(h_input == 2){
var request = {
textName:tName,
rule:rule,
eid_Idx:idx
}
var ajax = $.ajax({
type: 'POST',
url: getRoleUserUrls('edit'),
data: request
});
}
ajax.done(function(ret){
if(typeof ret === 'string') ret = $.parseJSON(ret);
if(ret.success == 1){
$('#chartsModal').modal('hide');
window.location.reload();
}else{
alert('error:'+ret.info);
}
});
break;
case _this.is(".charts_remove"):
$(this).parent().parent().parent().remove();
var oGroup1 = $('.charts_templ');
if(oGroup1.length == 2){
//console.log($('.charts_remove'));
$('.charts_remove')[0].style.display = 'none';
}
break;
case _this.is('.del_funnel'):
var idx = $(this).parent().parent().index();
var noticeIdx = $('.custom-table').find('tr').eq(idx).attr('id');
var request = {
ids: noticeIdx
};
var ajax = $.ajax({
type: 'POST',
url: getRoleUserUrls('del'),
data: request
});
ajax.done(function(ret){
if(typeof ret === 'string') ret = $.parseJSON(ret);
if(ret.success == 1){
$('#chartsModal').modal('hide');
window.location.reload();
}else{
alert('error:'+ret.info);
}
});
}
});