I have a form with multiple input and drop down fields. I need confirmation before submitting. So, I have added dialogue box to confirm form submit by `Submit` or `Cancel` and I've prevented default submit. 

Now, When I use custom functions to validate input using `jquery` not working. 

Even when I make input field like this:

```
<form class="form-horizontal" action="{{URL::to('quick/make/reservation')}}" method="post" role="form" id="confirm_request">

    <input type="text" name="contact" id="contact">
    <span id="error">
    </span>
    <a class="btn btn-default" data-toggle="modal" data-target="#confirm-verify" id="done">Done</a>
</form>
<div class="modal fade bd-example-modal-sm" id="confirm-verify" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
    <div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
        <p class="text-left bold-text">Are you sure you want to Complete Reservation ?</p>
        </div>
        <div class="modal-body">
            <a type="button" class="btn btn-xs btn-danger btn-ok btn-sm" onclick="event.preventDefault();
                    document.getElementById('confirm_request').submit();" style="cursor: pointer;">Submit</a>
            <a type="button" class="btn btn-xs btn-primary btn-sm" data-dismiss="modal">Cancel</a>
        </div>
    </div>
    </div>
</div>

```

Empty data has been submitted. I'm quite new to `JQuery`.

```
$('#done').click(function(event){
        var is_filled = true;
        var value = $('#contact').val();
        if(!value){
            is_filled = false;
        }

        if(!is_filled){
            event.preventDefault();
            $('#error').append('<strong>The field is required </strong>')
        }

    });

```

Anyone have idea, what I am doing wrong ?