javascript - 如何将数据从选中的数据表发送到另一个页面复选框-6ren

javascript - 如何将数据从选中的数据表发送到另一个页面复选框

转载作者：行者123 更新时间：2023-11-30 20:46:34

这是我从网站复制的运行代码，但我想将选定的数据发送到另一个页面，而不仅仅是 ID。

<script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
    <script>

//更新数据表中的“全选”控件

function updateDataTableSelectAllCtrl(table){
   var $table             = table.table().node();
   var $chkbox_all        = $('tbody input[type="checkbox"]', $table);
   var $chkbox_checked    = $('tbody input[type="checkbox"]:checked', $table);
   var chkbox_select_all  = $('thead input[name="select_all"]', $table).get(0);

    If none of the checkboxes are checked
   if($chkbox_checked.length === 0){
      chkbox_select_all.checked = false;
      if('indeterminate' in chkbox_select_all){
         chkbox_select_all.indeterminate = false;
      }

    If all of the checkboxes are checked
   } else if ($chkbox_checked.length === $chkbox_all.length){
      chkbox_select_all.checked = true;
      if('indeterminate' in chkbox_select_all){
         chkbox_select_all.indeterminate = false;
      }

    If some of the checkboxes are checked
   } else {
      chkbox_select_all.checked = true;
      if('indeterminate' in chkbox_select_all){
         chkbox_select_all.indeterminate = true;
      }
   }
}

$(document).ready(function (){
    Array holding selected row IDs
   var rows_selected = [];
   var table = $('#example').DataTable({
      'columnDefs': [{
         'targets': 0,
         'searchable':false,
         'orderable':false,
         'className': 'dt-body-center',
         'render': function (data, type, full, meta){
             return '<input type="checkbox">';
         }
      }],
      'order': [1, 'asc'],
      'rowCallback': function(row, data, dataIndex){
          Get row ID
         var rowId = data[0];

          If row ID is in the list of selected row IDs
         if($.inArray(rowId, rows_selected) !== -1){
            $(row).find('input[type="checkbox"]').prop('checked', true);
            $(row).addClass('selected');
         }
      }
   });

//处理复选框的点击

 $('#example tbody').on('click', 'input[type="checkbox"]', function(e){
      var $row = $(this).closest('tr');

      Get row data
      var data = table.row($row).data();

       Get row ID
      var rowId = data[0];

//判断行ID是否在选中的行ID列表中

      var index = $.inArray(rowId, rows_selected);

//如果复选框被选中并且行 ID 不在所选行 ID 的列表中

     if(this.checked && index === -1){
         rows_selected.push(rowId);

       Otherwise, if checkbox is not checked and row ID is in list of selected row IDs
      } else if (!this.checked && index !== -1){
         rows_selected.splice(index, 1);
      }

      if(this.checked){
         $row.addClass('selected');
      } else {
         $row.removeClass('selected');
      }

       Update state of "Select all" control
      updateDataTableSelectAllCtrl(table);

       Prevent click event from propagating to parent
      e.stopPropagation();
   });

   Handle click on table cells with checkboxes
   $('#example').on('click', 'tbody td, thead th:first-child', function(e){
      $(this).parent().find('input[type="checkbox"]').trigger('click');
   });

    Handle click on "Select all" control
   $('thead input[name="select_all"]', table.table().container()).on('click', function(e){
      if(this.checked){
         $('tbody input[type="checkbox"]:not(:checked)', table.table().container()).trigger('click');
      } else {
         $('tbody input[type="checkbox"]:checked', table.table().container()).trigger('click');
      }

      // Prevent click event from propagating to parent
      e.stopPropagation();
   });

   // Handle table draw event
   table.on('draw', function(){
      // Update state of "Select all" control
      updateDataTableSelectAllCtrl(table);
   });

   // Handle form submission event 
   $('#frm-example').on('submit', function(e){
      var form = this;

      // Iterate over all selected checkboxes
      $.each(rows_selected, function(index, rowId){
         // Create a hidden element 
         $(form).append(
             $('<input>')

                .attr('name', 'id[]')

                .val(rowId)
         );
      });

      // FOR DEMONSTRATION ONLY     

      // Output form data to a console     
      $('#example-console').text($(form).serialize());
      console.log("Form submission", $(form).serialize());

      // Remove added elements
      $('input[name="id\[\]"]', form).remove();

      // Prevent actual form submission
      e.preventDefault();
   });
});


    </script>
