当前位置:  编程技术>WEB前端

jquery对table中各数据的增加、保存、删除操作示例

    来源: 互联网  发布时间:2014-08-25

    本文导语:   像这种页面,我们往往不是通过提交表单来处理这些数据,因为如果在后台去遍历处理这些大量的数据是非常繁琐的;比较好的做法是在前台页面中将数据以对象形式保存在json中,然后在后台直接将json转换成我们需要的对象...

 
像这种页面,我们往往不是通过提交表单来处理这些数据,因为如果在后台去遍历处理这些大量的数据是非常繁琐的;比较好的做法是在前台页面中将数据以对象形式保存在json中,然后在后台直接将json转换成我们需要的对象,这样我们的直接可以处理对象了!

添加按钮

代码如下:



table id是pswd_basic_fill_template
添加方法
代码如下:

function addRowForPswdBasicFillTemplate(tid){
var applyAreaOptionStr = $('#applyAreaOptionStr').val(); //这里是对select框的一些初始化
did = tid;
var tr = $("").attr("bgcolor","#FFFFFF");
tr.append($("").html(""));
tr.append($("").html(""));
tr.append($("").html(""));
tr.append($("").html(""));
tr.append($("").html(""+applyAreaOptionStr+""));
tr.append($("").html(""+$("#indexSpeciesHtml").val()+""));
tr.append($("").html(""));
tr.append($("").html(""));
tr.append($("").html(""));
tr.append($("").html("
"+$("#assessOrgHtml").val()+""));
tr.appendTo($("#"+tid));
setRowNumber_1(tid); //保存编号,上移下移操作会用到 ,先不关注
}

保存按钮
代码如下:



保存方法
代码如下:

function savePswdBasicFillTemplate(tid){
did = tid;
var result = getPswdBasicFillTemplate(); //封装数据操作,请仔细看
if(result){
/*
if(pswd_basic_fill_template.length= a1){
showInfo("已经到最后一行,不能再下移了");
return;
}
var nextObj=selObj.parent().parent().next();
var selRow=selObj.parent().parent().clone();
nextObj.after(selRow);
selObj.parent().parent().remove();
setRowNumber_1_1(tid);
}
}
//设置rowNumber的序号
function setRowNumber_1(tid){
var fNew = 1;
var expression="$("#"+tid+" tbody tr")";
var 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+1;
$(tr).find("td:nth-child(2)").text(number);
if(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 assessOrgHtml = ""+$("#assessOrgHtml").val();
//$(tr).find("td:last-child").html(assessOrgHtml);
}
}
})
}

    
 
 

您可能感兴趣的文章:

  • jQuery定时器插件 jQuery Timers应用示例
  • jquery打开dialog的简单示例
  • jQuery animate方法定位页面具体位置(示例)
  • jQuery设置input type值示例
  • jquery弹窗代码示例
  • jquery的父子兄弟节点查找示例代码
  • jquery获取第几个元素方法示例 jquery选择器
  • jquery遍历checkbox简单示例
  • jquery动态添加option示例
  • Jquery定时器的简单示例
  • JQuery获取上传文件大小(示例)
  • Jquery在指定DIV加载HTML示例代码
  • jQuery获得内容和属性示例代码
  • jQuery的each终止或跳过示例代码
  • jQuery获得内容和属性方法及示例
  • jquery根据name属性查找示例
  • jQuery find与children方法示例
  • jQuery回车键绑定点击事件示例
  • jQuery 滚动示例插件 kinetic
  • jQuery设置CSS属性(示例)
  • jQuery 表单自动保存插件 Autosave
  • jQuery的cookie插件实现保存用户登陆信息
  • jQuery切换网页皮肤并保存到Cookie示例代码
  • jquery页面拖拽并保存到cookie实例分享
  • jquery实现checkbox的全选、取消及跨页保存
  • jquery实现保存已选用户
  • jquery实现点击文字可编辑并修改保存至数据库
  •  
    本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术,将尽最大努力为读者提供更好的信息聚合和浏览方式。
    本站(WWW.)站内文章除注明原创外,均为转载、整理或搜集自网络。欢迎任何形式的转载,转载请注明出处。












  • 相关文章推荐
  • jquery动态添加option示例 iis7站长之家
  • jquery删除提示框弹出是否删除对话框
  • jQuery操作select option选项(增加 删除 修改)
  • Jquery删除元素的代码举例
  • jQuery 获取/设置/删除DOM元素的属性以a元素为例
  • JQuery动态删除Table表格的行与列
  • jquery 删除字符串最后一个字符的方法解析
  • JQuery 删除节点的例子
  • jquery 删除select中option选项
  • jquery删除指定的html标签并保留标签内文本内容的方法
  • jquery代码-如何显示或删除input域中的默认值
  • jquery css类用法(添加、修改与删除css)
  • jQuery动态添加、删除元素的方法
  • jquery删除节点代码
  • jquery实现Select option项的添加、删除、取值
  • jquery判断小数点两位和自动删除小数两位后的数字
  • jquery动态添加删除一行数据实例
  • jQuery删除节点的三个方法即remove()detach()和empty()
  • jQuery 删除/替换DOM元素的几种方式
  • 如何从jQuery的ajax请求中删除X-Requested-With
  • 通过javascript库JQuery实现页面跳转功能代码
  • jQuery鼠标动画插件 jquery-ahover
  • jQuery概述,代码举例及最新版下载
  • jQuery向导插件 Jquery Wizard Plugin
  • Jquery操作html复选框checkbox:全选,全不选和反选
  • jQuery圆角插件 jQuery Corners
  • struts+spring+hibernate+jquery实现分页功能的几个基本类介绍(异步加载)
  • jQuery相册插件 jQuery.popeye
  • jQuery UI组件 jQuery UI
  • jQuery右键菜单插件 jQuery ContextMenu
  • jQuery分页插件 Pagination jQuery Plugin


  • 站内导航:


    特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

    ©2012-2021,,E-mail:www_#163.com(请将#改为@)

    浙ICP备11055608号-3