Can there be a code example for pop-up form verification ？ about ant-design-blazor

[HuaFangYun]

就是弹出窗口+表单示例（用户名和密码验证的）自己结合看下。

[icetech233]

就是弹出窗口+表单示例（用户名和密码验证的）自己结合看下。

modal的 onok没法触发

[HuaFangYun]

你没有认真看示例程序。再回头看看

[icetech233]

你没有认真看示例程序。再回头看看

例子里面没有写， model 和 form分开了

[HuaFangYun]

你看表单 用户名和密码 验证的第一个就行了

[HuaFangYun]

<Modal Title="成本更新"
       @bind-Visible="@_VisibleCost" Footer="null">
    <Form Model="@contractCostViewModel"
          LabelCol="new ColLayoutParam { Span =6 }"
          WrapperCol="new ColLayoutParam { Span = 18 }"
          OnFinish="OnCostFinish"
          OnFinishFailed="OnCostFinishFailed">
        <GridRow>
            <GridCol Span="24">
                <FormItem Label="成本">
                    <Space>
                        <SpaceItem> <AntDesign.InputNumber @bind-Value="@context.Cost" Min="0" Precision="2" Style="width:200px;color:red;"></AntDesign.InputNumber></SpaceItem>
                        <SpaceItem>元</SpaceItem>
                    </Space>
                </FormItem>
            </GridCol>
        </GridRow>

        <div class="ant-modal-footer" style="padding-right:0px;">
            <div>
                <Button Type="@ButtonType.Primary" HtmlType="submit">
                    提交
                </Button>
                &nbsp;&nbsp;
                <Button Type="@ButtonType.Default" @onclick="()=>{_VisibleCost=false;}">
                    取消
                </Button>
            </div>
        </div>
    </Form>
</Modal>

代码给你了，这个可以给关闭了。后台代码你自己看下官网示例组织 下即可

[khushinj]

能不能有弹窗表单校验的代码例子？

// 表单验证函数
function validateForm() {
var name = document.getElementById("name").value;
var email = document.getElementById("email").value;
var message = document.getElementById("message").value;

// 检查字段是否为空
if (name == "" || email == "" || message == "") {
    alert("请填写所有字段。");
    return false;
}

// 验证电子邮件格式
var emailRegex = /^\S+@\S+\.\S+$/;
if (!emailRegex.test(email)) {
    alert("请输入有效的电子邮件地址。");
    return false;
}

// 所有验证通过
return true;

}

// 显示弹出表单的函数
function showForm() {
document.getElementById("popupForm").style.display = "block";
}

// 隐藏弹出表单的函数
function hideForm() {
document.getElementById("popupForm").style.display = "none";
}

[ElderJames]

Hello @khushinj , your code is not for blazor

[icetech233]

<Modal Title="成本更新"
       @bind-Visible="@_VisibleCost" Footer="null">
    <Form Model="@contractCostViewModel"
          LabelCol="new ColLayoutParam { Span =6 }"
          WrapperCol="new ColLayoutParam { Span = 18 }"
          OnFinish="OnCostFinish"
          OnFinishFailed="OnCostFinishFailed">
        <GridRow>
            <GridCol Span="24">
                <FormItem Label="成本">
                    <Space>
                        <SpaceItem> <AntDesign.InputNumber @bind-Value="@context.Cost" Min="0" Precision="2" Style="width:200px;color:red;"></AntDesign.InputNumber></SpaceItem>
                        <SpaceItem>元</SpaceItem>
                    </Space>
                </FormItem>
            </GridCol>
        </GridRow>

        <div class="ant-modal-footer" style="padding-right:0px;">
            <div>
                <Button Type="@ButtonType.Primary" HtmlType="submit">
                    提交
                </Button>
                &nbsp;&nbsp;
                <Button Type="@ButtonType.Default" @onclick="()=>{_VisibleCost=false;}">
                    取消
                </Button>
            </div>
        </div>
    </Form>
</Modal>

代码给你了，这个可以给关闭了。后台代码你自己看下官网示例组织 下即可

Footer="null" ? 可以制空啊