Question

我正在开发一个网页，通过一些javascript / jquery代码动态创建一个包含多个select标签的表单。提交表单时，php文件（form_submit.php）必须处理提交的表单字段。此外，我使用Netbeans 7.4进行php调试。

我的问题：当我在表单中选择一些值并提交表单时，调试器会在form_submit.php中显示空提交的值（例如，默认值为“NOSELECTION”，表示没有选择），而不是选定的值。下面代码中提交函数中的控制台确实显示了所选的提交值（因此也确认了带有select标签的构建的html表单是正确的。）

我不认为这是一个Netbeans中的错误，所以我哪里出错了？我怀疑下面的jquery提交函数中有一个错误，但我不能看到它......

Javascript代码：

//main function document ready    
$(document).ready(function(){

//only part of code here to build the form with a number of <select>'s
ecorp_eproductoptions = '<select  id="selected_eproductid'+ff+'" class="eprodtype" name="selected_eproductid'+ff+'">';
ff++;
ecorp_eproductoptions += '<option selected="selected" value="NOSELECTION" > Koppel uw product </option>';

for(var k=0; k< Staticvars.ecorp_nrofeproducts;k++){
  ecorp_eproductoptions += '<option value="'+ Staticvars.suppliername[i] +'_'+Staticvars.agreementid[i] +'_'+ supplier_eproductid +'_'+ Staticvars.ecorp_eproductid[k] +'"> '+ Staticvars.ecorp_eproductname[k] +' </option>';
  }//for var k
  ecorp_eproductoptions += '</select>';
  form += '<td> '+ ecorp_eproductoptions +' </td></tr>';
//etc...

//FUNCTION Submit()
$("#myForm").submit(function(){

    console.log('SUBMITTED FORM: '+ $( this ).serialize() ); //shows values for select tags!

    $.ajax({
        type: "POST",
        url: "form_submit.php",
        data: $("#myForm").serialize(),
        dataType: "json",

        success: function(msg){
        if(msg.statusgeneral == 'success'){

        }
        else
        {

        }//else
        }, //succes: function   
        error: function(){

    $("#errorbox").html("There was an error submitting the form. Please try again.");
        }
    });//.ajax

//make sure the form doesn't post
return false;


});//$("#myForm").submit()

}); //$(document).ready

HTML code：

<form id="myForm" name="myForm" action="" method="post">    
    <div id="wrapper"></div> <!--anchor point for adding set of product form fields -->   
    <input type="hidden" name="form_token" value="<?php echo $form_token; ?>" />
    <input type="submit" name="submitForm" value="Bevestig">
</form>

Answer 1

我也是jQuery的新手，但我认为问题在于你的$.ajax调用是异步运行的，这允许submit事件处理程序继续运行并在表单发送值之前返回false。只是一个新手的猜测。：）

您是否尝试在async: false来电中添加$.ajax？

Answer 2

我不知道为什么会这样，但请尝试这个

$("#myForm").submit(function(){
var dataAjax = $( this ).serialize();
console.log('SUBMITTED FORM: '+ dataAjax  ); //shows values for select tags!

$.ajax({
    type: "POST",
    url: "form_submit.php",
    data: dataAjax,
    dataType: "json",

    success: function(msg){
    if(msg.statusgeneral == 'success'){

    }
    else
    {

    }//else
    }, //succes: function   
    error: function(){

$("#errorbox").html("There was an error submitting the form. Please try again.");
    }
});//.ajax
//make sure the form doesn't post
return false;
});//$("#myForm").submit()

提交表单无法正常工作

2 个答案: