首页 > 解决方案 > validate fields with bootstrap 5 in a livewire modal

问题描述

I have bought the vuexy laravel html template which includes form validation, but when implementing it in a modal it doesn't work, is there any way for it to work or do I have to use laravel validation? I leave the code

<form class="needs-validation" novalidate>
    <div class="form-group">
        <label class="form-label" for="basic-addon-name">Name</label>

        <input type="text" id="basic-addon-name" class="form-control" placeholder="Name" aria-label="Name"
            aria-describedby="basic-addon-name" required />
        <div class="valid-feedback">Looks good!</div>
        <div class="invalid-feedback">Please enter your name.</div>
    </div>
    <div class="form-group">
        <label class="form-label" for="basic-default-email1">Email</label>
        <input type="email" id="basic-default-email1" class="form-control" placeholder="john.doe@email.com"
            aria-label="john.doe@email.com" required />
        <div class="valid-feedback">Looks good!</div>
        <div class="invalid-feedback">Please enter a valid email</div>
    </div>
    <div class="form-group">
        <label class="form-label" for="basic-default-password1">Password</label>
        <input type="password" id="basic-default-password1" class="form-control"
            placeholder="&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" required />
        <div class="valid-feedback">Looks good!</div>
        <div class="invalid-feedback">Please enter your password.</div>
    </div>
    <div class="form-group">
        <label for="select-country1">Country</label>
        <select class="form-control" id="select-country1" required>
            <option value="">Select Country</option>
            <option value="usa">USA</option>
            <option value="uk">UK</option>
            <option value="france">France</option>
            <option value="australia">Australia</option>
            <option value="spain">Spain</option>
        </select>
        <div class="valid-feedback">Looks good!</div>
        <div class="invalid-feedback">Please select your country</div>
    </div>
    <div class="row">
        <div class="col-12">
            <button type="submit" class="btn btn-primary">Submit</button>
        </div>
    </div>
</form>
          

标签: php

解决方案


推荐阅读