Question

我在上一步的问题是Add a number of input fields based on a dynamic value in PHP

然而，为了继续这一点，我有一个新问题，我不知道在这里寻找什么来寻找答案，所以请原谅我，如果这已经得到了回答。

我目前有一个数字$ date，它是从2个日期字段计算出来的。用户选择一个日期，然后每天显示一个<select>字段。但是，我希望从所做的选择中收集值，并通过jQuery和ajax将它们发送到我的表单。

第1步（假设用户已选择3天，并显示3个<select>字段）

<select id="course_select_1">
  <option value="value 1">Value 1</option>
  <option value="value 2">Value 2</option>
</select>

<select id="course_select_2">
  <option value="value 1">Value 1</option>
  <option value="value 2">Value 2</option>
</select>

<select id="course_select_3">
  <option value="value 1">Value 1</option>
  <option value="value 2">Value 2</option>
</select>

对于ref，这里是生成选择框的PHP。

for ( $i = 1; $i <= $days; $i++ ) {
      echo  '
        <p>Day ' . $i . ' </p>
        <select id="course-select' . $i . '">
            <option>Choose Course...</option>
            <option value="No golf">No golf</option>                        
        </select>

      ';
    }

对于ref，这是我用来从前一个表单收集我的表单数据的JS以及我习惯用来从固定字段收集数据的方法。

        jQuery(document).ready(function(){

            jQuery('#step').click(function() { 

                jQuery('.step1').fadeOut();
                jQuery('.step2').fadeIn();

                var firstname   =   jQuery('#firstname').val();
                var surname     =   jQuery('#surname').val();
                var telephone   =   jQuery('#telephone').val();
                var mobile      =   jQuery('#mobile').val();
                var email       =   jQuery('#email').val();
                var noofgolfers =   jQuery('#noofgolfers').val();
                var arrival     =   jQuery('#arrival').val();
                var leaving     =   jQuery('#leaving').val();


                jQuery(function(){
                    jQuery.ajax({
                        url:"http://www.ayrshiregolf.com/wp-admin/admin-ajax.php",
                        type:'POST',
                        data:'action=bookingrequest&firstname=' + firstname +
                        '&surname=' + surname + 
                        '&telephone=' + telephone +
                        '&mobile=' + mobile +
                        '&email=' + email +
                        '&noofgolfers=' + noofgolfers +
                        '&arrival=' + arrival +
                        '&leaving=' + leaving,                     
                        success:function(result){
                        //got it back, now assign it to its fields. 
                        jQuery('#step2content').html(result);                   
                        //console.log(result);

                        }
                    });     
                });
            });
        });

步骤2：用户选择选项，然后我们使用相同的方法再次提交表单（jquery获取数据并发送到我的PHP函数）。

如果我不知道将会有多少值，我如何从字段中获取值？

由于

Answer 1

使用jQuery serialize方法。

https://api.jquery.com/serialize/

此外，您可以使用jQuery post方法（更容易）：

http://api.jquery.com/jquery.post/

如果您的form具有ID myForm：

jQuery('#step').click(function() {

    jQuery('.step1').fadeOut();
    jQuery('.step2').fadeIn();

    jQuery.post("http://www.ayrshiregolf.com/wp-admin/admin-ajax.php",
        jQuery("#myForm").serialize(),
        function(result){
            jQuery('#step2content').html(result);
        }
    });
});

要在PHP页面中标识值，您需要将name属性添加到表单字段中：

<input type="text" name="myTextInput">

<?php
    echo $_POST["myTextInput"]; //will output the value of the textarea named myTextInput

Answer 2

jQuery.ajax({
     url:"http://www.ayrshiregolf.com/wp-admin/admin-  ajax.php",
     type:'POST',
     data:$('form').serialize(),                     
     success:function(result){
         //got it back, now assign it to its fields. 
         jQuery('#step2content').html(result);                   
         //console.log(result);
});

这将以

的形式发送所有数据

如何从动态生成的表单中获取输入值

2 个答案: