Struct InputProps 

pub struct InputProps {

    pub type: String,
    pub value: String,
    pub uncontrolled: bool,
    pub placeholder: String,
    pub min: Option<String>,
    pub max: Option<String>,
    pub autocomplete: Option<String>,
    pub autocorrect: Option<String>,
    pub step: Option<String>,
    pub accept: Option<String>,
    pub list: Option<String>,
    pub size: Size,
    pub disabled: bool,
    pub readonly: bool,
    pub oninput: Option<EventHandler<FormEvent>>,
    pub onchange: Option<EventHandler<FormEvent>>,
    pub onfocus: Option<EventHandler<FocusEvent>>,
    pub onblur: Option<EventHandler<FocusEvent>>,
    pub onkeydown: Option<EventHandler<KeyboardEvent>>,
    pub onkeyup: Option<EventHandler<KeyboardEvent>>,
    pub class: String,
    /* private fields */
}

Bootstrap Input component.

Bootstrap HTML → Dioxus

HTML	Dioxus
<input class="form-control" type="text">	Input { r#type: "text" }
<input class="form-control form-control-sm" type="email">	Input { r#type: "email", size: Size::Sm }
<input class="form-control" disabled>	Input { disabled: true }
<input class="form-control" list="opts">	Input { list: "opts" }

Bind a <datalist> for autocomplete with list, and observe focus with onfocus / onblur:

rsx! {
    Input { r#type: "text", value: "hello", placeholder: "Enter text" }
    Input { r#type: "email", size: Size::Sm, oninput: move |evt| { /* handle */ } }
    Input { r#type: "password", disabled: true }
    Input {
        list: "icon-options",
        onfocus: move |_| { /* open suggestions */ },
        onblur: move |_| { /* close suggestions */ },
    }
    datalist { id: "icon-options",
        option { value: "star" }
        option { value: "heart" }
    }
}

Fields

type: String

Input type (text, email, password, number, etc.).

value: String

Current value.

uncontrolled: bool

When true, the value attribute is omitted so the field is uncontrolled: the DOM keeps whatever value the user or an external script writes, instead of Dioxus forcing it back to value on every render. Use for a field another script streams into (e.g. a live transcript box).

placeholder: String

Placeholder text.

min: Option<String>

Minimum value for numeric/date inputs.

max: Option<String>

Maximum value for numeric/date inputs.

autocomplete: Option<String>

Browser autocomplete hint.

autocorrect: Option<String>

Safari’s autocorrect hint (on / off). Not a GlobalAttributes attribute, so it needs its own prop rather than riding ..attributes — the same reason list has one.

step: Option<String>

Step granularity for numeric and date inputs. The typed sibling of min/max, which are already props: a number field that constrains its range but not its increment is only two-thirds typed.

accept: Option<String>

Which file types a type="file" input will accept.

list: Option<String>

Datalist id to bind for autocomplete (rendered as the input list attribute). list is not a GlobalAttributes attribute, so it needs its own typed prop rather than riding through ..attributes.

size: Size

Input size.

disabled: bool

Disabled state.

readonly: bool

Readonly state.

oninput: Option<EventHandler<FormEvent>>

Input event handler.

onchange: Option<EventHandler<FormEvent>>

Change event handler.

onfocus: Option<EventHandler<FocusEvent>>

Focus event handler.

onblur: Option<EventHandler<FocusEvent>>

Blur event handler.

onkeydown: Option<EventHandler<KeyboardEvent>>

Key down event handler.

onkeyup: Option<EventHandler<KeyboardEvent>>

Key up event handler.

class: String

Additional CSS classes.

Implementations

impl InputProps

pub fn builder() -> InputPropsBuilder<((), (), (), (), (), (), (), (), (), (), (), (), (), (), (), (), (), (), (), (), (), ())>

Create a builder for building InputProps. On the builder, call .r#type(...)(optional), .value(...)(optional), .uncontrolled(...)(optional), .placeholder(...)(optional), .min(...)(optional), .max(...)(optional), .autocomplete(...)(optional), .autocorrect(...)(optional), .step(...)(optional), .accept(...)(optional), .list(...)(optional), .size(...)(optional), .disabled(...)(optional), .readonly(...)(optional), .oninput(...)(optional), .onchange(...)(optional), .onfocus(...)(optional), .onblur(...)(optional), .onkeydown(...)(optional), .onkeyup(...)(optional), .class(...)(optional), .attributes(...)(optional) to set the values of the fields. Finally, call .build() to create the instance of InputProps.

Trait Implementations

impl Clone for InputProps

fn clone(&self) -> InputProps

Returns a duplicate of the value.

fn clone_from(&mut self, source: &Self)

Performs copy-assignment from source.

impl PartialEq for InputProps

fn eq(&self, other: &InputProps) -> bool

Equality operator ==.

fn ne(&self, other: &Rhs) -> bool

Inequality operator !=.

impl Properties for InputProps

where Self: Clone,

type Builder = InputPropsBuilder<((), (), (), (), (), (), (), (), (), (), (), (), (), (), (), (), (), (), (), (), (), ())>

The type of the builder for this component. Used to create “in-progress” versions of the props.

fn builder() -> Self::Builder

Create a builder for this component.

fn memoize(&mut self, new: &Self) -> bool

Make the old props equal to the new props. Return if the props were equal and should be memoized.

fn into_vcomponent<M>( self, render_fn: impl ComponentFunction<Self, M>, ) -> VComponent

where M: 'static,

Create a component from the props.

impl StructuralPartialEq for InputProps