jQuery/Bootsrap -modal opening multiple times.

<div class="modal fade" id="basicModal" tabindex="-1" role="dialog" aria-labelledby="basicModal" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times</button>
            <h4 class="modal-title" id="myModalLabel">Modal title</h4>
            </div>
            <div class="modal-body">
                    <div id="mybox"></div>
            </div>
    </div>
  </div>
</div>
<a href="#" class="btn btn-lg btn-success js-navbutton"
   data-toggle="modal" data-url="logistiikka"
   data-target="#basicModal" value="Update">Logistiikka</a>
<a href="#" class="btn btn-lg btn-success js-navbutton"
   data-toggle="modal" data-url="logistiikka/logistiikka-nyt"
   data-target="#basicModal" value="Update">Logistiikka nyt</a>

$( document ).ready(function() {
    //console.log( "ready!" );
    $( ".js-navbutton" ).click( function() {
      //alert( $( this ).data('url') );      
      var dataurl = $( this ).data('url');
          var request = $.ajax({
            url: "http://localhost:8888/virtuaaliturku/" + dataurl,
            type: "GET",      
            dataType: "html"
          });
          request.done(function(msg) {
            $("#mybox").html(msg);      
          });
          request.fail(function(jqXHR, textStatus) {
            alert( "Request failed: " + textStatus );
          });
      //prevent.default();
      //return false;
    });
});