<body>

<form id="frm-example" action="/nosuchpage" method="POST">

<table id="example" class="display select" cellspacing="0" width="100%">
   <thead>
      <tr>
         <th><input name="select_all" value="1" type="checkbox"></th>
         <th>Name</th>
         <th>Position</th>
         <th>Office</th>
         <th>Extn.</th>
         <th>Start date</th>
         <th>Salary</th>
      </tr>
   </thead>
   <tfoot>
      <tr>
         <th></th>
         <th>Name</th>
         <th>Position</th>
         <th>Office</th>
         <th>Extn.</th>
         <th>Start date</th>
         <th>Salary</th>
      </tr>
   </tfoot>
   <tbody>
       <tr>
           <td>1</td>
           <td>Tiger Nixon</td>
           <td>System Architect</td>
           <td>Edinburgh</td>
           <td>61</td>
           <td>2011/04/25</td>
           <td>$320,800</td>
       </tr>
       <tr>
           <td>2</td>
           <td>Garrett Winters</td>
           <td>Accountant</td>
           <td>Tokyo</td>
           <td>63</td>
           <td>2011/07/25</td>
           <td>$170,750</td>
       </tr>
       <tr>
           <td>3</td>
           <td>Ashton Cox</td>
           <td>Junior Technical Author</td>
           <td>San Francisco</td>
           <td>66</td>
           <td>2009/01/12</td>
           <td>$86,000</td>
       </tr>
       <tr>
           <td>4</td>
           <td>Cedric Kelly</td>
           <td>Senior Javascript Developer</td>
           <td>Edinburgh</td>
           <td>22</td>
           <td>2012/03/29</td>
           <td>$433,060</td>
       </tr>
       <tr>
           <td>5</td>
           <td>Airi Satou</td>
           <td>Accountant</td>
           <td>Tokyo</td>
           <td>33</td>
           <td>2008/11/28</td>
           <td>$162,700</td>
       </tr>
       <tr>
           <td>6</td>
           <td>Brielle Williamson</td>
           <td>Integration Specialist</td>
           <td>New York</td>
           <td>61</td>
           <td>2012/12/02</td>
           <td>$372,000</td>
       </tr>
       <tr>
           <td>7</td>
           <td>Herrod Chandler</td>
           <td>Sales Assistant</td>
           <td>San Francisco</td>
           <td>59</td>
           <td>2012/08/06</td>
           <td>$137,500</td>
       </tr>
       <tr>
           <td>8</td>
           <td>Rhona Davidson</td>
           <td>Integration Specialist</td>
           <td>Tokyo</td>
           <td>55</td>
           <td>2010/10/14</td>
           <td>$327,900</td>
       </tr>
       <tr>
           <td>9</td>
           <td>Colleen Hurst</td>
           <td>Javascript Developer</td>
           <td>San Francisco</td>
           <td>39</td>
           <td>2009/09/15</td>
           <td>$205,500</td>
       </tr>
       <tr>
           <td>10</td>
           <td>Sonya Frost</td>
           <td>Software Engineer</td>
           <td>Edinburgh</td>
           <td>23</td>
           <td>2008/12/13</td>
           <td>$103,600</td>
       </tr>
       <tr>
           <td>11</td>
           <td>Jena Gaines</td>
           <td>Office Manager</td>
           <td>London</td>
           <td>30</td>
           <td>2008/12/19</td>
           <td>$90,560</td>
       </tr>
       <tr>
           <td>12</td>
           <td>Quinn Flynn</td>
           <td>Support Lead</td>
           <td>Edinburgh</td>
           <td>22</td>
           <td>2013/03/03</td>
           <td>$342,000</td>
       </tr>
       <tr>
           <td>13</td>
           <td>Charde Marshall</td>
           <td>Regional Director</td>
           <td>San Francisco</td>
           <td>36</td>
           <td>2008/10/16</td>
           <td>$470,600</td>
       </tr>
       <tr>
           <td>14</td>
           <td>Haley Kennedy</td>
           <td>Senior Marketing Designer</td>
           <td>London</td>
           <td>43</td>
           <td>2012/12/18</td>
           <td>$313,500</td>
       </tr>
       <tr>
           <td>15</td>
           <td>Tatyana Fitzpatrick</td>
           <td>Regional Director</td>
           <td>London</td>
           <td>19</td>
           <td>2010/03/17</td>
           <td>$385,750</td>
       </tr>
       <tr>
           <td>16</td>
           <td>Michael Silva</td>
           <td>Marketing Designer</td>
           <td>London</td>
           <td>66</td>
           <td>2012/11/27</td>
           <td>$198,500</td>
       </tr>
       <tr>
           <td>17</td>
           <td>Paul Byrd</td>
           <td>Chief Financial Officer (CFO)</td>
           <td>New York</td>
           <td>64</td>
           <td>2010/06/09</td>
           <td>$725,000</td>
       </tr>
       <tr>
           <td>18</td>
           <td>Gloria Little</td>
           <td>Systems Administrator</td>
           <td>New York</td>
           <td>59</td>
           <td>2009/04/10</td>
           <td>$237,500</td>
       </tr>
       <tr>
           <td>19</td>
           <td>Bradley Greer</td>
           <td>Software Engineer</td>
           <td>London</td>
           <td>41</td>
           <td>2012/10/13</td>
           <td>$132,000</td>
       </tr>
       <tr>
           <td>20</td>
           <td>Dai Rios</td>
           <td>Personnel Lead</td>
           <td>Edinburgh</td>
           <td>35</td>
           <td>2012/09/26</td>
           <td>$217,500</td>
       </tr>
       <tr>
           <td>21</td>
           <td>Jenette Caldwell</td>
           <td>Development Lead</td>
           <td>New York</td>
           <td>30</td>
           <td>2011/09/03</td>
           <td>$345,000</td>
       </tr>
       <tr>
           <td>22</td>
           <td>Yuri Berry</td>
           <td>Chief Marketing Officer (CMO)</td>
           <td>New York</td>
           <td>40</td>
           <td>2009/06/25</td>
           <td>$675,000</td>
       </tr>
       <tr>
           <td>23</td>
           <td>Caesar Vance</td>
           <td>Pre-Sales Support</td>
           <td>New York</td>
           <td>21</td>
           <td>2011/12/12</td>
           <td>$106,450</td>
       </tr>
       <tr>
           <td>24</td>
           <td>Doris Wilder</td>
           <td>Sales Assistant</td>
           <td>Sidney</td>
           <td>23</td>
           <td>2010/09/20</td>
           <td>$85,600</td>
       </tr>
       <tr>
           <td>25</td>
           <td>Angelica Ramos</td>
           <td>Chief Executive Officer (CEO)</td>
           <td>London</td>
           <td>47</td>
           <td>2009/10/09</td>
           <td>$1,200,000</td>
       </tr>
       <tr>
           <td>26</td>
           <td>Gavin Joyce</td>
           <td>Developer</td>
           <td>Edinburgh</td>
           <td>42</td>
           <td>2010/12/22</td>
           <td>$92,575</td>
       </tr>
       <tr>
           <td>27</td>
           <td>Jennifer Chang</td>
           <td>Regional Director</td>
           <td>Singapore</td>
           <td>28</td>
           <td>2010/11/14</td>
           <td>$357,650</td>
       </tr>
       <tr>
           <td>28</td>
           <td>Brenden Wagner</td>
           <td>Software Engineer</td>
           <td>San Francisco</td>
           <td>28</td>
           <td>2011/06/07</td>
           <td>$206,850</td>
       </tr>
       <tr>
           <td>29</td>
           <td>Fiona Green</td>
           <td>Chief Operating Officer (COO)</td>
           <td>San Francisco</td>
           <td>48</td>
           <td>2010/03/11</td>
           <td>$850,000</td>
       </tr>
       <tr>
           <td>30</td>
           <td>Shou Itou</td>
           <td>Regional Marketing</td>
           <td>Tokyo</td>
           <td>20</td>
           <td>2011/08/14</td>
           <td>$163,000</td>
       </tr>
       <tr>
           <td>31</td>
           <td>Michelle House</td>
           <td>Integration Specialist</td>
           <td>Sidney</td>
           <td>37</td>
           <td>2011/06/02</td>
           <td>$95,400</td>
       </tr>
       <tr>
           <td>32</td>
           <td>Suki Burks</td>
           <td>Developer</td>
           <td>London</td>
           <td>53</td>
           <td>2009/10/22</td>
           <td>$114,500</td>
       </tr>
       <tr>
           <td>33</td>
           <td>Prescott Bartlett</td>
           <td>Technical Author</td>
           <td>London</td>
           <td>27</td>
           <td>2011/05/07</td>
           <td>$145,000</td>
       </tr>
       <tr>
           <td>34</td>
           <td>Gavin Cortez</td>
           <td>Team Leader</td>
           <td>San Francisco</td>
           <td>22</td>
           <td>2008/10/26</td>
           <td>$235,500</td>
       </tr>
       <tr>
           <td>35</td>
           <td>Martena Mccray</td>
           <td>Post-Sales support</td>
           <td>Edinburgh</td>
           <td>46</td>
           <td>2011/03/09</td>
           <td>$324,050</td>
       </tr>
       <tr>
           <td>36</td>
           <td>Unity Butler</td>
           <td>Marketing Designer</td>
           <td>San Francisco</td>
           <td>47</td>
           <td>2009/12/09</td>
           <td>$85,675</td>
       </tr>
       <tr>
           <td>37</td>
           <td>Howard Hatfield</td>
           <td>Office Manager</td>
           <td>San Francisco</td>
           <td>51</td>
           <td>2008/12/16</td>
           <td>$164,500</td>
       </tr>
       <tr>
           <td>38</td>
           <td>Hope Fuentes</td>
           <td>Secretary</td>
           <td>San Francisco</td>
           <td>41</td>
           <td>2010/02/12</td>
           <td>$109,850</td>
       </tr>
       <tr>
           <td>39</td>
           <td>Vivian Harrell</td>
           <td>Financial Controller</td>
           <td>San Francisco</td>
           <td>62</td>
           <td>2009/02/14</td>
           <td>$452,500</td>
       </tr>
       <tr>
           <td>40</td>
           <td>Timothy Mooney</td>
           <td>Office Manager</td>
           <td>London</td>
           <td>37</td>
           <td>2008/12/11</td>
           <td>$136,200</td>
       </tr>
       <tr>
           <td>41</td>
           <td>Jackson Bradshaw</td>
           <td>Director</td>
           <td>New York</td>
           <td>65</td>
           <td>2008/09/26</td>
           <td>$645,750</td>
       </tr>
       <tr>
           <td>42</td>
           <td>Olivia Liang</td>
           <td>Support Engineer</td>
           <td>Singapore</td>
           <td>64</td>
           <td>2011/02/03</td>
           <td>$234,500</td>
       </tr>
       <tr>
           <td>43</td>
           <td>Bruno Nash</td>
           <td>Software Engineer</td>
           <td>London</td>
           <td>38</td>
           <td>2011/05/03</td>
           <td>$163,500</td>
       </tr>
       <tr>
           <td>44</td>
           <td>Sakura Yamamoto</td>
           <td>Support Engineer</td>
           <td>Tokyo</td>
           <td>37</td>
           <td>2009/08/19</td>
           <td>$139,575</td>
       </tr>
       <tr>
           <td>45</td>
           <td>Thor Walton</td>
           <td>Developer</td>
           <td>New York</td>
           <td>61</td>
           <td>2013/08/11</td>
           <td>$98,540</td>
       </tr>
       <tr>
           <td>46</td>
           <td>Finn Camacho</td>
           <td>Support Engineer</td>
           <td>San Francisco</td>
           <td>47</td>
           <td>2009/07/07</td>
           <td>$87,500</td>
       </tr>
       <tr>
           <td>47</td>
           <td>Serge Baldwin</td>
           <td>Data Coordinator</td>
           <td>Singapore</td>
           <td>64</td>
           <td>2012/04/09</td>
           <td>$138,575</td>
       </tr>
       <tr>
           <td>48</td>
           <td>Zenaida Frank</td>
           <td>Software Engineer</td>
           <td>New York</td>
           <td>63</td>
           <td>2010/01/04</td>
           <td>$125,250</td>
       </tr>
       <tr>
           <td>49</td>
           <td>Zorita Serrano</td>
           <td>Software Engineer</td>
           <td>San Francisco</td>
           <td>56</td>
           <td>2012/06/01</td>
           <td>$115,000</td>
       </tr>
       <tr>
           <td>50</td>
           <td>Jennifer Acosta</td>
           <td>Junior Javascript Developer</td>
           <td>Edinburgh</td>
           <td>43</td>
           <td>2013/02/01</td>
           <td>$75,650</td>
       </tr>
       <tr>
           <td>51</td>
           <td>Cara Stevens</td>
           <td>Sales Assistant</td>
           <td>New York</td>
           <td>46</td>
           <td>2011/12/06</td>
           <td>$145,600</td>
       </tr>
       <tr>
           <td>52</td>
           <td>Hermione Butler</td>
           <td>Regional Director</td>
           <td>London</td>
           <td>47</td>
           <td>2011/03/21</td>
           <td>$356,250</td>
       </tr>
       <tr>
           <td>53</td>
           <td>Lael Greer</td>
           <td>Systems Administrator</td>
           <td>London</td>
           <td>21</td>
           <td>2009/02/27</td>
           <td>$103,500</td>
       </tr>
       <tr>
           <td>54</td>
           <td>Jonas Alexander</td>
           <td>Developer</td>
           <td>San Francisco</td>
           <td>30</td>
           <td>2010/07/14</td>
           <td>$86,500</td>
       </tr>
       <tr>
           <td>55</td>
           <td>Shad Decker</td>
           <td>Regional Director</td>
           <td>Edinburgh</td>
           <td>51</td>
           <td>2008/11/13</td>
           <td>$183,000</td>
       </tr>
       <tr>
           <td>56</td>
           <td>Michael Bruce</td>
           <td>Javascript Developer</td>
           <td>Singapore</td>
           <td>29</td>
           <td>2011/06/27</td>
           <td>$183,000</td>
       </tr>
       <tr>
           <td>57</td>
           <td>Donna Snider</td>
           <td>Customer Support</td>
           <td>New York</td>
           <td>27</td>
           <td>2011/01/25</td>
           <td>$112,000</td>
       </tr>
   </tbody>
