Вставка html-формы внутри скрипта

Question

Ниже приведен сценарий для удаления записей. И я попытался вставить форму ниже с переменной php, чтобы опубликовать это значение на одной странице. Но у меня нет идеи о том, как вставить его внутри моего скрипта. И скрипт в моей форме автоматически отправляется.

Я хочу выполнить форму после анимации.

После этой анимации

$(this).parents(".record").animate({ backgroundColor: "#fbc7c7" }, "fast") 
       .animate({ opacity: "hide" }, "slow"); 

Форма

echo' 
<form method="post" action="app_list2.php" id="dateForm" name="dateForm"> 
<div style="display:none;"> 
<input name="drop_1" type="hidden" value="'.$drop.'" style="background-color:blue;"><input name="tier_two" type="hidden" value="'.$tier_two.'"> 
<input type="submit" name="autosubmit"></div> 
</form>'; 
echo'<script type="text/javascript"> 
document.getElementsByName("autosubmit")[0].click(); // SUBMIT FORM 
</script>'; 

}

Script

<script> 
$(function() { 
$(".delbutton").click(function(){ 
var element = $(this); 
var del_id = element.attr("id"); 
var info = 'id=' + del_id; 
if(confirm("Sure you want to delete this update? There is NO undo!")) 
      { 
$.ajax({ 
    type: "GET", 
    url: "delete.php", 
    data: info, 
    success: function(){ 
    } 
}); 
     $(this).parents(".record").animate({ backgroundColor: "#fbc7c7" }, "fast") 
     .animate({ opacity: "hide" }, "slow"); 
} 
return false; 
}); 
}); 
    </script> 

Answer 1

Последний аргумент jQuery.animate() будет выполнять функцию, которая перезвонит, когда анимация будет завершена. В этом случае вы хотите, чтобы он показывал форму. Вы также хотите установить style="display:none" в CSS вашей формы, чтобы скрыть его до тех пор, пока не назовешь $("#dateForm").show().

<?php 

echo' 
<form method="post" action="app_list2.php" id="dateForm" name="dateForm"> 
<div style="display:none;"> 
<input name="drop_1" type="hidden" value="'.$drop.'" style="background-color:blue;"><input name="tier_two" type="hidden" value="'.$tier_two.'"> 
<input type="submit" name="autosubmit"></div> 
</form>'; 
} 

?> 

<script> 
$(function() { 
$(".delbutton").click(function(){ 
var element = $(this); 
var del_id = element.attr("id"); 
var info = 'id=' + del_id; 
if(confirm("Sure you want to delete this update? There is NO undo!")) 
      { 
$.ajax({ 
    type: "GET", 
    url: "delete.php", 
    data: info, 
    success: function(){ 
    } 
}); 
    $(this).parents(".record").animate({ backgroundColor: "#fbc7c7" }, "fast") 
     .animate({ opacity: "hide" }, "slow", function() { 
      $("#dateForm").submit(); 
     }); 
} 
return false; 
}); 
}); 
    </script> 

Answer 2

Написать HTML форме находится внутри DIV, и установить его стиль = "дисплей :никто;". Это сделает его невидимым при загрузке страницы. Затем после завершения анимации вы можете вызвать метод .show() в форме div, чтобы сделать его видимым. Вам необходимо определить функцию обратного вызова с помощью вашего .animate(). Следующий пример взят из JQuery-х docs показывают, как:

$("#clickme").click(function() { 
    $("#book").animate({ 
    opacity: 0.25, 
    left: "+=50", 
    height: "toggle" 
    }, 5000, function() { 
    // This is the body of the callback function. 
    // you need to make the form div visible from inside here 
    // For example, $("#my-hidden-form-div").show() 
    }); 
}); 

Вы можете найти больше примеров here.