Form across tabs

1

Is usally use this.$app.form.convertToData('#my_form'); inside component to get form data. But I can’t get a <form> spread across multiple tabs. I still can manually pull all input values and build a json object manually, or combine two forms, but it would be nice if I can just use single convertToData. :slight_smile:

Problem I’m facing is that most F7 css declarations and event handlers use child selector >, so there is no possibility to put <form> tags around the tabs to put them in one form.

Tips are welcome!

<div class="page">
  <div class="navbar">
    ... navbar content ...
  </div>

<form>   <-- form start

  <div class="toolbar tabbar toolbar-top">
    <div class="toolbar-inner">
      ... tab links ...
    </div>
  </div>

  <div class="tabs">
    <div class="page-content tab tab-active" id="tab-1">
      ... my form part 1 ...
    </div>
    <div class="page-content tab tab-active" id="tab-2">
      ... my form part 2 ...
    </div>
  </div>

</form>  <-- form end
2

But you can do this, right?

  <form class="tabs">
    <div class="page-content tab tab-active" id="tab-1">
      ... my form part 1 ...
    </div>
    <div class="page-content tab tab-active" id="tab-2">
      ... my form part 2 ...
    </div>
  </form>
3

Pff, doh… was thinking way too difficult. Thanks!

4

how to retreive data from array element form?
use app.converttodata only retreive last element