Beispiele für JQuery-Operationen zum Hinzufügen, Speichern und Löschen von Daten in einer table_jquery

Bei Seiten wie dieser verarbeiten wir diese Daten oft nicht durch das Absenden von Formularen, da es sehr umständlich ist, diese großen Datenmengen im Hintergrund zu verarbeiten Speichern Sie auf der Vordergrundseite die Daten in JSON in Form von Objekten und konvertieren Sie JSON dann im Hintergrund direkt in die von uns benötigten Objekte, damit wir die Objekte direkt verarbeiten können!

Schaltfläche hinzufügen

Code kopierenDer Code lautet wie folgt:

< ;input name ="button" type="button" value="Add" onClick="addRowForPswdBasicFillTemplate('pswd_basic_fill_template')">

Tabellen-ID ist pswd_basic_fill_template
Methode hinzufügen

Code kopieren Der Code lautet wie folgt:

function addRowForPswdBasicFillTemplate(tid){
var applyAreaOptionStr = $('#applyAreaOptionStr' ).val(); //Hier sind einige Initialisierungen für das Auswahlfeld
did = tid;
var tr = $(""). attr("bgcolor", "#FFFFFF");
tr.append($("").html(""));
tr.append($("").html(""));
tr. append($("< ;td>").html("")); append($("< ;td>").html(""));
tr.append($("").html("< ;select name='apply_Area ' id='apply_Area'>" applyAreaOptionStr ""));
tr.append($("").html( "" $("#indexSpeciesHtml").val() "")); td>"));
tr.append($ ("").html("" ));
tr.append($("").html("") );
tr.append($("").html("
" $("#assessOrgHtml").val() ""));
tr.appendTo ($("#" tid));
setRowNumber_1(tid); //Speichern Sie die Nummer, die für die Auf- und Abwärtsbewegungen verwendet wird
}


Speichern-Button

Code kopieren Der Code lautet wie folgt:

Speichermethode

Code kopierenCode wie folgt:

function savePswdBasicFillTemplate(tid){
did = tid;
var result = getPswdBasicFillTemplate(); //Gekapselte Datenoperation, bitte sorgfältig lesen
if(result){
/ *
if(pswd_basic_fill_template<1){
showInfo("Bitte Basisdatenstandard hinzufügen");
return;
*/
for(var i=0 ;ipswd_basic_fill_template[i]=JSON.stringify(pswd_basic_fill_template[i]);
}
$.post("",{"tempLateList":"[" pswd_basic_fill_template "]"},
function(data) {
if("false"==data){
showInfo("Please Speichern Sie zuerst die grundlegenden Informationen! ");
}else{
//delAllTr("pswd_basic_fill_template"); //Zeile löschen
showInfo("Speichern erfolgreich!")
if(did!="fjsjbz"){
changeTaskType(tid);
}
}
});
}
}
//基础填报模版
var pswd_basic_fill_template = {};//要删除的tableId
var did = "pswd_basic_fill_template";
//获取模板值>function getPsw dBasicFillTemplate(){
pswd_basic_fill_template=[];
var trs=eval("$("#" did " tbody tr")"
var result=true;
$.each(trs,function(i,tr ){
var order = $(tr).find("td:nth-child(2)").text();
var indexCode = $(tr).find("input[name=' index_code']").val();
var indexName = $(tr).find("input[name='index_name']").val();
var indexType = $(tr). find("select[name='index_type']").find("option:selected").text();
var indexSpecies = $(tr).find("select[name='index_species']" ).find("option:selected").text();
var Formula = $(tr).find("textarea[name='formula']").val();
var cap = $(tr).find("input[name='cap']").val();
var baseValue = $(tr).find("input[name='base_value']").val( );
var beurteilenOrg = $(tr).find("select[name='assessOrg']").val();
var beurteilenOrgName = $(tr).find("select[name=' beurteilenOrg']").find("option:selected").text();
var idObj = $(tr).find("input[name='idObj']").val();
var indexValue = $(tr).find("input[name='index_value']").val();
var templateType = "2";
if(did=="zdppbzlb"){
templateType = "3";
}else if(did=="fjsjbz"){
templateType = "4";
assessOrg = $(tr).find("select[name='countyOrg']").val();
}
var taskType = $("#task_type").val();
if(indexCode.length<1){
showInfo("指标名称不能为空");
result = false;
false zurückgeben;
}
if(indexName.length<1){
showInfo("指标代号不能为空");
result = false;
false zurückgeben;
}
var postIndexId = $('#postIndex').val();
var postIndexName = $('#postIndex').find("option:selected").text();
var applyAreaId = $(tr).find("select[name='apply_Area']").val();
var applyAreaName = $(tr).find("select[name='apply_Area']").find("option:selected").text();
var pswd_basic_fill_templateBean={
"postIndexId":postIndexId,"postIndexName":postIndexName,"applyAreaId":applyAreaId,"applyAreaName":applyAreaName,
"indexCode":indexCode,"templateType":templateType," indexValue":indexValue,
"indexName":indexName,"taskType":taskType,"order":order,"id":idObj,"baseValue":baseValue,
"indexSpecies":indexSpecies,"formula" :formula,"cap":cap,"orgName":assessOrgName,"orgid":assessOrg
}
pswd_basic_fill_template.push(pswd_basic_fill_templateBean);
})
Rückgabeergebnis;
}
前台的操作就完成了,下面看一看后台的操作
struts配置文件

@list
secassessment/basicFillTemplate/basicFillTemplateNew

后台操作
public void save() {
String obj = request().getParameter("tempLateList");
List result = JSonUtil.paserJsonArray(SecBasicFillTemplate.class,obj);
//将json转化为对象
}
下面看看删除操作
删除按钮
//删除一行的数据
function delRowForSpacialById(tid){
var selObj=getSelRowJnSpacial(tid);
if(selObj){
var result = bestätigen("确定将记录删除？");
if(result){
var id = selObj.parent().parent();
var idValue = id.find("input[name='idObj']").val ();
if(idValue!=null && idValue.length>0){
$.post("",{"ids" :idValue},function(){
selObj.parent().parent().remove();
})
}else{
selObj.parent().parent().remove ();
}
}
}
}
// Holen Sie sich die ausgewählte Zeile
function getSelRowJnSpacial(tid){
var selObj=eval("$("# " tid " input[@type=radio][checked]")");
if(selObj.html()!=null){
return selObj>}else{
showInfo( „Bitte wählen Sie die Zeile aus, die ausgeführt werden soll“);
return null;
}
Struts-Konfigurationsdatei
@list
Hintergrundmethode
public void delete(String ids) {
//Methode
}
Funktion „Nach oben und unten bewegen“
Schaltfläche


//Zeile nach oben verschieben
function moveBefore(tid){
did =tid;
var selObj= $("input:radio[checked]");
if(selObj==null){
showInof("Please select Moved row");
}else{
var rowIndex = selObj.parent().parent()[0].rowIndex;
if(parseInt(rowIndex)<=2){
showInfo("Es ist oben angekommen und kann nicht nach oben verschoben werden");
return;
var preObj=selObj.parent().prev(); selRow= selObj.parent().clone();
preObj.before(selRow);
selObj.parent().parent().remove();
setRowNumber_1_1(did) ;
}
}
function setRowNumber_1_1(tid){
var fNew = 1;
var expression="$("#" tid " tbody tr"); tbody= eval(expression);
$.each(tbody,function(i,tr){
if(i>=0){
var number=i 1;
$(tr) .find ("td:nth-child(2)").text(number);
}
})
}
//In der Zeile nach unten bewegen
function moveAfter(tid) {
did =tid;
var selObj= $("input:radio[checked]");
if(selObj==null){
showInof("Bitte wählen Sie die zu verschiebende Zeile aus" );
}else{
var r1 = selObj.parent()[0].rowIndex;
var a1 = eval("$("#" did " tbody tr")" ).size( );
if(parseInt(selObj.parent().parent()[0].rowIndex)-1 >= a1){
showInfo("Wir haben die letzte Zeile erreicht und können nicht weiter nach unten bewegen") ;
return;
}
var nextObj=selObj.parent().parent().next();
var selRow=selObj.parent().parent( ).clone();
nextObj.after(selRow);
selObj.parent().parent().remove();
setRowNumber_1(tid); 🎜>//Set rowNumber Die Sequenznummer
function setRowNumber_1(tid){
var fNew = 1;
var expression="$("#" tid " tbody tr""; tbody=eval(expression);
$.each(tbody,function(i,tr){
if(i>=0){
var idObj = $(tr).find("input[ name='idObj']" ).val();
var f = $(tr).find("td:nth-child(4)").find("input[name='index_code']" ).val();
if(f!=null){
var f1 = f.substring(1);
if(f1>=0){
fNew = parseInt(f1) 1;
}
}
var number=i
$(tr).find("td:nth-child(2)").text(number); (idObj==null && f ==null){
var fValue = "";
if(tid=="zdppbzlb"){
fValue = "" ;
}
$(tr).find("td:nth-child(4)").html(fValue);
$(tr).find(" td:nth-child(5) )").html($("#selectHtml").val());
//var beurteilenOrgHtml = "< /input>" $("#assessOrgHtml").val();
//$(tr).find("td:last-child").html(assessOrgHtml);
}
}
})
}