0

I have a question about the wrappers/accordeons. I now have multiple wrappers and in each wrapper there is a form. Now, I want one sendbutton on the end of the page. The sendbutton which will send all the forms that have been filled in at once.

How can I do that?

Michael Gaskill
  • 7,913
  • 10
  • 38
  • 43
Stromae
  • 21
  • 3

1 Answers1

0

I don't know why you want to break input into different forms and then submit them again at once. Would it not make sense to use one form and submit the data and process it the way you want using the processFormData hook? may be because you want the accordion to group you form fields. Let me help you this way:

Create your form in the format shown below. Make sure the form has a tabless layout to be able to use fieldsets.

  1. Create a fieldset without a label. You may add the class ce_accordion just in case you have some styling attached to it.

  2. Create a field of type html and add the following markup.

    <div class="toggler">Form 1 headline here</div>

  3. Create another field with the following markup

    <div class="toggler">

  4. Now create your input fields from here. for example a text field,textares.

  5. Create a field of type html to close html markup created in step 3

    </div>

  6. Create a fieldset wrapper end here.

The above steps can be repeated as many as how many groups of fields you want to create in an accordion.

  1. Now create you submit button here and it will send all your data the way you want.

Just a by the way: If some one submits a form in a wrapper that is closed, how will he know which wrapper has error fields?

$(document).ready(function() {
    $(".ce_accordion").each(function(index,el) {

        if($(this).find("p.error")){
$(this).addClass("hasErrors");
$(this).find("div.toggler").addClass("active").attr("aria-expanded","true");
}

    });
​});​

You can now add a style for .hasErrors rule

LethalyXKoded
  • 134
  • 4