1

I am looking forward to create a form section on click of a button click. Say I want to add a new seller agent information section as many times I want to on click of + button. The seller agent information section should contain basic text, dropdowns etc.

These newly created entries should be stored in database thus. I also, need to export the entries as CSV later.

Although, I am using WordPress as a platform, I wouldn't mind other PHP/AJAX solutions to add this functionality.

I can't find any perfect match , Formidable forms were close to this but the button click to ADD NEW leads me to separate page. Other plugins are not offering possibility to do this.

You can suggest any free or paid 3rd party form builders, plugins for wordpress or sample code to help me implement this in case I have missed anything.

I have shared the screenshot of the form to be coded like!!

Dynamic form example

Improve this question

1 Answer 1

Reset to default
2

You can do that using Javascript, by creating new DOM elements.

You can use this Try it yourself functionality from W3Schools

Copy and paste this code into Try it yourself and see how it works, it just adds a new paragraph:

<!DOCTYPE html>
<html>
<body>

<div id="div1">
<p id="p1">This is a paragraph.</p>
<p id="p2">This is another paragraph.</p>
<p><input type="button" value="Add Paragraph" onclick="addPara();"></p>
</div>

<script>
function addPara()
{
var para = document.createElement("p");
var node = document.createTextNode("This is new.");
para.appendChild(node);
var element = document.getElementById("div1");
element.appendChild(para);
}
</script>

</body>
</html>

Now, take a look at this post in SO to see how to add a form.

Sorry I missed the database part. You will need to create a php page that would handle data processing and storing in a db. Again I'm using W3schools try it yourself functionality (but generally that website can't be trusted on more serious and professional programming info), here is the link with an example how to send data from a form to php.

That's one way of doing it and it will refresh the page. My favourite way is to use Javascript to collect data and then send it to the php page using an AJAX call. Here is the link to ajax with php.

And this is the guide on working with database tables in WP, I guess you can just use those functions in a php page that would handle data manipulation.

Improve this answer
2
  • That's fine. I can add the fields dynamically but how to store the dynamic fields is a problem. Will this newly added section on plus get inserted into database after hitting submit?
    – HalfWebDev
    Jun 26, 2015 at 5:17
  • 1
    I updated my answer.
    – Marina Dunst
    Jun 26, 2015 at 21:36

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.