lambda-fairy / maud

:pencil: Compile-time HTML templates for Rust
https://maud.lambda.xyz
Apache License 2.0
1.98k stars 132 forks source link

Struggling with optional attributes #429

Open Enanimate opened 1 month ago

Enanimate commented 1 month ago

Hey, I've been having trouble all day trying to do anything with buttons outside of making them appear on the webpage. I'm trying to understand everything I need to do in a function in order to check if an option within a selector has been checked to then direct my CSS a different way. I understand the CSS side of it but i just can't get anything relating to that to work in Maud.

So far I've tried everything in the Maud book on the site and gotten nowhere, for example: `html! { p title=[Some("Good password")] { "Correct horse" }

@let value = Some(42);
input value=[value];

@let title: Option<&str> = None;
p title=[title] { "Battery staple" }

}` Just shows me "Correct horse", a box for input, and then "Battery staple" no matter if I put anything in the input or not so I can't seem to figure out how to use it. I'm fairly new to Rust and just don't understand what I need to do to get this working. Thanks in advance to anyone kind enough to give me a bit of a hand in finally learning this part, and apologies if this isn't the right place to ask this is my first time asking my own question on any of this.

TLDR: How do I check if a button has been pressed to then bring into some if then logic.

Araozu commented 4 weeks ago

TLDR: How do I check if a button has been pressed to then bring into some if then logic.

It looks like you want to check if/when a button is pressed in the client, and then render some other html, like React/Vue/\. That is not how Maud works.

Maud simply generates html code in the backend. Nothing more. It simply generates a String, and you send it to the front-end, which renders it. It does not add any interactivity/reactivity like JS frameworks. The if/then logic you mentioned is run once in the backend, and never again.

If you want interactivity/reactivity in the client, while using Maud, you can use htmx, AlpineJS or Hyperscript. You'd write the code for those libraries in your Maud templates, and then those libraries will run in the client, and provide interactivity/reactivity similar to Svelte/Angular/\.

If what you want is to write the equivalent of a React app, but in Rust, check out Leptos or Dioxus. Those are full-stack frameworks that do what you want to do.