</table>
<hr>

<p>Press <b>Submit</b> and check console for URL-encoded form data that would be submitted.</p>

<p><button>Submit</button></p>

<b>Data submitted to the server:</b><br>
<pre id="example-console">
</pre>
</form>

最佳答案

Page1.jsp

var selectedData = The value you want to send;

window.location.href = "<%=request.getContextPath()%>/path to Page2.jsp /Page2.jsp?SendingValue="+selectedData;

Page2.jsp

 var url = new URL(location.href);
 var YourValue = url.searchParams.get("SendingValue");

关于javascript - 如何将数据从选中的数据表发送到另一个页面复选框，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48636414/

文章推荐： javascript - 布局组件(抽屉、工具栏等)不作为组件工作

文章推荐： c# - IntegratedWindowsAuthentication 与协商有什么区别？

文章推荐： javascript - React 同步渲染

文章推荐： C#方法含义

javascript - 复选框单击脚本 - [SHIFT] 选中/取消选中范围，[CTRL] 选中/取消选中所有 - 基于选择名称？
谁知道现成的脚本或插件提供: -Shift click for check/uncheck all in range -CTRL click to select or unselect all 这可以
javascript - 选中/取消选中输入不起作用
如果您点击按钮，它会打开 3 个复选框(一个选择全部，还有两个子输入)。我想做的是，如果用户点击Centro de dia，输入将保持选中状态，而另一个(在本例中为button)会被选中未经检查。如
javascript - 选中/取消选中所有按钮有什么问题？
我正在学习 Wes Bos 30 天 Javascript 类(class)，在一项可选功能上，我需要在底部添加三个按钮:清除全部、选中全部和取消选中全部。这是代码
jquery 选中/取消选中复选框列表
自从升级到 jquery 1.9 以来，我的脚本停止了检查/取消选中复选框的工作。我有一个主复选框，用于控制选择/检查表中的复选框列表。升级到新的 jquery 版本后，仅最初单击“检查全部”复选框
jquery - 选中/取消选中表格中的所有复选框
我有一个带有复选框列的表格，我添加了以下内容: 这是我的 jQuery 函数: jQuery(document).ready(function() { jQuery('#selec
jquery - 选中/取消选中复选框数组
这是我所拥有的(此处使用 Twitter bootstrap) #html fdsfdsfds
jquery 选中/取消选中复选框
这个问题已经有答案了: Setting "checked" for a checkbox with jQuery (44 个回答) 已关闭 6 年前。当我单击“问题”时，必须选择/取消选择两个复选框
jQuery:选中/取消选中复选框时更改下拉选择
我有这个表格: First Second Third --- Option1 Option2 有没有办法(使用 JS/jQuery)我可以在 First 时将 first
jquery - 选中/取消选中所有复选框
我试图有一个复选框来选中/取消选中所有其他复选框。我正在使用此代码: $("#checkall").toggle( function () { $(".kselItems
javascript - 选中/取消选中复选框列表中的所有项目时的奇怪行为
在复选框列表中，应该可以通过按下按钮来选中/取消选中所有项目。但是下面的代码只能部分工作: All None
c# - 如何确定复选框列表被选中/选中 -
当我执行代码时，我得到 4 个复选框，我检查/选择了所有 4 个复选框，当我尝试调试代码时，它确实算作我有 4 个复选框，但所有 4 个复选框都被选中 = false。我在代码中缺少什么？ Li
javascript - 选中/取消选中单选按钮
$("input[type='radio']").each(function() { if ($(this).is(":checked")) { $(this).css('backgrou
javascript - 选中/取消选中复选框时更改相应标签的文本
我无法使用此 javascript 函数。任何帮助将不胜感激! No function yesno(thecheckbox, thelabel){ var ch
Javascript 选中/取消选中所有复选框并将值写入文本区域
这是我的第一个 js 脚本，请对我温柔点:) 问题是当我点击选中所有按钮时，所有复选框都被选中但它不会将值写入文本区域，如果我单击单个复选框然后值被添加/删除并且没关系，我只是卡住了在那个选中所有/取
javascript - 选中/未选中的复选框
我试图在复选框处于选中状态或未选中状态时传递一个值。但是，它似乎没有通过非检查状态。我正在使用的代码如下: if (document.getElementById('PRODUCT_REVIEW_E
javascript - 选中/取消选中除一个复选框之外的所有复选框。？
目前我正在使用它来选中/取消选中表单中的所有复选框。 checked=false; function checkedAll (frm1) { var aa= document.getElem
javascript - 选中/取消选中单选按钮并在取消选中时隐藏选项
我有 2 个单选按钮，当我单击其中一个按钮时，我会看到下拉菜单，必须在其中选择金额。到目前为止，我能够检查/取消检查它们，但问题是，当我取消检查单选按钮下拉列表时，不会再次隐藏。我不太擅长 Jav
javascript - 选中/取消选中复选框
HTML: Select All 1. 2. 3. 4. 5. JS: function test(click
javascript - 选中/取消选中所有复选框并添加值
我需要为每套图书设置一个选中/取消选中全部复选框。它还应该加上总价和重量。到目前为止，我只能选中每个框，它会很好地添加值，但是一旦我添加一个函数来选中所有框，一切都会停止工作。 //check all
javascript - 选中/取消选中复选框取决于数据来自数据库
我正在尝试根据来自 mysql 数据库的数据来选中或取消选中复选框。我使用nusoap webservice/webclient读取数据，数据值可以是1或0。我的代码是: functio

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

javascript - 如何将数据从选中的数据表发送到另一个页面复选框