bootstrap 弹窗以及删除时带参数

最新推荐文章于 2022-05-08 10:56:29 发布

i秋风伴落叶

最新推荐文章于 2022-05-08 10:56:29 发布

阅读量1.1k

点赞数 1

分类专栏：日常bug web 图片特效特效 HTML5

本文链接：https://blog.csdn.net/zxf1242652895/article/details/58607375

版权

web 同时被 3 个专栏收录

28 篇文章 0 订阅

订阅专栏

日常bug

16 篇文章 0 订阅

订阅专栏

HTML5

14 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!-- Meta, title, CSS, favicons, etc. -->
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">


    <title>FD-MES系统  </title>
   </head>


  <body class="nav-md">
     
             <div class="clearfix"></div>
             <div class="row">
              <div class="col-md-12 col-sm-12 col-xs-12">
                <div class="x_panel">
                  <div class="x_title">
                    <h2>色粉信息<a οnclick="return tonerInfoEditor()" ><button type="button" class="btn btn-round btn-info" >添加</button></a></h2>
                    
                    <ul class="nav navbar-right panel_toolbox">
                      <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                      </li>
                      <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                        <ul class="dropdown-menu" role="menu">
                          <li><a href="#">Settings 1</a>
                          </li>
                          <li><a href="#">Settings 2</a>
                          </li>
                        </ul>
                      </li>
                      <li><a class="close-link"><i class="fa fa-close"></i></a>
                      </li>
                    </ul>
                    <div class="clearfix"></div>
                  </div>
                  <div class="x_content">
                     <div class="table-responsive">
                      <table class="table table-striped jambo_table bulk_action" id="datatable">
                       <thead>
                          <tr class="headings">
                             <th class="column-title">色粉编号</th>
                             <th class="column-title">色粉颜色</th>
                             <th class="column-title">色粉单价(元)</th>
                             <th class="column-title">编辑</th>
                             <th class="column-title">删除</th>
                          </tr>
                       </thead>
                       <tbody id="table2">
                       
                       </tbody>
                    
                     </table>
                   
                     <script type="text/javascript">
                          var data_all;
                            $(document).ready(function(){
                          var code;
                          $.ajax({
                         type: 'POST',
                               url:'/fudaMes/pigmentInfo/listAllPigmentInfo',
                               async:false,
                               success:function(data){
                              data_all=data;
                              for(var i in data){
                               var id=data[i].id;
                               code=code +' <tr class="even pointer" id="tr' +i+ '">'
                              +'<td class=" ">'+data[i].pigmentCode+'</td>'
                              +'<td class=" ">'+data[i].pigmentColor+'</td>'
                              +'<td class=" ">'+data[i].pigmentPrice+'</td>'
                              
                             +'<td class=" "><a οnclick="tonerInfoModifyInfo(\''+i+'\',\''+id+'\')"><b class="fa fa fa-pencil-square-o">'+'</b></a></td>'
                              
                             +' <td class=" "><a href="#"><b class="fa fa fa-trash" data-toggle="modal" data-target=".bs-example-modal-sm" οnclick="delInfo(\''+id+'\',\''+i+'\')"></b></a></td>'
                               +'</tr>'
                             
                              }
                              
                              $('#table2').empty().append(code);
                               }
                          });
                           });
                        
                        </script>   
                        </div>
                            <div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-hidden="true">
                   <div class="modal-dialog modal-sm">
                     <div class="modal-content">
                        <div class="modal-header">
                         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span>
                         </button>
                         <h4 class="modal-title" id="myModalLabel2">信息提示</h4>
                       </div>
                       <div class="modal-body">
                         <h5>你确定要删除吗？</h5>
                        </div>
                       <div class="modal-footer">
                         <button type="button" class="btn btn-default" data-dismiss="modal" id="cancelId">取消</button>
                         <button type="button" class="btn btn-primary" data-dismiss="modal" οnclick="delteInfo()">确定</button>
                       </div>
                      </div>
                   </div>
                 </div>  
                   </div>
                </div>
              </div>
         </div>
    
    <script type="text/javascript">
    $(document).ready(function() {
  $('#datatable').dataTable();

  $('#datatable-keytable').DataTable({
    keys: true
  });

  $('#datatable-responsive').DataTable();

  $('#datatable-scroller').DataTable({
    ajax: "js/datatables/json/scroller-demo.json",
    deferRender: true,
    scrollY: 380,
    scrollCollapse: true,
    scroller: true
  });

  $('#datatable-fixed-header').DataTable({
    fixedHeader: true
  });

});     
   </script>


     
   <script type="text/javascript">
   var toner_id;
   var toner_index;
   
   function delInfo(id,index){
    toner_id = id;
  toner_index = index;
    }
   
    function delteInfo(){
     
      $.ajax({
     type:"post",
     url:'/fudaMes/pigmentInfo/deletePigmentInfo?id='+toner_id,
     success:function(data){
     if(data =="success"){
     new PNotify({
                          title: '删除成功',
                          text: '色粉信息已删除',
                          type: 'success',
                          styling: 'bootstrap3'
                      });   
     $("#tr"+toner_index).remove();
     
     }else{
     new PNotify({
                          title: '删除失败',
                          text: '色粉信息删除失败',
                          type: 'error',
                          styling: 'bootstrap3'
                      });   
     }
     }
     
     });  
      }
    
    /* 
     function modifyInfo(id){
     
    sessionStorage.setItem("data",JSON.stringify(data_all[id]));
        
         
         window.location.href="tonerInfoEditor.jsp?modify=1";
     
      } */
    </script>
  </body>
</html>