PHP not working with a submit button in a form with Jquery

Question

I've set up a form with submit buttons to do a vote. The data will be stored in the database with php. To prevent spamming I searched for a jquery option to disable the buttons for a certain time. Unfortunately it is not working in a form. For exmaple, if I remove the form around the buttons it works fine but because I have to store the value's of the buttons I need to have the form attribute. What happens now is that AND my form is not handling the php code above (I did not put in the code for that) and the disable button function is not working (the button is disabled for like 1sec instead of what it suppose to be).

    <div class="row">
        <form name="stemmen" id="formstemmen" action="stemmensofeed.php" method="post">

        <div class="col-xs-12 col-sm-3 col-md-2 col-lg-1" style="margin-bottom: 10px;">

            <?php if (!empty($answer1)) { echo '<input type="submit" id="wordpress" class="btn btn-primary" name="wordpress" value='.$answer1.'>'; } ?>

        </div>
        <div class="col-xs-12 col-sm-3 col-md-2 col-lg-1" style="margin-bottom: 10px;">

            <?php if (!empty($answer2)) { echo '<input type="submit" class="btn btn-primary" name="laravel" value='.$answer2.'>'; } ?>

        </div>
        <div class="col-xs-12 col-sm-3 col-md-2 col-lg-1" style="margin-bottom: 10px;">

            <?php if (!empty($answer3)) { echo '<input type="submit" class="btn btn-primary" name="html" value='.$answer3.'>'; } ?>

        </div>

        <div class="col-xs-12 col-sm-3 col-md-2 col-lg-1" style="margin-bottom: 10px;">

            <?php if (!empty($answer4)) { echo '<input type="submit" class="btn btn-primary" name="css" value='.$answer4.'>'; } ?>

         </div>

        <div class="col-xs-12 col-sm-3 col-md-2 col-lg-1" style="margin-bottom: 10px;">

            <?php if (!empty($answer5)) { echo '<input type="submit" class="btn btn-primary" name="bootstrap" value='.$answer5.'>'; } ?>

        </div>

        </form>



    </div>


    <!-- jQuery 2.2.0 -->
    <script src="admin/plugins/jQuery/jQuery-2.2.0.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="bootstrap-sass/assets/javascripts/bootstrap.js"></script>
<script>
    $('input#wordpress').click(function() {
    var aaa =  $(this);
    aaa.prop('disabled', true);
    setTimeout(function() {
    aaa.prop('disabled', false);
    }, 3000);
    });
</script>

I am not a expert at javascript and jquery, so is there someone who can help me out with this?

A fiddle from the orginal code http://jsfiddle.net/jhNcM/ = the expected result (+ handle php code from form).

EDIT

I've managed to get the disable button working, Thanks to @Koustav Ray, by this code

$('input#wordpress').click(function(e) { //added e
    e.preventDefault(); //added this
    var aaa =  $(this);
    aaa.prop('disabled', true);
    setTimeout(function() {
    aaa.prop('disabled', false);
    }, 3000);
    });

Unfortunately the form will now not handle the php code.. Please help with this matter!

Answer 1

 $('input#wordpress').click(function(e) {
    e.preventDefault();
    var aaa =  $(this);
    aaa.prop('disabled', true);
    setTimeout(function() {
    aaa.prop('disabled', false);
    }, 3000);
    });

This should do it..you are disabling this for 3 seconds though.. Consider @Nergal's answer and also try ajax for submitting the form after this..