构建多页响应表单的最佳方法是什么？

Question

I have to design a so long form, and it has to be responsive. In desktop layout there is no problem displaying a lot of controls, but not the same in mobile. So I divided the form into "steps", like this:

<form action="#" method="post">

    <h1>My Wizzard</h1>

    <div id="first_step">
    ...
    </div>

    <div id="second_step">
    ...
    </div>
</form>

So, with CSS I hide and show one step at time. The problem is I need a submit button on every div-step, because if not the form is hidden. And I really don't need the submit until the last step. So, now I'm wondering if I'm designing this right and if there is another better way to do it.

Any suggestion will be appreciated!! Thanks in advance,

Answer 1

Well you may use a next button at every step and onclick of it you can fire an AJAX request to save that data to database or if you want to save it to the browser you can do it as well.

And finally on the last step use submit button.