开发者

Opa: Prevent Page Reload when Form Is Submitted

开发者 https://www.devze.com 2023-04-11 23:00 出处:网络
In Opa, how can I prevent a page reload when a form is submitted? When submit is pressed, I want to perform some client-side validation and only submit the form if validation passes.

In Opa, how can I prevent a page reload when a form is submitted? When submit is pressed, I want to perform some client-side validation and only submit the form if validation passes.

I'm working with this form:

<form onready={_ -> ready()} id=#form_id>
  <input type="submit" value="Submit" />
</form>

This function successfully logs its message on submit, but still reloads the page:

ready() : void =
  do ignore(Dom.bind(#form_id, {submit}, ( _ -> Log.notice("submit","submitted"))))

This function fails to log its message and reloads the page:

ready() : void =
  do ignore(Dom.bind_with_options(#form_id, {submit}, ( _ -> Log.notice("submit","submitted")), [{prevent_default}]))

I'm avoiding using WFormBuilder because I need fine grained control over the html of the form and the validation error messages (which did not seem lik开发者_Go百科e an option in WFormBuilder when I experimented with it).

Thanks for your help.


In the source of WFormBuilder, I found this attribute in its form html: options:onsubmit="prevent_default"

So snippet has the behavior I was looking for:

<form onready={_ -> ready()} id=#form_id options:onsubmit="prevent_default">
  <input type="submit" value="Submit" />
</form>

ready() : void =
  do ignore(Dom.bind(#form_id, {submit}, ( _ -> Log.notice("submit","submitted"))))
0

精彩评论

暂无评论...
验证码 换一张
取 消