Закрыть окно После подачи Формы

Question

У меня есть форма

<form name="thumbnail" action="<?php echo $_SERVER["PHP_SELF"];?>" method="post"> 
    <input type="hidden" name="x1" value="" id="x1" /> 
    <input type="hidden" name="y1" value="" id="y1" /> 
    <input type="hidden" name="x2" value="" id="x2" /> 
    <input type="hidden" name="y2" value="" id="y2" /> 
    <input type="hidden" name="w" value="" id="w" /> 
    <input type="hidden" name="h" value="" id="h" /> 
    <input type="submit" name="upload_thumbnail" value="Save Image" id="save_thumb"/> 
    <?php $_SESSION['image1'] = $thumb_image_name.$_SESSION['user_file_ext'];?> 
</form> 

Я хочу, чтобы закрыть эту форму после завершения этой функции

$(document).ready(function() { 

    $('#save_thumb').click(function() { 
     var x1 = $('#x1').val(); 
     var y1 = $('#y1').val(); 
     var x2 = $('#x2').val(); 
     var y2 = $('#y2').val(); 
     var w = $('#w').val(); 
     var h = $('#h').val(); 
     if(x1=="" || y1=="" || x2=="" || y2=="" || w=="" || h==""){ 
      alert("Please Select Area to Crop"); 
     }else{ 

     return true; 
     } 
    }); 


}); 

Проблема заключается в том, что если я ставлю window.close(); перед возвратом true; Окно закрывается, но форма не отправляется, и если я положил его после возврата true; то окно не будет закрыто.

Это не работает

$("thumbnail").submit(function() { 
    $.post($(this).attr('action'), $(this).serializeArray()); 
    window.close(); 
}); 

Это тоже не работает:

function closeSelf(){ 
     document.forms['thumbnail'].submit(); 
     window.close(); 
} 

<input type="submit" name="upload_thumbnail" value="Save Image" id="save_thumb" onclick="closeSelf();"/> 

Answer 1

Аякса представление формы может помочь вам. По щелчку вы отправляете форму и по завершении запроса ajax вы можете закрыть окно. Что-то вроде этого

$(document).ready(function() { 
    $('[name="thumbnail"]').submit(function() { 
     <Perform your validation here> 
     $.ajax({ 
       url: $('[name="thumbnail"]').attr('action'), 
       method: 'post', 
       data: $('[name="thumbnail"]').serialize(), 
       success: function (data, status) { 
       window.close(); 
       } 

     } 
    } 
} 

Answer 2

Попробуйте это:

$('[name="thumbnail"]').submit(function() { 
var x1 = $('#x1').val(); 
    var y1 = $('#y1').val(); 
    var x2 = $('#x2').val(); 
    var y2 = $('#y2').val(); 
    var w = $('#w').val(); 
    var h = $('#h').val(); 
    if(x1=="" || y1=="" || x2=="" || y2=="" || w=="" || h==""){ 
     alert("Please Select Area to Crop"); 
    }else{ 
     $.post($(this).attr('action'), $(this).serializeArray()); 
     window.close(); 
    } 
});