CodeIgniter validation with javascript / jquery

Question

the script inserts data. I am using javascript and bootstrap for validation , but I feel something is missing . I was confused when I enter the value in the text box then there is a warning that the values ​​that I input already exists. What should I add to my script??

javascript :

<script type="text/javascript">
$(document).ready(function() {
    $('#defaultForm').formValidation({
        message: 'This value is not valid',
        icon: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },      

        fields: {
            id: {
                     row: '.col-md-3',
                        message: 'ID Tidak Valid',
                        validators: {
                        notEmpty: {
                            message: 'ID tidak boleh kosong'
                        }

                    }
                },
            }

    });
});

my view :

        <form id="defaultForm" method="post" enctype="multipart/form-data" action="<?php echo base_url(); ?>index.php/instrument/detailalat/save" class="form-horizontal form-pricing">
        <?php echo form_open_multipart('index.php/upload/do_upload');?> 

                <div class="form-group">
                    <label class=" col-md-2 control-label"><div align="left"> ID</div></label>
                    <div class="col-md-3">
                        <div class="required-field-block">
                            <input type="text" class="form-control" name="id" />
                                <div class="required-icon">
                                    <div class="text">*</div>
                                </div>
                        </div>
                    </div>
                </div>
</form>

Answer 1

Try this:

    jQuery(function($) {
    // Validation
    $("#register-form").validate({

        // Rules for form validation
        rules : {

            email : {
                required : true,
                email : true
            },
            password : {
                required : true,
                minlength : 6,
                maxlength : 20
            },
            rpassword : {
                required : true,
                minlength : 6,
                maxlength : 20,
                equalTo : '#password'
            },
            firstname : {
                required : true
            },
            lastname : {
                required : true
            },
            phonenumber : {
                required : true
            }
        },

        // Messages for form validation
        messages : {

            email : {
                required : 'Please enter your email address',
                email : 'Please enter a VALID email address'
            },
            password : {
                required : 'Please enter your password'
            },
            rpassword : {
                required : 'Please enter your password one more time',
                equalTo : 'Please enter the same password as above'
            },
            firstname : {
                required : 'Please select your first name'
            },
            lastname : {
                required : 'Please select your last name'
            },
            phonenumber : {
                required : 'Please enter the phone number'
            }

        },


        // Do not change code below
    });

});