README

🎲 安装

* Na raiz do projeto crie uma pasta ***libs-frontend*** e dentro uma pasta ***forms***
* Copie o conteudo do arquivo formUI.php desse repositório e crie um arquivo com o mesmo nome
* Cole o codigo e siga as orientações de utilização abaixo:
* Exemplos: libs-frontend/forms/formUI.php

<!-- * 在项目根目录下创建一个名为 composer.json 的文件，内容如下

    {
        "name": "cenario-dev/form-ui"
    }

🛠️ 使用

使用 require 来导入库到您的页面。

    <?php
        require_once __DIR__.'/libs-frontend/forms/formUI.php';
    ?>

🛠️ Gitignore

添加到 gitignore

/libs-frontend
/libs-frontend/forms/*

现在只需按照 notion 文档进行操作

Notion formUI [https://bitter-ozraraptor-23c.notion.site/Componentes-70e4c7b5b0ab49a188792397b0c8262f]

设置

🛠️ 按钮链接 - 步骤 1

在步骤1中，如果您有一个只有在所有组件验证通过时才需要启用的链接，请将其添加到 class="disabled"（在 css 中配置以使链接禁用）并按照以下方式添加一个 id

    <div>
        <a id='btn-avancar-01' class='salvar-session disabled' href='#'>
            Avançar
        <a/>
    <div/>

如果您有两个链接（移动端和桌面端），请使用：btn-avancar-01 和 btn-avancar-02

🛠️ 验证返回

在步骤2中，在表单提交函数中，进行验证调用，将结果赋值给一个变量，然后使用条件语句锁定函数

    $(".salva-session").click(function(e) {
        e.preventDefault()

        const { isValidate, data } = inputValidateValue()
        console.log(data)

        if (!isValidate) {
            return
        }

        ...
        ...
        ...
    }

🛠️ README

由于我们的组件在 gitignore 中，如果将来有 git clone 操作，我们需要留下一个简短的描述。为此，请按照以下内容添加到 Readme.md 中：## 表单组件

在项目根目录下创建一个名为 libs-frontend/forms 的文件夹，在其中创建一个名为 formUI.php 的文件

进入以下仓库，复制内容并粘贴到文件中

  https://git-cenario.jelastic.saveincloud.net:4848/gabriel.xavier/form-validation-cenario/-/blob/master/formUI.php

在页面上导入组件

  require_once __DIR__.'/libs-frontend/forms/formUI.php';

CEP 验证

当您的表单中有 CEP 类型的输入时，在提交函数中添加对验证函数的调用，将 CEP 的 id 作为参数传递

    const cep = document.getElementById('strCep').value

    let isValidForm = undefined

    if (!cep) {
        isValidForm = inputValidateValue('strCep')
    } else {
        isValidForm = inputValidateValue()
    }
    
    if (!isValidForm.isValidate) {
        return
    }

场景 / 表单验证

维护者

详细信息