title: get selected multiple rows of checkbox by inserting no of rows in input box
body: <p><a href="https://i.stack.imgur.com/NaJ3s.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/NaJ3s.png" alt="enter image description here" /></a></p>
  <p>How can i get selected checkbox of the datatable by inputing numbers</p>
  <p>I'm trying to code a <code>bootstrap data table</code> which able to <strong>select check box of the rows by</strong> <code>inserting no of rows in the input box</code></p>
  <p><strong>I dont have any idea about how to do it.</strong></p>
  <p><strong>e.g:</strong> I typed number <strong>three in the input box</strong> then <strong>automatically checkbox table of two rows will get selected</strong> at [the beginning -&gt; no problem]</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;&lt;head&gt;
      &lt;link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"&gt;
      &lt;link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.10.1/bootstrap-table.min.css"&gt;
          &lt;script src="//code.jquery.com/jquery.js"&gt;&lt;/script&gt;
          &lt;script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"&gt;&lt;/script&gt;    
          &lt;script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.10.1/bootstrap-table.min.js"&gt;&lt;/script&gt;
  
  
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div class="container text-center"&gt;
  &lt;label for="fname"&gt;insert number for select multiple check box&lt;/label&gt;
  &lt;input type="number" id="selectcheckbox" name="selectcheckbox"&gt;
  &lt;table data-toggle="table" 
         data-classes="table table-hover table-condensed"
         data-row-style="rowColors"
         data-striped="true"
         data-sort-name="Quality"
         data-sort-order="desc"
         data-pagination="true"
         data-click-to-select="true"
         &gt;
      &lt;thead&gt;
      &lt;tr&gt;
          &lt;th data-field="state" data-checkbox="true"&gt;&lt;/th&gt;
          &lt;th class="col-xs-1" data-field="Product_Name" data-sortable="true"&gt;Product Name&lt;/th&gt;
          &lt;th class="col-xs-1" data-field="Quality" data-sortable="true"&gt;Quality&lt;/th&gt;
          &lt;th class="col-xs-6" data-field="Quantity" &gt;Quantity&lt;/th&gt;
      &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody&gt;
     &lt;tr id="tr-id-2" class="tr-class-2"&gt;
          &lt;td&gt;&lt;/td&gt;
          &lt;td&gt;Wheat&lt;/td&gt;
          &lt;td&gt;Good&lt;/td&gt;
          &lt;td&gt;200 Bags&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr id="tr-id-2" class="tr-class-2"&gt;
          &lt;td&gt;&lt;/td&gt;
          &lt;td&gt;Rice&lt;/td&gt;
          &lt;td&gt;Good&lt;/td&gt;
          &lt;td&gt;100 Bags&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr id="tr-id-2" class="tr-class-2"&gt;
          &lt;td&gt;&lt;/td&gt;
          &lt;td&gt;Rice&lt;/td&gt;
          &lt;td&gt;Good&lt;/td&gt;
          &lt;td&gt;100 Bags&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr id="tr-id-2" class="tr-class-2"&gt;
          &lt;td&gt;&lt;/td&gt;
          &lt;td&gt;Sugar&lt;/td&gt;
          &lt;td&gt;Prime&lt;/td&gt;
          &lt;td&gt;200 Bags&lt;/td&gt;
      &lt;/tr&gt;            
      &lt;tr id="tr-id-2" class="tr-class-2"&gt;
          &lt;td&gt;&lt;/td&gt;
          &lt;td&gt;Maze&lt;/td&gt;
          &lt;td&gt;Fine&lt;/td&gt;
          &lt;td&gt;10 Packs&lt;/td&gt;
      &lt;/tr&gt;            
      &lt;tr id="tr-id-2" class="tr-class-2"&gt;
          &lt;td&gt;&lt;/td&gt;
          &lt;td&gt;Sugar&lt;/td&gt;
          &lt;td&gt;Prime&lt;/td&gt;
          &lt;td&gt;200 Bags&lt;/td&gt;
      &lt;/tr&gt; 
      &lt;tr id="tr-id-2" class="tr-class-2"&gt;
          &lt;td&gt;&lt;/td&gt;
          &lt;td&gt;Sugar&lt;/td&gt;
          &lt;td&gt;Prime&lt;/td&gt;
          &lt;td&gt;200 Bags&lt;/td&gt;
      &lt;/tr&gt; 
      &lt;tr id="tr-id-2" class="tr-class-2"&gt;
          &lt;td&gt;Sugar&lt;/td&gt;
          &lt;td&gt;Prime&lt;/td&gt;
          &lt;td&gt;200 Bags&lt;/td&gt;
      &lt;/tr&gt; 
      &lt;tr id="tr-id-2" class="tr-class-2"&gt;
          &lt;td&gt;&lt;/td&gt;
          &lt;td&gt;Sugar&lt;/td&gt;
          &lt;td&gt;Prime&lt;/td&gt;
          &lt;td&gt;200 Bags&lt;/td&gt;
      &lt;/tr&gt; 
      &lt;tr id="tr-id-2" class="tr-class-2"&gt;
          &lt;td&gt;&lt;/td&gt;
          &lt;td&gt;Sugar&lt;/td&gt;
          &lt;td&gt;Prime&lt;/td&gt;
          &lt;td&gt;200 Bags&lt;/td&gt;
      &lt;/tr&gt; 
      &lt;tr id="tr-id-2" class="tr-class-2"&gt;
          &lt;td&gt;&lt;/td&gt;
          &lt;td&gt;Sugar&lt;/td&gt;
          &lt;td&gt;Prime&lt;/td&gt;
          &lt;td&gt;200 Bags&lt;/td&gt;
      &lt;/tr&gt;        
      &lt;/tbody&gt;    
  &lt;/table&gt;
  &lt;/div&gt;
  
  &lt;script&gt;
  function queryParams() {
      return {
          type: 'owner',
          sort: 'updated',
          direction: 'desc',
          per_page: 100,
          page: 1
      };
  }
  function rowColors(row, index) {
      var classes = ['active', 'success', 'info', 'warning', 'danger'];
      
      if (index % 2 === 0 &amp;&amp; index / 2 &lt; classes.length) {
          return {
              classes: classes[index / 2]
          };
      }
      return {};
  }
  &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  <p><strong>My actual code is here</strong></p>
  <pre><code>&lt;html&gt;
  &lt;body&gt;
  &lt;label for=&quot;fname&quot;&gt;insert number for select multiple check box&lt;/label&gt;
      &lt;input type=&quot;number&quot; id=&quot;selectcheckbox&quot; name=&quot;selectcheckbox&quot;&gt;
  &lt;table class=&quot;table table-striped table-bordered&quot; id=&quot;tbl&quot;&gt;
      &lt;thead&gt;
          &lt;tr&gt;
          &lt;th&gt;SELECT check box is here&lt;/th&gt;
          &lt;th&gt;Value&lt;/th&gt;
          &lt;th&gt;Value&lt;/th&gt;
          &lt;th&gt;Value&lt;/th&gt;
          &lt;th&gt;Value&lt;/th&gt;
          &lt;th&gt;Value&lt;/th&gt;
          &lt;th&gt;Value&lt;/th&gt;
          &lt;th&gt;Value&lt;/th&gt;
          &lt;th&gt;Value&lt;/th&gt;
          &lt;th&gt;Value&lt;/th&gt;
          &lt;th&gt;Value&lt;/th&gt;
          &lt;th&gt;Value&lt;/th&gt;
          &lt;th&gt;Value&lt;/th&gt;
          &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;
  
  &lt;script&gt;
  $(document).ready(
      function()
      {
              var table = $('#tbl').DataTable({
              &quot;columnDefs&quot;: 
              [
              {
                  orderable: false,
                  className: 'select-checkbox',
                  targets:   0
              }
              ],
            destroy:true,
            &quot;fnRowCallback&quot; : 
            function(nRow, aData, iDisplayIndex)
            {
                $(&quot;td:first&quot;, nRow).html(iDisplayIndex +1);
                return nRow;
            },      
            'select': 
            {
                style: 'multi',
                selector:'td:nth-child(1)'
            },
                'order': [[ 1, 'asc' ]],
            });
            
            $.ajax({
            type:&quot;POST&quot;, 
            url:&quot;fetch_data.php&quot;,  
            data:'value='+value,
              success: function(data)
              {
                if(data['error'] == '0')
                {
                  console.log(data);
                    
                    //set Finish Data
                    table.clear().draw();
                    for(i = 0; i &lt; data['chemical_date'].length; i++) 
                    {
                      table.row.add([
                      data['chemical_date'][i]['value'],
                      data['chemical_date'][i]['value'],
                      data['chemical_date'][i]['value'],
                      data['chemical_date'][i]['value'],
                      data['chemical_date'][i]['value'],
                      data['chemical_date'][i]['value'],
                      data['chemical_date'][i]['value'],
                  
                      &quot;&lt;input type='text' value='' class='form-control' id='selectedqty&quot;+i+&quot;' onkeyup='sqty(this.id);' name='selectedqty&quot;+i+&quot;'/&gt;&quot;,
                      &quot;&lt;input type='text' value='' class='form-control ' id='note&quot;+i+&quot;'  name='note&quot;+i+&quot;' /&gt;&quot;,
                      &quot;&lt;input type='text' value='' class='form-control ' id='location&quot;+i+&quot;'  name='location&quot;+i+&quot;' /&gt;&quot;,
                      '',
                      '',
                      ''
                      ]).draw(false);
                    }
                }
              }
            })
      });
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <p><strong>fetch_data.php</strong></p>
  <pre><code>&lt;?php
  $response = array();
  if($_SERVER['REQUEST_METHOD']=='POST')
  {
      extract($_POST);
      //Top data
          $data = array();
          $obj = array(); 
          $sql = &quot;some query here...&quot;;
  
              $result = mysqli_query($db, $sql);
              $chemical = array();
          
              while ($row = mysqli_fetch_assoc($result)) 
              {
                  //Finish Data
                  $row1 = array();
                  $row1['value'] = $row['value'];
                  $row1['value'] = $row['value'];
                  $row1['value'] = $row['value'];
                  $row1['value'] = $row['value'];
                  $row1['value'] = $row['value'];
                  $row1['value'] = $row['value'];
                  $row1['value'] = $row['value'];
                  array_push($chemical, $row1);
                  //Stock Data
              }
              $response['chemical_date'] = $chemical;
              //Process Data
              $response['error'] = &quot;0&quot;;
  }
  else
      $response['error'] = &quot;1&quot;;
      echo json_encode($response);
  ?&gt;
  </code></pre>