I have created a field in Html and jquery that can expand basically I made it for customer care centers so that they can put on the pin codes where they want to work on. Now I have created a field in Html and jquery that can expand by clicking a plus button now I want to insert individual data for individual field in MySQL database using PHP how can I do that.
<div class="input_fields_container">
<div><input type="text" name="product_name[]">
<button class="btn btn-sm btn-primary add_more_button">Add More Fields</button>
</div>
</div>
this is my jquery code
<script>
$(document).ready(function() {
var max_fields_limit = 10; //set limit for maximum input fields
var x = 1; //initialize counter for text box
$('.add_more_button').click(function(e){ //click event on add more fields button having class add_more_button
e.preventDefault();
if(x < max_fields_limit){ //check conditions
x++; //counter increment
$('.input_fields_container').append('<div><input type="text" name="product_name[]"/><a href="#" class="remove_field" style="margin-left:10px;">Remove</a></div>'); //add input field
}
});
$('.input_fields_container').on("click",".remove_field", function(e){ //user click on remove text links
e.preventDefault(); $(this).parent('div').remove(); x--;
})
});
</script>
this is my output if you want to get a better idea of what I am trying to say my page
It is just a traditional way... $_POST['product_name'];
First enclose all your inputs under a form, along with a submit button.
Then, have an ajax call as follows:
$(myform).submit(function(){
$.ajax({
type: 'post',
url: "your/url",
data: new FormData(myform),
contentType: false,
processData: false,
success: function(){.
//your code
}
});
});
In php, you can access the request inputs with $_POST['product_name']
.
Even if you choose to do it without AJAX, the inputs can be accessed in the same way.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.