获取动态添加的输入值

Question

我有一个可以添加其他输入字段的表单。 我使用 $_POST['input_name'] 获得这些值，并且可以插入到数据库/发送邮件。 问题是，如果留下错误，我希望在刷新页面时显示这些字段和值，但是我无法在 Jquery 代码中获取动态添加的输入值 - 只是静态添加的第一个。 是否可以在 jQuery 代码中获得这些值？

我的 HTML

<div class="field_wrapper">
<div>
 <input type="text" name="input_name[]" class="form-control" placeholder="Enter name" value="<?php if(isset($_POST['input_name'])) echo $_POST['input_name'][0];?>"/>
<a href="javascript:void(0);" class="add_button" title="Add field"></a>
</div>

 </div>

我的 jQuery

jQuery(document).ready(function(){

    console.log(jQuery('#contactForm').serialize()); <- getting first value

    var vals = jQuery("input[name='input_name[]']").map(function(){ return this.value}).get();
    console.log(vals); <- getting first value
    var maxField = 10; //Input fields increment limitation
    var addButton = jQuery('.add_button'); //Add button selector
    var wrapper = jQuery('.field_wrapper'); //Input field wrapper

    var x = 1; //Initial field counter is 1
    
    //Once add button is clicked
    jQuery(addButton).click(function(){
        //Check maximum number of input fields
        if(x < maxField){ 
            var fieldHTML = '<div><input type="text" name="input_name[]" class="form-control" placeholder="Enter name"/> \
            <a href="javascript:void(0);" class="remove_button"></a></div>'; 
            x++; //Increment field counter
            jQuery(fieldHTML).appendTo(wrapper); //Add field html
        }
    });
    
    //Once remove button is clicked
    jQuery(wrapper).on('click', '.remove_button', function(e){
        e.preventDefault();
        jQuery(this).parent('div').remove(); //Remove field html
        x--; //Decrement field counter
    });
});

Answer 1

最近我正在研究它。 你可以从这里获得帮助https://github.com/arafatrahman/wp-redirect-url/blob/main/views/wpru-settings-view.php

您还需要检查此插件https://github.com/arafatrahman/wp-redirect-url上的其他文件