CODEWITHSUNDEEP
jquerytwitter-bootstrapjquery-validatebootstrap-modal
Surya Matadewa
Surya Matadewa

Reputation: 1027

Can't validate input in modal bootstrap

hi i want to validated input in bootstrap modal
usually i'm using something like this

<input type="text" class="form-control" id="kode" name="kode" placeholder="Kode" required />

or using jquery validating plugins like this

$("#formTest").validate({
    rules: {
        kode: "required"
    }
});

but none of them working on input inside bootstrap modal
where i'm missing?

@update 

<button class="btn btn-primary form-button" id="addNew">Tambah Produk</button> //button to show modal

<form method="post" id="formTest" action="">
    Username : <input type="text" id="username" class="form-control" name="username" required>
    <button class="btn btn-primary" type="submit"></button
</form>

<div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
          <h4 class="modal-title">Modal Default</h4>
        </div>
        <div class="modal-body">

            <form method="post" id="formProduk" action="{{ URL::route('produk.post') }}">
                <div class="row form-group ">
                    <label for="kode_barang" class="control-label col-sm-3">Kode Barang<span class="required">*</span></label>
                    <div class="col-sm-9">
                      <input type="text" class="form-control" id="kode_barang" name="kode_barang" placeholder="Kode Barang" required />
                    </div>
                </div>

                <button type="button" class="btn btn-primary" type="submit" id="saveData">Save</button>
            </form>
        </div>
      </div>
    </div>
</div>

in my code above, i have 2 forms formTest and formProduk
i don't have problem to validate in formTest with just required property in input

meanwhile in formProduk
i already using required in input id=kode_barang
but after i click button save
it's just parsing without validate to url produk.post

Upvotes: 0

Views: 1224

Answers (1)

Tomanow
Tomanow

Reputation: 7357

Try something like this:

$('.modal').on('shown.bs.modal', function () {
    $("#formTest").unbind().validate({
        rules: {
            kode: "required"
        }
    });
});

Upvotes: 1

Related Questions