title: Reload issue with Laravel Livewire and Bootstrap form
body: <p>I’m seeing a Livewire issue for me when I use ANY Javascript form. Use the following form: <a href="https://bbbootstrap.com/snippets/multi-step-form-wizard-30467045" rel="nofollow noreferrer">https://bbbootstrap.com/snippets/multi-step-form-wizard-30467045</a> (Although I tried other forms and it happens to me all due to wire: model events from livewire)</p>
  <p>The problem is that WIRE: MODEL takes me to the first section and I can’t use WIRE: IGNORE because it overrides SELECT related behaviors.</p>
  <p>In the second section I use the following related form:</p>
  <pre><code>&lt;div class=&quot;form-group&quot;&gt;
    &lt;label for=&quot;provincia&quot;&gt;Provincia&lt;/label&gt;
    &lt;select wire:model=&quot;ubicacionSeleccionada&quot; class=&quot;form-control&quot; id=&quot;ubicacion&quot;&gt;
         &lt;option value=''&gt;Seleccionar provincia&lt;/option&gt;
         @foreach($ubicaciones as $ubicacion)
         &lt;option value=&quot;{{$ubicacion-&gt;id}}&quot;&gt;{{ $ubicacion-&gt;ubicacion }}&lt;/option&gt;
         @endforeach                                          
    &lt;/select&gt;
    &lt;/div&gt;
                                          
      
     &lt;div class=&quot;form-group&quot;&gt;
     &lt;label for=&quot;tipopropiedad&quot;&gt;Localidad&lt;/label&gt;
     &lt;select wire:model=&quot;area&quot; class=&quot;form-control&quot; id=&quot;localidad
           {{ count($this-&gt;areas)== 0 ? 'hidden' : '' }} &quot;&gt;
           &lt;option value=''&gt;Seleccionar localidad&lt;/option&gt;
           @foreach($this-&gt;areas as $area)
           &lt;option value={{ $area-&gt;id }}&gt;{{ $area-&gt;name }}&lt;/option&gt;
           @endforeach
     &lt;/select&gt;
     &lt;/div&gt;
  </code></pre>
  <p>And this does not allow me to use the WIRE: IGNORE to abort the events.</p>
  <p>The problem is that any WIRE: MODEL generates an event that takes the form to the first section. It seems to be a REFRESH</p>
  <p>Does anyone know how I could use livewire without this inconvenience?</p>
  <p><strong>EDITION</strong></p>
  <p><strong>BUTTON NEXT VIEW</strong></p>
  <pre><code>&lt;input type=&quot;button&quot; name=&quot;next&quot; class=&quot;next action-button&quot; value=&quot;Continue&quot; /&gt;
  </code></pre>
  <p><strong>JAVASCRIPT</strong></p>
  <pre><code>&lt;script&gt;
  $(document).ready(function() {
  
      var current_fs, next_fs, previous_fs; //fieldsets
      var opacity;
  
      $(&quot;.next &quot;).click(function() {
  
          current_fs = $(this).parent();
          next_fs = $(this).parent().next();
  
          //Add Class Active
          $(&quot;.progressbar li &quot;).eq($(&quot;fieldset &quot;).index(next_fs)).addClass(&quot;active &quot;);
  
          //show the next fieldset
          next_fs.show();
          //hide the current fieldset with style
          current_fs.animate({
              opacity: 0
          }, {
              step: function(now) {
                  // for making fielset appear animation
                  opacity = 1 - now;
  
                  current_fs.css({
                      'display': 'none',
                      'position': 'relative'
                  });
                  next_fs.css({
                      'opacity': opacity
                  });
              },
              duration: 600
          });
      });
  
      $(&quot;.previous &quot;).click(function() {
  
          current_fs = $(this).parent();
          previous_fs = $(this).parent().prev();
  
          //Remove class active
          $(&quot;.progressbar li &quot;).eq($(&quot;fieldset &quot;).index(current_fs)).removeClass(&quot;active &quot;);
  
          //show the previous fieldset
          previous_fs.show();
  
          //hide the current fieldset with style
          current_fs.animate({
              opacity: 0
          }, {
              step: function(now) {
                  // for making fielset appear animation
                  opacity = 1 - now;
  
                  current_fs.css({
                      'display': 'none',
                      'position': 'relative'
                  });
                  previous_fs.css({
                      'opacity': opacity
                  });
              },
              duration: 600
          });
      });
  
      $('.radio-group .radio').click(function() {
          $(this).parent().find('.radio').removeClass('selected');
          $(this).addClass('selected');
      });
  
      $(&quot;.submit &quot;).click(function() {
          return false;
      })
  
  });
  </code></pre>