dioxus icon indicating copy to clipboard operation
dioxus copied to clipboard

oninput for forms isn't working (desktop)

Open jkelleyrtp opened this issue 2 years ago • 1 comments

Problem

onsubmit works as expected, but oninput is not working as expected (not returning all the values with the .values() method)

jkelleyrtp avatar Feb 09 '24 22:02 jkelleyrtp

This is also broken on the web renderer if the event originates from an element within the form instead of the form:

//! Forms
//!
//! Dioxus forms deviate slightly from html, automatically returning all named inputs
//! in the "values" field

use dioxus::prelude::*;
use std::collections::HashMap;

fn main() {
    launch(app);
}

fn app() -> Element {
    let mut values = use_signal(|| HashMap::new());
    rsx! {
        div {
            "{values:#?}"
            h1 { "Form" }
            form {
                oninput: move |ev| values.set(ev.values()),
                input {
                    r#type: "text",
                    name: "username",
                    oninput: move |ev| values.set(ev.values())
                }
                input { r#type: "text", name: "full-name" }
                input { r#type: "password", name: "password" }
                input { r#type: "radio", name: "color", value: "red" }
                input { r#type: "radio", name: "color", value: "blue" }
                button { r#type: "submit", value: "Submit", "Submit the form" }
            }
        }
    }
}

ealmloff avatar Feb 14 '24 17:02 ealmloff