Loop throught multiple array in table and combining in single array

Question

Im working on project which there is a table where containing multiple result of title , number , money and checkbox . which i need to determine if the checkbox are non-checked and it won't take the result to combine in single array. How do we do this ? Kindly advice

i want combining for example :

into single array like :

总和大,1.9995,1;总和小,1.9995,1;虎,1.9995,1;

html :

<tbody id="confirm-table-body">
<tr>
    <td> 总和大</td>
    <td style="color: red">1.9995</td>
    <td style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td>
    <td><input type="checkbox" checked=""></td>
</tr>
<tr>
    <td> 总和小</td>
    <td style="color: red">1.9995</td>
    <td style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td>
    <td><input type="checkbox" checked=""></td>
</tr>
<tr>
    <td> 虎</td>
    <td style="color: red">1.9995</td>
    <td style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td>
    <td><input type="checkbox" checked=""></td>
</tr>
<tr>
    <td colspan="2">组数: <span id="confirm-gropup-nums">3</span></td>
    <td colspan="2">总金额: <span id="confirm-total-amount">3</span></td>
</tr>
</tbody>

JS :

"确定": function(){
                var count = parseFloat($('#confirm-total-amount').html());
                if(!isNaN(count) && count == 0){
                    alert("Please enter money!");
                }else{ 
                    Combine single array here !!!!

                }
            },

Rohan Kumar · Accepted Answer · 2017-04-28 09:30:39Z

2

Try this,

function getCheckedRows() {
  var arr = [];
  $('table :checkbox:checked').each(function() {
    td = $(this).closest('tr').find('td');
   
    arr.push([$(td[0]).text(), $(td[1]).text(), $(td[2]).find('input').val()].join());
  });
  $('#confirm-total-amount').text($('table :checkbox:checked').length)
  return arr.join(';');
}


$('table :checkbox').on('change', function() {
  console.log(getCheckedRows());
});
console.log(getCheckedRows());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tbody id="confirm-table-body">
    <tr>
      <td> 总和大</td>
      <td style="color: red">1.9995</td>
      <td style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td>
      <td><input type="checkbox" checked=""></td>
    </tr>
    <tr>
      <td> 总和小</td>
      <td style="color: red">1.9995</td>
      <td style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td>
      <td><input type="checkbox" checked=""></td>
    </tr>
    <tr>
      <td> 虎</td>
      <td style="color: red">1.9995</td>
      <td style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td>
      <td><input type="checkbox" checked=""></td>
    </tr>
    <tr>
      <td colspan="2">组数: <span id="confirm-gropup-nums">3</span></td>
      <td colspan="2">总金额: <span id="confirm-total-amount">3</span></td>
    </tr>
  </tbody>
</table>

edited Apr 28, 2017 at 9:30

answered Apr 28, 2017 at 9:11

Rohan Kumar

40.7k11 gold badges81 silver badges111 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Morgan Ng Over a year ago

possible to write it into on my if else condition without defining a new function ?

Rohan Kumar Over a year ago

Yes, just copy the code

var arr = [];   $('table :checkbox:checked').each(function() {     td = $(this).closest('tr').find('td');     arr.push([$(td[0]).text(), $(td[1]).text(), $(td[2]).find('input').val()]);   });console.log(arr);

Morgan Ng Over a year ago

hi its working , i getting 总和小,1.9995,11, 虎,1.9995,11 .. can we change the comma into ; ? like 总和小,1.9995,11; 虎,1.9995,11

Morgan Ng Over a year ago

sorry for this silly request ... i just newbie on this .. how to we implement this arr.join(';') into the code you meantioned?

Harshit Jain · Accepted Answer · 2017-04-28 09:23:08Z

This can be done using jquery. I have added some classes of td for ease of use.

html:

<tbody id="confirm-table-body">
<tr>
    <td class="title"> 总和大</td>
    <td class="number" style="color: red">1.9995</td>
    <td class="money" style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td>
    <td><input type="checkbox" checked=""></td>
</tr>
<tr>
    <td class="title"> 总和小</td>
    <td class="number" style="color: red">1.9995</td>
    <td class="money" style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td>
    <td><input type="checkbox" checked=""></td>
</tr>
<tr>
    <td class="title"> 虎</td>
    <td class="number" style="color: red">1.9995</td>
    <td class="money" style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td>
    <td><input type="checkbox" checked=""></td>
</tr>
<tr>
    <td colspan="2">组数: <span id="confirm-gropup-nums">3</span></td>
    <td colspan="2">总金额: <span id="confirm-total-amount">3</span></td>
</tr>
</tbody>

JS:

function(){
        var count = parseFloat($('#confirm-total-amount').html()),
            output = [];
        if (!isNaN(count) && count == 0) {
            alert("Please enter money!");
        } else { 
            $("td input[type=checkbox]:checked").each(function() {
                var $parent = $(this).parent();

                output.push({
                    "title": $parent.find(".title").html(),
                    "number": $parent.find(".number").html(), 
                    "money": $parent.find(".money input").val(),
                })
            })
        }
    }

Collectives™ on Stack Overflow

Loop throught multiple array in table and combining in single array

2 Answers 2

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related