Uchsun
Uchsun

Reputation: 361

Jquery Validation Not Workng

usually I've had success to install Jquery validation on My HTML. BUt now, I Confuses with validation that not working well.

This the HTML script

 <table border="0" align="center">
           <form method="post" action="undian.php" id="FORM_UNDIAN">

          <tr> 
           <td>Nama :</td>
           <td><input type="text" name="NAMA" placeholder="Nama" class="inputs" /></td>
           </tr>
           <tr>
             <td>Email :</td>
             <td><input type="text" name="EMAIL" placeholder="Email" class="inputs" /></td>
           </tr>
           <tr>
             <td>Kota  :</td>
             <td>
             <div class="ui-widget">

                 <input type="text" name="KOTA" placeholder="Kota" id="tags" class="inputs" />
             </div><!--end of ui-widget-->

              </td>
           </tr>
           <tr>
             <td colspan="2" align="right"> <input type="submit" name="OKE" value="Submit" id="submit1" /></td>
          </tr>
          </table>

And the js script is like this

<script src="js/jquery-1.9.1.js"></script>
<script src="js/jquery-validate-1.10.0.js"></script>
<script>
    $(function(){
        $("#FORM_UNDIAN").validate({
            rules: 
               {
                 NAMA: 
                 {
                    required: true
                 },
                 EMAIL: 
                {
                    required: true,
                    email : true
                },
                 KOTA:
                 {
                   required: true
                 }

              },
            messages: {
                NAMA: 
                {
                    required: "Nama belum terisi"
                },
                EMAIL: 
                {
                    required: "Email  belum terisi",
                    email : "Format email belum benar"
                },

               KOTA:
               {
                   required: "Kota belum dipilih"
               }

            }
        })
    });
    </script>

Can you help me to tell the mistake of on my script?

Im very appreciated your Answer.

Thanks

Upvotes: 0

Views: 133

Answers (1)

Arun P Johny
Arun P Johny

Reputation: 388316

Your html is invalid, table cannot have form as a child, so make the form as the parent of table

<form method="post" action="undian.php" id="FORM_UNDIAN">
    <table border="0" align="center">
        <tr>
            <td>Nama :</td>
            <td>
                <input type="text" name="NAMA" placeholder="Nama" class="inputs" />
            </td>
        </tr>
        <tr>
            <td>Email :</td>
            <td>
                <input type="text" name="EMAIL" placeholder="Email" class="inputs" />
            </td>
        </tr>
        <tr>
            <td>Kota :</td>
            <td>
                <div class="ui-widget">
                    <input type="text" name="KOTA" placeholder="Kota" id="tags" class="inputs" />
                </div>
                <!--end of ui-widget-->
            </td>
        </tr>
        <tr>
            <td colspan="2" align="right">
                <input type="submit" name="OKE" value="Submit" id="submit1" />
            </td>
        </tr>
    </table>
</form>

Demo: Fiddle

Look at your html the input elements are not within the form element

Upvotes: 1

Related Questions