`
huanglz19871030
  • 浏览: 248893 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

填删查改js处理例子

阅读更多

<div id="dialog2" title="维护收藏夹" class="hidden">
     <!--nr bec-->
     <div class="resume_mask">
          
          <ul class="c" id="select_mingyi">
                <c:choose>
                     <c:when test="${fa eq 0}">
                           <li>还没有定义收藏夹类型</li>
                    </c:when>
                   <c:otherwise>
                       <div class="app_dialog_list">
                             <h3 class="p_tb_8">收藏夹类型列表</h3>
                       </div>
                       <div class="app_line_b" style="margin:0"></div>


                       <c:forEach items="${faList}" var="fa">
                            <li>

                                 <input type="checkbox" value="${fa.id}" name="chkFa" id="chkFa">

                                 <input type="hidden" name="faId" id="faId" value="${fa.id}"/>

                                 <input type="hidden" name="faType" id="faType" value="${fa.type}"/>

                                 <span id="faDesc_${fa.type}">${fa.faDesc}     </span></li>           
                      </c:forEach>
                </c:otherwise>
          </c:choose>
     
     <li id="addLi" style="display:none">

     请输入类型描述:<input type="hidden" value="" name="newFaType" id="newFaType">

     <input type="text" value="" name="newFaDesc" id="newFaDesc" maxlength="20">

      <button class="app_btn_b" id="saveButn" onclick="saveFaType();return false;">保存</button>

     </li>
  </ul>
      <div class="tac p_t_8 buttonbox">
           <button class="app_btn_b" onclick="addFaType();return false;">增加</button>

           <button  class="app_btn_b" onclick="modifyfaType();return false;">修改</button>

           <button class="app_btn_b" onclick="delFaType();return false;">删除</button>
     </div>
     </div>
   <!--nr end-->
</div>

 

// 增加

function saveFaType()
{
    var newFaType = a_encode($.trim(document.getElementById("newFaType").value));
    var newFaDesc = document.getElementById("newFaDesc").value;
   // var newFaDesc = a_encode($.trim(document.getElementById("newFaDesc").value));
    if (newFaDesc.length == 0)
    {
        jAlert("请填写收藏夹类型描述!","温馨提示");
        return false;
    }
    if (newFaDesc.length > 20)
    {
        jAlert ("收藏夹类型描述不能超过20个字符","温馨提示");
        return false;
    }
      var para = {faType:newFaType,faDesc:newFaDesc};
      var linkUrl = '<%=request.getContextPath()%>/resume.do?operation=36';
         $.post(linkUrl,para,function(data)
         {
          jAlert(data,"温馨提示",function(){
              var myForms = document.getElementsByTagName("form");
              myForms[0].submit();
              });
         });
}
 

// 删除
 function delFaType()
 {
     var chkFas = document.getElementsByName("chkFa");
     var delFaflog = "0";
     var faIds = "";
     for (var i = 0;i < chkFas.length;i++)
     {
         if (chkFas[i].checked == true)
         {
             delFaflog = "1";
             faIds = faIds + chkFas[i].value + ";";
         }
     }
     if (delFaflog == "0")
     {
         jAlert("请选择需要删除的类型!","温馨提示");
         return false;
     }
     jConfirm("删除操作不可撤销!您确定要执行吗?","温馨提示",function(flag)
      {
   if(!flag)
   {
    return false;
   }
     var para = {faIds:faIds};
  var linkUrl = '<%=request.getContextPath()%>/resume.do?operation=35';
     $.post(linkUrl,para,function(data)
     {
      jAlert(data,"温馨提示",function(){
          var myForms = document.getElementsByTagName("form");
          myForms[0].submit();
          });
     });
   });
 }

 

全选

function allChk(allck)
{  
  var chks = document.getElementsByName("chk");
  for (var i = 0;i < chks.length;i++)
  {
    if (allck.checked == true)
    {
       chks[i].checked = true;
    }

   else
    {
       chks[i].checked = false;
    }
  }
}

 

function addFaType()
{
    document.getElementById("newFaType").value = "";
    document.getElementById("newFaDesc").value = "";
    document.getElementById("addLi").style.display="";
    document.getElementById("saveButn").innerHTML = "新增保存";
}

 

// 修改

function modifyfaType()
{
        var chkFas = document.getElementsByName("chkFa");
     var count = 0;
     var j = 0;
     for (var i = 0;i < chkFas.length;i++)
     {
         if (chkFas[i].checked)
         {
          j = i;
             count++;
         }
     }
     if (count == 0)
     {
         jAlert("请选择需要修改的类型!","温馨提示");
         return false;
     }
     if (count > 1)
     {
             jAlert("一次只能修改一个类型!","温馨提示");
             return false;
  }
  if (count == 1)
  { 
         document.getElementById("newFaType").value = chkFas[j].parentNode.childNodes[2].value;
         document.getElementById("newFaDesc").value = document.getElementById("faDesc_" + chkFas[j].parentNode.childNodes[2].value).innerHTML;
         document.getElementById("addLi").style.display="";
         document.getElementById("saveButn").innerHTML = "修改保存";
  }
  
 }

分享到:
评论

相关推荐

    node.js的增删查改例子

    本篇文章将深入探讨在Node.js中实现数据库的增删查改(CRUD)操作,以及如何与其他开发工具如HTML和Eclipse协同工作。 首先,我们来理解“增”操作。在Node.js中,我们通常会借助ORM(对象关系映射)库,如...

    简易的JavaWeb实现增删查改(附数据库)

    在这个例子中,MySQL用于存储待增删查改的信息,可能包含如用户信息、订单数据等。 3. **数据库连接与操作**: - **JDBC(Java Database Connectivity)**:Java中用于连接和操作数据库的API。项目中会使用JDBC...

    UNI-APP 中sqlite demo 增删查改

    例如,通过输入框填写数据,选择操作按钮,然后由后台的 `sqlite.js` 处理这些请求,完成数据库的增删查改。通过这样的方式,开发者可以更好地理解如何在 `UNI-APP` 中利用 SQLite 实现本地数据管理,这对于构建功能...

    ssh实现增删查改的例子

    综上所述,这个SSH实现增删查改的例子展示了Java Web开发中的一种常见实践,通过整合Struts2、Spring和Hibernate,可以高效地处理数据库操作,并提供友好的用户界面。对于初学者来说,理解并动手实践这样的项目,有...

    ext增删查改demo

    EXTJS是一种基于JavaScript的富客户端应用开发框架,主要用于构建...通过这个"ext增删查改demo",开发者可以学习到EXTJS如何实现CRUD操作,以及如何处理和展示JSON数据,这对于构建交互式的企业级Web应用非常有帮助。

    前端表格增删查改例子bootstrap+layer+jquery

    "前端表格增删查改例子bootstrap+layer+jquery"是一个实用的示例项目,它结合了流行的前端技术和组件,以实现表格数据的动态操作。下面将详细介绍这个项目所涉及的知识点。 首先,Bootstrap是Twitter推出的一个开源...

    js表格操作,DOM实现数据动态增删查改

    在本主题"js表格操作,DOM实现数据动态增删查改"中,我们将深入探讨如何使用原生JavaScript通过DOM操作来实现数据在表格中的动态管理。 1. **创建表格**:首先,我们需要在HTML中创建一个基础的表格结构。这通常...

    基于JSP+JavaBean+Servlet+Ajax+Mysql的验证码 增删查改完整例子

    在这个案例中,Mysql被用作后台数据库,存储验证码信息,同时处理由Servlet发起的增删查改操作。 具体实现过程中,可能包括以下几个步骤: 1. 用户在JSP页面上输入验证码。 2. 利用Ajax发送一个异步请求到服务器,...

    vue案例&数据筛选 增删查改等

    vue案例&数据筛选 增删查改等

    jquery easyui 增删查改分页例子

    在描述中提到的`增删查改`是数据库操作的基础功能。在DataGrid中,我们可以利用内置的编辑功能实现这些操作。例如,用户可以直接在表格中编辑单元格数据,然后通过调用API将更改同步到服务器。对于`添加`操作,可以...

    struts2框架写的增删查改完整例子

    在“struts2框架写的增删查改完整例子”中,开发者展示了如何利用Struts2实现基本的数据操作,包括添加(Add)、删除(Delete)、查询(Query)和更新(Update)。这些是任何CRUD(Create, Read, Update, Delete)...

    JSP购物车增删查改

    综上所述,"JSP购物车增删查改"项目涉及了JSP的基础知识、购物车模型设计、HTTP请求处理、session管理、数据库操作以及安全和性能优化等多个方面,是学习和实践Web开发技能的好案例。通过这个项目,开发者可以深入...

    Ext实现添删查改一

    标题“Ext实现添删查改一”涉及到的是使用Ext JS框架进行Web应用开发中的基本操作——添加、删除、查询和修改数据。Ext JS是一个强大的JavaScript库,主要用于构建富客户端的桌面级Web应用,它提供了丰富的组件和...

    s2sh+ajax 实现页面增删查改!

    **"显然是一个基于这些技术的实践案例,用于演示如何在网页上实现数据的动态增删查改功能。 首先,Struts2作为MVC(Model-View-Controller)框架,负责处理HTTP请求,将用户交互与业务逻辑解耦,提供动作控制和视图...

    php新手入门(php增删查改搜索)

    "增删查改"是数据库操作的核心,它们对应于SQL语句中的基本操作: 1. **增加(Add)**:使用`INSERT INTO`语句向数据库表中添加新的记录。例如: ```php $servername = "localhost"; $username = "username"; $...

    jsf+javabean+jdbc完成对表增删查改

    总之,"jsf+javabean+jdbc完成对表增删查改"是一个典型的Web应用开发案例,它展示了如何利用JSF作为前端框架,结合JavaBean作为模型,以及JDBC作为数据访问手段,实现对数据库的CRUD操作。这样的架构对于构建企业级...

    WebApi+2级联动,实现增删查改(性别爱好)!

    本项目以"WebApi+2级联动,实现增删查改(性别爱好)"为主题,探讨了如何利用Web API技术来处理复杂的业务逻辑,特别是涉及到多级关联的数据操作。 首先,2级联动指的是在用户界面中,两个或多个下拉框或选择器之间...

    java 项目ssh框架搭建的增删查改,带数据库文件

    这个项目以SSH框架为基础,构建了一个包含增删查改(CRUD)功能的Web应用,并提供了数据库文件。以下是关于SSH框架和相关知识点的详细解释: 1. **Struts**:Struts是MVC(Model-View-Controller)设计模式的一个...

    最简单MVC的增删查改

    ### 最简单MVC的增删查改 #### 一、简介 本文档旨在为初学者提供一份关于MVC模式下的基本操作指南——增删查改(CRUD)。这些操作是软件开发中最常见的需求之一,尤其是在Web应用开发领域。通过本指南,我们将探讨...

    express+ajax+MongoDB做的一个增删查改小demo

    在项目中,你将学习如何使用MongoDB的驱动程序(如Mongoose)连接到数据库,定义模型,执行增删查改操作,以及如何在数据库操作完成后向客户端返回结果。 具体操作步骤如下: 1. **创建**:用户通过表单提交数据,...

Global site tag (gtag.js) - Google Analytics