[英]Submit a form loaded thru Ajax with jQuery
在用户选择一系列选项之后,我有一个可以动态加载的表单。
显示表单后,用户必须单击表单中的按钮以确认选择,然后将其重定向到第三方站点。 在重定向用户之前,我需要通知我们的系统,该用户已确认选项并生成一个ID以通过第三方站点,以便它可以识别交易。
jQuery函数如下。
$.ajax({
type: "GET",
url: 'functions.php?funcion=transaccion&order=' + pedido ,
dataType: "xml",
success: function(xml){
$("#param").val($(xml).find('trxid').text());
$('#form_pago').submit();
},
error: function() {
alert("Error en transaccion.");
}
});
带回ID,但不提交表单。
我的猜测是问题在于表单是动态加载的,因此在解析DOM时不存在该表单,但是我找不到在任何地方提交它的方法。
编辑:
似乎我的问题不够具体,或者我不理解答案,因为它们不能解决我的问题。
这里是代码的完整版本:
这是加载表格的功能。
function mostrarFormulario(pedido){
$.ajax({
type: "GET",
url: 'functions.php?funcion=getFormularioPago&pedido=' + pedido,
dataType: "xml",
success: function(xml){
$("#fin_pedido").html($(xml).find('formulario').text());
},
error: function() {
alert("Se ha producido un error al generar el boton para realizar el pago.");
}
});
}
这是正在加载的表格
<form method="post" action="https://sps433.decidir.net/sps-ar/Validar" target="_top" id="pago_decidir">
<input name="NROCOMERCIO" value="xxxxxxx" type="hidden">
<input name="NROOPERACION" value="NROOP" type="hidden">
<input name="MONTO" value="nnnnnnnn" type="hidden">
<input name="CUOTAS" value="" type="hidden">
<input name="URLDINAMICA" value="http://URL-RETORNO" type="hidden">
<input name="EMAILCLIENTE" value="xxxxxx@xxxxxx" type="hidden">
<input name="MEDIODEPAGO" value="xxxxx" type="hidden">
<input name="PARAMSITIO" value="" id="paramsitio" type="hidden">
<input value="Pagar con Decidir" name="submit" alt="Pagar con Decidir" onclick="generarTransaccion('nnn')" border="0" type="button">
</form>
这是在onClick中调用的函数,该函数应在检索需要发送的ID后提交表单。
function generarTransaccion(pedido) {
$.ajax({
type: "GET",
url: 'functions.php?funcion=transaccion&pedido=' + pedido ,
dataType: "xml",
success: function(xml){
$("#paramsitio").val($(xml).find('trxid').text());
$('#pago_decidir').submit();
},
error: function() {
alert("Se ha producido un error al generar el boton para realizar el pago.");
}
});
}
此函数正确检索和替换ID,但不提交表单。
尝试用“ .on()”包装您的Submit,例如
$("#formcontainer").on("click", ".dynamicformbutton", function(){
$('#form_pago').submit();
});
其中formcontainer是要放置表单的容器的ID,而dynamicformbutton是表单中的提交按钮的类。
编辑:您将要把它放在ajax调用之外。
由于表单是动态加载的,因此它不会出现在DOM中。 因此,您需要侦听单击“提交”按钮将事件绑定到文档。
因此,如果您的表单提交按钮具有Id="btn"
,那么这应该起作用-
$(document).on('click', '#btn', function() {
// do your stuff
...
});
使用以下完整代码:
$(document).on('click', '#buttonID', function() {
$.ajax({
type: "GET",
url: 'functions.php?funcion=transaccion&order=' + pedido ,
dataType: "xml",
success: function(xml){
$("#param").val($(xml).find('trxid').text());
$('#form_pago').submit();
},
error: function() {
alert("Error en transaccion.");
}
});
});
放置警报(“ 1”); 函数内部的代码,可以帮助您检查此代码是否正常运行。 谢谢
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.