-1

Hi here i have one button , when I click that add element button two input field will come like one by one for this i have used clone() function .here my problem is after given some values for each input files and click the submit button i got only one field value . here is my code 

<html>
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
    <script>
    $(document).ready(function(){
            $('#btn1').click(function(){
            var $div = $('div[id^="trace-div"]:last');
            var num = parseInt( $div.prop("id").match(/\d+/g), 10 ) +1;
            var $klon = $div.clone().prop('id', 'trace-div'+num );

                  $klon.find("input[name='t1_x_axis']").attr("id", "x_axis_t"+num).val("");
                $klon.find("input[name='t1_y_axis']").attr("id", "y_axis_t"+num).val("");
                $div.after( $klon);

        });
    }); 
    function chartsubmitbtn(){
        var clones = $("input:text").clone();
        //var str = JSON.stringify(clones);
        console.log(clones.val());
        return true;
    }

    </script>

    <body>
    <button type = "button" id = "btn1" > Add element</button>
    <div id = "trace-div1">
    <h4><b>Trace 1 </b></h4>
      <form>
          <table>
              <tbody>
                 <tr>
                     <td><label>X Axis:  </label></td>                                               
                     <td><input type="text" name="t1_x_axis" id="x_axis_t1" size="50"></td>                                         
                  </tr>                                                                             
                  <tr>
                     <td><label>Y Axis:  </label></td>
                     <td><input type="text" name="t1_y_axis" id="y_axis_t1" size="50"></td>
                  </tr>
              </tbody>
          </table>
       </form>  
  </div> 
  <button type="button" id="chart-report-submit"  onclick="chartsubmitbtn();">Submit</button>

    </body>
</html>

Note:if i don't use val() in console.log() it is giving json data.from that how can i get my values . Thanks

Vikrant
  • 4,920
  • 17
  • 48
  • 72
murala sandeep
  • 33
  • 8
  • PHP overwrites multiple form parameters with the same name, unless you use the “special syntax” using square brackets to make it create arrays, see duplicate for details. – 04FS Sep 20 '19 at 09:00
  • Thanks for your response ,here i need those input values in chartsubmitbtn() when i click the submit button .becz i want send those value data into controller(codeigniter) using ajax call .Thanks – murala sandeep Sep 20 '19 at 09:13
  • I don’t know what to do with that information. – 04FS Sep 20 '19 at 09:16

1 Answers1

0

Not able to understand your exact requirement, but in the clones variable you are using you are getting an array of HTMLCollection objects. So you can convert it into a normal array using [...clones] and then iterate over it to print all the values in the console.

function chartsubmitbtn() {
   var clones = $("input:text").clone();
   [...clones].forEach(item => console.log(item.value));
   return true;
 }

Hope this helps :)

Abito Prakash
  • 4,368
  • 2
  • 13
  • 26