Function leptos_router::ActionForm

pub fn ActionForm<ServFn>(props: ActionFormProps<ServFn>) -> impl IntoView
where
    ServFn: DeserializeOwned + ServerFn<InputEncoding = PostUrl> + 'static,
    <<ServFn::Client as Client<ServFn::Error>>::Request as ClientReq<ServFn::Error>>::FormData: From<FormData>,

Automatically turns a server Action into an HTML form progressively enhanced to use client-side routing.

Encoding

Note: <ActionForm/> only works with server functions that use the default Url encoding. This is to ensure that <ActionForm/> works correctly both before and after WASM has loaded.

Complex Inputs

Server function arguments that are structs with nested serializable fields should make use of indexing notation of serde_qs.

#[derive(serde::Serialize, serde::Deserialize, Debug, Clone)]
struct HeftyData {
    first_name: String,
    last_name: String,
}

#[component]
fn ComplexInput() -> impl IntoView {
    let submit = Action::<VeryImportantFn, _>::server();

    view! {
      <ActionForm action=submit>
        <input type="text" name="hefty_arg[first_name]" value="leptos"/>
        <input
          type="text"
          name="hefty_arg[last_name]"
          value="closures-everywhere"
        />
        <input type="submit"/>
      </ActionForm>
    }
}

#[server]
async fn very_important_fn(
    hefty_arg: HeftyData,
) -> Result<(), ServerFnError> {
    assert_eq!(hefty_arg.first_name.as_str(), "leptos");
    assert_eq!(hefty_arg.last_name.as_str(), "closures-everywhere");
    Ok(())
}

Required Props

• action: Action<ServFn, Result<ServFn::Output, ServerFnError<ServFn::Error>>>
  • The action from which to build the form. This should include a URL, which can be generated by default using create_server_action or added manually using using_server_fn.
• children: Children
  • Component children; should include the HTML of the form elements.

Optional Props

• id: impl Into<AttributeValue>
  • Sets the id attribute on the underlying <form> tag
• class: impl Into<AttributeValue>
  • Sets the class attribute on the underlying <form> tag, making it easier to style.
• node_ref: NodeRef<html::Form>
  • A NodeRef in which the <form> element should be stored.
• attributes: [Vec<(&'static str, Attribute)>]
  • Arbitrary attributes to add to the <form>