How to update value from HTML input or Form

[saroar]

func modalFormLogin() -> Node {
    // how do i update my swift model values from input
    var emailLoginInput = EmailLoginInput(name: "", email: "")
    return [
        .div(
            attributes: [
                .class("modal fade"),
                .id("exampleModalToggle"),
                .ariaLabelledby("exampleModalToggleLabel"),
                .tabindex(-1),
                .init("style", "display: none"),
                .ariaHidden(.true),
            ],
            .div(
                attributes: [.class("modal-dialog modal-dialog-centered")],
                .div(
                    attributes: [.class("modal-content")],
                    .div(
                        attributes: [.class("modal-header")],
                        .h1(
                            attributes: [
                                .class("modal-title fs-5"),
                                .id("exampleModalToggleLabel"),
                            ], "Login"
                        ),
                        .button(
                            attributes: [
                                .type(.button),
                                .class("btn-close"),
                                .init("data-bs-dismiss", "modal"),
                                .ariaLabel("Close"),
                            ]
                        )
                    ),
                    .div(
                        attributes: [.class("modal-body")],
                        .form(
                            .div(
                                attributes: [.class("mb-3")],
                                .label(
                                    attributes: [
                                        .for("name"),
                                        .class("col-form-label"),
                                    ], "Name:"
                                ),
                                .input(
                                    attributes: [
                                        .type(.text), // HERE update my value
                                        .class("form-control"),
                                        .id("name"),
                                    ]
                                )
                            ),
                            .div(
                                attributes: [.class("mb-3")],
                                .label(
                                    attributes: [
                                        .for("message-text"),
                                        .class("col-form-label"),
                                    ], "Email:"
                                ),
                                .input(
                                    attributes: [
                                        .type(.text),
                                        .class("form-control"),
                                        .id("email"),
                                    ]
                                )
                            )
                        )
                    ),
                    .div(
                        attributes: [.class("modal-footer")],
                        .button(
                            attributes: [
                                .class("btn btn-primary"),
                                .init("data-bs-target", ###"#exampleModalToggle2"###),
                                .init("data-bs-toggle", "modal"),
                            ], "Sned 👉🏼"
                        )
                    )
                )
            )
        ),
        .div(
            attributes: [
                .class("modal fade"),
                .id("exampleModalToggle2"),
                .ariaLabelledby("exampleModalToggleLabel2"),
                .tabindex(-1),
                .init("style", "display: none"),
                .ariaHidden(.true),
            ],
            .div(
                attributes: [.class("modal-dialog modal-dialog-centered")],
                .div(
                    attributes: [.class("modal-content")],
                    .div(
                        attributes: [.class("modal-header")],
                        .h1(
                            attributes: [
                                .class("modal-title fs-5"),
                                .id("exampleModalToggleLabel2"),
                            ], "OTP Verification"
                        ),
                        .button(
                            attributes: [
                                .type(.button),
                                .class("btn-close"),
                                .init("data-bs-dismiss", "modal"),
                                .ariaLabel("Close"),
                            ]
                        )
                    ),
                    .div(
                        attributes: [.class("modal-body")],
                        .form(
                            .div(
                                attributes: [.class("mb-3")],
                                .label(
                                    attributes: [
                                        .for("otp"),
                                        .class("col-form-label"),
                                    ], "Input Your One Time Passwird"
                                ),
                                .input(
                                    attributes: [
                                        .type(.text),
                                        .class("form-control"),
                                        .id("otp-name"),
                                    ]
                                )
                            )
                        )
                    ),
                    .div(
                        attributes: [.class("modal-footer")],
                        .button(
                            attributes: [
                                .class("btn btn-primary"),
                                .init("data-bs-target", ###"no more modal"###),
                                .init("data-bs-toggle", "modal"),
                            ], "Verify"
                        )
                    )
                )
            )
        ),
        .a(
            attributes: [
                .class("btn btn-primary"),
                .init("data-bs-toggle", "modal"),
                .href(###"#exampleModalToggle"###),
                .init("role", "button"),
            ], "Login or Register"
        )

    ]
}

// when I like send button I wanted to send data to my RouteHander for send request
//note validation input is very important

full code can be see here:
https://gist.github.com/saroar/c8c8b4721338677cfebe9637d4340d40

[mbrandonw]

Hi @saroar, I responded to you on Slack, but just to have a record of that here: this is not a problem our HTML library can solve. You cannot update a server model directly from inside an HTML form. Instead, the form is submitted to an endpoint on the server, via a POST request, and the server handles that data to update the model on the backend.