bootstrap modal does not show,only showing backdrop - ruby-on-rails

Question

I have posted this before but no one has reply me on my problem. However, after trying for few days. I encountered something funny.
My View Code
<% provide(:title, "Log in") %>
<div class="center jumbotron">
<h1> Kaching </h1>
<div class = "row" >
<div class="col-md-6 col-md-offset-3">
<%= form_for(:session, url: login_path) do |f| %>
<%= f.label :logID, "Log ID" %>
<%= f.text_field :logID %>
<%= f.label :password %>
<%= f.password_field :password, class: 'form-control' %>
<%= f.submit "Log In", class:"btn btn-primary" %>
<% end %>
</div>
</div>
</div>
<!-- Trigger the modal with a button -->
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>
<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Modal Header</h4>
</div>
<div class="modal-body">
<p>Some text in the modal.</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(window).load(function(){
$('#myModal').modal('show');
});
</script>
When i include the code, the modal box will appear when i load the page. However, my modal still will not appear when i press the button. I do not understand why. It will only work when i include bootstrap.js in my /assets/javascripts folder. However, this affects my tab that i implement on my other page. I try loading just the bootstrap-modal.js file, but it did not work also. Please guide me on this.
Thanks