Dynamically create and submit form

Suppose you are working one project, it had a list of products. And by clicking on the product, the data has to be sent through the post to other page. Now I had to make multiple forms. So we are create form dynamically on click function.

You can using javascript to create and send Dynamic form. It very easy way. You can fallow bellow example

Step1

Carete html page. In this page you can create input box and append form in bottom of body.

 
<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
<button >Click me</button>
<table> 
<tr><th>Product Name</th><th>Product ID</th></tr>
<tr><td>Product 1</td><td><a href="javascript:sendform(1001)"> 1001</td></tr>
<tr><td>Product 2</td><td><a href="javascript:sendform(1002)"> 1002</td></tr>
<tr><td>Product 3</td><td><a href="javascript:sendform(1003)"> 1003</td></tr>
<tr><td>Product 4</td><td><a href="javascript:sendform(1004)"> 1004</td></tr>
</table>
<script type="text/javascript">
function sendform(productId) {
    var form = document.createElement("form");
    var input1= document.createElement("input"); 

    form.method = "POST";
    form.action = "sendform.php"; 

    input1.value=productId;
    input1.name="productId";
    form.appendChild(input1);  
    document.body.appendChild(form);
    form.submit();
}
</script>
</body>
</html>

Step2

Create sendform.php page where you can receive producId.

 
<?php 

var_dump($_POST);

?>
0 0 votes
Article Rating
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments