0

I have 2 html tables. In the first table I will be able to select the values required and click on an add button which fetches the records in the first table and appends it in the second table. I also have a td in first table which consists of combo box on selecting the value in the combo box and clicking on the add button I will be able to append the record to the second table according to the values in combo means adding the record that many times.

I'm now having a doubt that:

I have a text box in the second table which consists of the numeric value, and when I selected the record from the first table and add, the row gets dynamically appended to the second table and a textbox is added. Apart from this I have a text box outside these tables. the values of the textbox in the second tables should be added and the total should be displayed in the textbox which doesnot belongs to these html tables.

The php code sample along with jquery is as follows:

php code

     <div>

        <label>Todays date</label>

        <input type=text name=tdate id=tdate>// used a datepicker for this

        <input type=button class=addBtn>

     <table border=1 id=tbl>

      <tr>

          <th>sno</th>

          <th>name</th>

          <th>date</th>

          <th>insertion</th>

          <th>Amount</th>

     </tr>

     <tr>

         <td id=num>1</td>

         <td id=name>abc</th>

         <td id=date>08-10-2012</td>

         <td><select id=insertion name=insertion>

         <?php for($i=1;$i<=10;$i++) { echo "<option value=$i>$i</option>; }?>

         </select>
         </td>

         <td id=amount>10000</td>

    </tr>

   <tr>

     <td id=num>2</td>

     <td id=name>def</th>

     <td id=date>23-10-2013</td>

     <td>

      <select id=insertion name=insertion>

      <?php for($i=1;$i<=10;$i++) { echo "<option value=$i>$i</option>; }?>

     </select>

     </td>

     <td id=amount>10000</td>

   </tr>

     </table>

// the above table data is bought from database using onchange event of combobox and lots of data but

//not showing as of now.

     <table border = 1 id = clone>

   <tr>

    <th>sno</th>

    <th>name</th>

    <th>date</th>

    <th>insertion</th>

    <th>Amount</th>

    <th>today date</th>

  <tr>

</table>


<label>totAmount</label>

<input type = text name= totAmount id=totAmount>

  </div>

functions.js

$('#tbl').on('click', 'tbody tr', function(event) { 

            if ($(this).hasClass('selected')) { 

                $(this).removeClass('selected');

                $(this).css("background", "white");

            } else {       

                $(this).addClass('selected');
                $(this).css("background", "#ffc");                    
            }
});


  var k=1;

  $(".addBtn").on('click', function(event) {

  if ($('#tbl tr').hasClass('selected')) {

      var items = [];

      $('#tbl tr.selected').each(function() {           

                     var name= $(this).find("#name").html();

                     var date = $(this).find("#date").html();

                     var insertion = $(this).find("#insertion option:selected").html();

         var amount = $(this).find("#amount").html();

         var todaydate = document.getElementById("tdate").value;

        for(var j=1; j<=insertion;j++) {

              var n = "<tr>"+"<td>"+k+"</td>"+"<td>"+name+"</td>"+

                  "<td>"+date+"</td>"+"<td>"+j+"</td>"+

                  "<td>"+amount+"</td>"+"<td>"+todaydate+"</td>"+

                    "</tr>";

                items.push(n);

                $("#clone").append(n);

                k++;                

          }
      });
    }
      $("#tbl tr").removeClass('selected');
      $("#tbl tr").css('background','white');
 });

// I have the textbox totAmount.

//I want the the amount present in the clone table to be added to the amount in the totAmount and also

// when I click the add button, after selecting the tr from the table (tbl), the tr is being appended

//but the amount could not be added to the textbox totAmount.

and I wanted to know that is it the best way to copy data from table and append it to another table.

If not please let me know any other possible way of copying data from one table to other table with an example Please.

Thanks

Please help.

kishore
  • 33
  • 7
  • 1
    first you need to help us help you by providing html and current script within your question. A demo in jsfiddle.net or other code sharing site is also helpful – charlietfl Oct 14 '14 at 12:20
  • Having doubts is a starts and all... but what is your question? – Spokey Oct 14 '14 at 12:26
  • I think you simply have a "number" form in which you want to do a total in your last textBox. So, you should create variable in php that count the total of the amount as the user click on "add" button. This way you will be able to assign the total variable to your last textBox. – Anwar Oct 14 '14 at 13:02
  • How do you add the row to the second table? With jQuery or PHP? Can you paste an example in your question? – S.Pols Oct 14 '14 at 14:19
  • $("#clone).append(n); code of yours looks incorrect. Can you confirm if you are using `$("#clone").append(n);` and missing colon in the post is just a typo? – Dharam Oct 15 '14 at 10:16
  • I have also included the code and please let me know the answer for this. And also tell me if the coding is good or if any suggestions with example. Thanks.. @charlietfl – kishore Oct 15 '14 at 10:17
  • @Dharam coding corrected.. forgot to type. Please check now and please answer – kishore Oct 15 '14 at 10:20

0 Answers0