HTML5 validation and modal window - can't get them to work together [on hold]

HTML5 validation and modal window - can't get them to work together [on hold]

I have a simple form, and lean.Modal jQuery script for displaying form in
pop-up window. Now I need to apply validation in this form. The problem
is: if I enable html5 validation like this:
<input type="text" id="first_name" class="txtfield" required
x-moz-errormessage="Please enter your name here" >
when I press "Submit" without filling any data in form, modal window
closed and no data send because (as I think) form has validation errors.
Without validation when I press submit all data are send successfully and
modal window closed (Submit button are the closed button too).
If I disable closed button (remove modal_close html class from button)
validation works fine and data are send, but now I can't close modal
window at all.
Full form:
<div id="loginmodal-2" style="display:none;">
<h1>Simple form</h1>
<form id="loginform-2" >
<label for="first_name">Name: * </label>
<input type="text" name="first_name" id="first_name"
class="txtfield" required x-moz-errormessage="Please enter your name
here" tabindex="10">
<label for="telephone">Phone: * </label>
<input type="text" name="telephone" id="telephone" class="txtfield"
tabindex="20">
<div class="center"><input type="submit" id="loginbtn"
class="hidemodal-2" value="Submit" tabindex="30"></div>
</form>
</div>
And modal:
<script type="text/javascript">
$(function(){
$('#modaltrigger-2').leanModal({ top: 50, overlay: 0.45, closeButton:
".hidemodal-2" });
});
</script>
Lean.Modal script: http://pastebin.com/9JT04nZi
Realy need some help. Thank you in advance. :o)