#How can I prevent form submission?

36 messages · Page 1 of 1 (latest)

whole vapor
#

Am I doing something wrong? I've been trying out SSR and I'm stuck on getting this form's onsubmit to trigger. I've tried with and without prevent_default and I'm not sure what else to try :/

form {
    class: "search",
    prevent_default: "onsubmit",
    onsubmit: move |event| {
        log::info!("submit");
        async move {
            if let Ok(data) = get_server_data().await {
                crates.set(Some(data));
            }
        }
    },
    input { r#type: "text", oninput: move |event| query.set(event.value.clone()) }
}
mint mulch
#

SSR just renders to pure HTML, it doesn't have any WASM interactivity so event handlers, state, etc is ignored

#

If you want to render on the server and resume on the client you can use fullstack instead

whole vapor
#

Ohh derp I'm really new at this

#

I'm using fullstack already with the template but I switched to FullstackRouterConfig if that's what you mean

#

Still same thing though, now I get ```[ERROR] dioxus_fullstack::router - Failed to parse uri: Route did not match:
Attempted Matches:

  1. Route 'Home' ('/') did not match:
    Found additional trailing segments: _trunk/ws
  2. Route 'Blog' ('/blog/:id') did not match:
    Static segment 'blog' did not match instead found '_trunk'```
mint mulch
#

How are you running the code?

#

Are you just building the web version with trunk?

#

That looks like trunk's hot reloading web socket which will not work

whole vapor
#

I did dx build --features web and cargo run --features ssr

#

That could be something else that error comes up every once in awhile, just on dev

mint mulch
#

If you look at your network tab in the browser, has your wasm loaded yet?

#

It can take a very long time in debug mode

whole vapor
#

Actually let me try waiting I did see the size slowly going up

mint mulch
#

For hot reloading you will need this:

cargo install --git https://github.com/ealmloff/dioxus --branch intigrate-collect-assets dioxus-cli
dx serve --hot-reload --platform fullstack
mint mulch
#

It applies some slightly more aggressive build settings on fullstack even in dev mode

#

A hello world app goes from ~40MB to ~2MB with that PR in debug mode

#

(It will still be much smaller in release mode)

whole vapor
#

Ooo that branch name sounds interesting

#

Running that gives me Serving project failed: I/O Error: No such file or directory (os error 2)

mint mulch
whole vapor
#

Yeah it's there and capitalized (that's a weird bug)

#

Does my dioxus version have to match that branch? I'm using the latest git

#

Also I'm on macos if that helps

mint mulch
#

I'm also on macos and it works locally for me

#

This branch has extra tracing:

cargo install --git https://github.com/ealmloff/dioxus --branch intigrate-collect-assets-tracing dioxus-cli
dx serve --hot-reload --platform fullstack
#

Or adding --skip-assets to the CLI will probably fix the issue

whole vapor
#

Yikes there's a lot of tracing 😱

#

Ugh after about a million lines of debug info I got the same error

#

I tried with that flag as well with the same result. Are you just using the template made by dx create?

#

Also I should mention the app runs fine with dx build and cargo run but the forms issue is present

whole vapor
#

Omg... so apparently prevent_default was the issue lol without it everything works

#

Well dx serve still gives me that error but cargo run looks like it's hot reloading