0

I use Stimulus Reflex in my view. Even I use data-reflex-root in my parent div, whole page re-rendered. How can I fix this issue?

My code looks like this;

<div id="pageruleDiv" data-reflex_root="#pageruleDiv" data-controller="PageruleReflex">

      <%= f.fields_for :pagerule do |form| %>
          <div class="inputObj">
              <%= form.label "Action" %>
              <%= form.select "activity", options_for_select(PageRule.activities.map {|k, v| [k.humanize.capitalize, v]}) %>
          </div>
          <div class="inputObj">
              <%= form.label "Method" %>
              <%= form.select "technique", options_for_select(PageRule.techniques.map {|k, v| [k.humanize.capitalize, v]}) %>
          </div>
          <div class="inputObj">
              <%= form.label "Page" %>
              <%= form.text_field :page %>
          </div>
          <a class="btn block text-center w-full no-underline" href="#" id="pageRuleButton" data-reflex="click->PageruleReflex#create"
               >Create</a>
      <% end %>

    </div>

1 Answers1

2

The attribute to use is is data-reflex-root not data-reflex_root.

See https://docs.stimulusreflex.com/morph-modes#scoping-page-morphs

Roland Studer
  • 4,315
  • 3
  • 27
  • 43