DioxusLabs / DioxusLabs/dioxus

Progressively Enhanced Fullstack forms

Open
#1,996 1 comment 1 reaction 0 assignees View on GitHub
enhancement fullstack
Dominant language
Rust
Stars
39.1k
Forks
1.9k
Avg merge
4d 10h
Merged PRs (30d)
4

Description

## Specific Demand

It would be nice if dioxus provided a type safe form that works with the router and dioxus fullstack server functions.

## Implement Suggestion

```rust
#[derive(Variants)]
enum Options {
#[variant("first-option")]
First,
#[variant("second-option")]
Second,
}

#[derive(Form)]
struct FormData {
#[hint = "enter your username"]
username: String,
#[hint = "enter your password"]
password: String,
#[default = Option::Second]
dropdown: Options,
checkable: bool
}

#[server]
fn server(data: FormData) -> Result<()> {
todo!()
}

let data = use_form::();

// You can read form values easily before the form is submitted
let checkable_class = if data.read().checkable { "checked" } else { "unchecked" };

rsx! {
Form {
action: server,
input {
// You can spread fields to automatically add listeners
..data.username()
}
input {
// You can style and layout forms however you want to
class: "ring-1 ring-inset ring-gray-300",
..data.password()
}
select {
..data.dropdown()
}
}
}
```

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.