zoukankan      html  css  js  c++  java
  • ajax 提交复选框

    HTML代码如下

    
    

    <button type="button" id="update_btn" onclick="updateChecked()">更新已选</button>
    <button type="button" id="update_btn_all" onclick="updateAll()">全部更新</button>


    <
    table id="basicTable" class="table"> <thead class=""> <tr> <th>全选 <input type="checkbox" name="checkedAll" id="checkedAll" onclick="swapCheck()"/> </th> <th>ID</th> <th>车系ID</th> <th>车龄</th> <th>操作</th> </tr> </thead> <tbody> <c:forEach items="${result }" var="bean"> <tr> <th> <input type="checkbox" name="beanIds" id="beanIds" value="${bean.id}"}/> </th> <th>${bean.id }</th> <th>${bean.seriesId }</th> <th>${bean.carAge }</th> <th> <button type="button" onclick='openedit(${bean })'>修改</button> </th> </tr> </c:forEach> </tbody> </table>

    js代码如下

    var isCheckAll = false;  
         //全选/全不选 操作
    function swapCheck() { if (isCheckAll) { $("input[name='beanIds']").each(function() { this.checked = false; }); isCheckAll = false; } else { $("input[name='beanIds']").each(function() { this.checked = true; }); isCheckAll = true; } }
    //更新按钮触发方法
    function updateChecked(){ var beanIds = $("input[name='beanIds']:checked").serialize(); if(beanIds==null || beanIds ==''){ alert("请选择需要更新的记录"); return; } updateSeries(beanIds); }

    function updateAll(){
      updateSeriesRvFactor({beanIds:'all'});
    }

    //ajax 提交
    function updateSeries(beanIds){
                $.ajax({
                    url : '${ctx }/ajax/conf/updateSeries',
                    data : beanIds,
                    type : 'post',
                    dataType : 'json',
                    async : true,
                    beforeSend: function () {
                        // 禁用按钮防止重复提交
                        $("#update_btn_all").text("更新中...");
                        $("#update_btn_all").attr({ disabled: "disabled" });
                        $("#update_btn").text("更新中...");
                        $("#update_btn").attr({ disabled: "disabled" });
                    },
                    success : function(data) {
                            alert(data.message);
                    },
                    complete: function () {
                        $("#update_btn_all").text("全部更新");
                        $("#update_btn_all").removeAttr("disabled");
                        $("#update_btn").text("更新已选");
                        $("#update_btn").removeAttr("disabled");
                    }
                });
            }
  • 相关阅读:
    软件开发(目录规范)
    面向对象编程(UDP协议)
    Django+uwsgi+Nginx
    Django(图书管理系统)
    orm(Manager isn't accessible via %s instances" % cls.__name)报错
    Django(图书管理系统)#转
    docker(mysql-redmine)
    Django(orm)转
    Django(多表查询操作)
    Oracle(ERROR SP2-0642)
  • 原文地址:https://www.cnblogs.com/xingtangxiaoga/p/9719426.html
Copyright © 2011-2022 走看看