Monday, 12 December 2022

How to get data from jquery form builder if there are multiple form initialized on the same page

I have a code like this:

<html>
<head>
    <title>Example formBuilder</title>
</head>
<body>

<div class="build-wrap"></div>
<div class="build-wrap"></div>


  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
  <script src="https://formbuilder.online/assets/js/form-builder.min.js"></script>
  <script>
  jQuery(function($) {
    $(document.getElementsByClassName('build-wrap')).formBuilder();
  });
  </script>
</body>
</html>

If it was initialized by id, then I could have get data with something like this:

  var fbEditor = document.getElementById('build-wrap');
  var formBuilder = $(fbEditor).formBuilder();

  document.getElementById('getJSON').addEventListener('click', function() {
    alert(formBuilder.actions.getData('json'));
  });

However, I am using classname to initialize form builder. Is there any way, when click on save, get the respective form-builder data? I am using https://formbuilder.online/

Here is jsfiddle: https://jsfiddle.net/xycvbj3r/3/

#PS: there could be numerous form builder inside php loop.



from How to get data from jquery form builder if there are multiple form initialized on the same page

No comments:

Post a Comment