Preventing default for a button inside a form

[simhasrivatsa]

Say I have a button inside a form that opens a modal on click (using bootstrap).
On click of this button bootstrap listens to the event and opens the modal.
Also there is an ic-get-from attached to this button that gets a page from the server and populates a child element inside the modal.

<form>
--- some elements ---
<button              
data-target="#someModal"
data-toggle="modal"
ic-get-from="https://some-url"
ic-target="#someModalChildElement"
>

</button>
</form>


<div id="someModal"
  class="modal"
  tabindex="-1"
  role="dialog"
  aria-hidden="true"
>
<div id="someModalChildElement"></div>
</div>

The problem I face is that during/after ic-get-from request is complete -- or before the target is populated -the click event stops propogating. Bootstrap does not receive it and does not open the modal. I think this was prevented because a get request with a ic-target should not submit a form, as it could be an intermediate step.
But if I create a button as type="button", the event should not be stopped from propagating as it won't submit the form anyway.

<form>
--- some elements ---
<button   
type="button"         
data-target="#someModal"
data-toggle="modal"
ic-get-from="https://some-url"
ic-target="#someModalChildElement"
>

</button>
</form>

[1cg]

Hi There,

Can you give a simple example? We listen for events on the annotated element, so if a button causes a submit, it should work properly on a form.

[simhasrivatsa]

Hi @chg20 I have updated the description

[1cg]

The problem is that the button will trigger the form submit. Can you switch it to a div so that the form wont submit?

[simhasrivatsa]

@chg20 yeah this was a atleast a month ago and I switched it to an anchor tag. But if I make the button type="button" the form won't submit and intercooler should not stop event propagation in that case