I have a form which adds a line dynamically when click on add form.
<form class="address">
<input type="text" class="add_name">
<input type="test" class="add_zip">
</form>
When Clicked on lets say a button add address:
<form class="address">
<input type="text" class="add_name">
<input type="test" class="add_zip">
//added line when clicked on btn
<input type="text" class="add_name">
<input type="test" class="add_zip">
</form>
I used following code
$('.address').each(function(){
var address_form = $($this);
if(address_form.find('.add_name').val() == ''){
//dosomething
}else{
console.log(address_form.find('.add_name').val());
}
});
lets say if I put both address only first address is shown and second one undefined.
You could try the following:
$('button').on("click",function(ev){
const inps=$(".address input").slice(0,2).clone().val("");
$(".address").append(inps).append("<br>")
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form class="address"><input type="text" class="add_name" name="name[]"
placeholder="Enter your name"><input type="test" class="add_zip" name="zip[]" placeholder="and zip code"><br></form>
<button>add fields</button>I added a name attribute to your input fields. By doing this the data can be collected on the backend in suitable array structures for name and zip.