Submit photo to database from Image Gallery in Rails - ruby-on-rails

Question

I have an images index page which displays an entire album of photos from the User's Facebook profile in a uniform square grid. To get the square grid shape, I had to use some css which crops a little bit of the image from the sides (essentially a thumbnail).
I want the users to be able to click on an image so that a modal comes up that shows the full image, which they can then crop themselves.
Most importantly, I'm wondering how to make it so the modal that pops up is like a form, where you select the part that you want cropped and then click submit, and the photo and crop parameters get saved to the database
Here is what I have so far:
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Submit</button>
</div>
</div>
</div>
</div>
<% #profile = #graph.get_object("me") %>
<%= #profile["name"] %><br>
<%= link_to 'Sign Out', sign_out_path, method: :delete %>
<br>
<% #albums = #graph.get_connections("me", "albums?fields=name,photos{name, images{source}}") %>
<% #albums.at(3)["photos"]["data"].each do |data| %>
<div id="<%= data["id"] %>" class="myImages" data-toggle="modal" data-target="#myModal">
<%= image_tag data["images"].first["source"] %>
</div>
<% end %>
<script>
$(document).ready(function() {
$(".myImages").click(function (e){
e.preventDefault();
$(".modal-body").html($(this).html());
});
});
</script>