Question

我有一个html表单（在php中生成），如果用户从select中选择一个特定值，则通过jQuery添加额外的输入字段。

在处理页面中，新字段的值未通过 - 请参阅phpinfo（）的一个exerpt：

_POST["child"]  

Array
(
[1] => Array
    (
        [label] =>  
        [id] => 
    )

[2] => Array
    (
        [label] =>  
        [id] => 
    )

[3] => Array
    (
        [label] =>  
        [id] => 
    )

[4] => Array
    (
        [label] =>  
        [id] => 
    )

[5] => Array
    (
        [label] =>  
        [id] => 
    )

)

但是，如果我在jquery添加的html中设置value属性，那么该值就会通过。有没有人有这个问题的经验？

有什么想法吗？

提前致谢！

编辑：表格html：

<input type='hidden' name='orderIds' id='orderIds'/>
<input type="hidden" name="changeNums" id="changeNums"/>
<input type="hidden" name="changeIds" id="changeIds"/>
<input type='hidden' name='fromPage' id='fromPage' value='/new/admin/extra_info.php?'/>
<input type='hidden' name='table' id='table' value='extra_info'/>
 <input type="hidden" name="splitPageNum" id="splitPageNum" value=""/><div align='center'><div class='popUpS' align='center' id='popUp'><div align='right' id='closeDiv' class='off' onmouseover="this.className='offOver'" onmouseout="this.className='off'"><a class='off' href='javascript:closePopUp()'>X</a></div><div align='center'class='noticeBar'id='noticeBar'></div><br/><div id='newOrderTr'><div class='formPrompt'>Order</div><div class='formInput'><select class='formInput' name='orderNumber' id='orderNumber'><option value=''>-Select-</option><option value='1'>Before Select Kashrus</option><option value='2'>Before Select Kashrus</option><option value='3'>Before Select Kashrus</option><option value='4'>After Select Kashrus</option></select></div><br/></div><div class="formPrompt">Active</div><div class="formInput"><select class="formInput" name="Active" id="Active"><option value="">-Select-</option><option  value="Active">Active</option><option  value="Inactive">Inactive</option></select></div><br/><div class='formPrompt'>Field Label</div><div class='formInput'><input type='text' class='formInput' name='label' id='label'/></div><br/>

<div class='formPrompt'>Field Type</div><div class='formInput' id='container_fieldType'><select class='formInput' name='fieldType' id='fieldType'><option value=''>-Select-</option>
<option value='0'>Short Text</option><option value='1'>Long Text</option><option value='2'>Drop Down</option></select></div><br/><div class='formPrompt'>Is Required</div><div class='formInput' id='container_isRequired'><select class='formInput' name='isRequired' id='isRequired'><option value=''>-Select-</option>
<option value='1'>Yes</option><option value='0'>No</option></select></div><br/><div class='clearFloats' style='width:600px;text-align:center;'><input type='submit' value='Submit'/></div></div></form>

JS：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>


<script type='text/javascript'>
$('#fieldType').bind('change', function(){

    if($('#fieldType').val() == 2){
        if($('#rowId').val() != 'new'){
            getVals($('#rowId').val());
        }
        $('#container_fieldType').after('<div id="child_form">' + $('#childFormHTML').html() + "<input type='hidden' name='child_table' value='extra_info_values'/><input type='hidden' name='child_table_fields' value='label'/></div>")

    }
    else{
        if($('#child_form').html())
            if(confirm("Do you want to delete all values?"))
                $('#child_form').remove()
    }


});

function getVals(rowId){
    $.get('ajax/getVals.php?rId=' + rowId, function(data) {
        if(data != ''){
            $('#childFormHTML').html(data);
    }
    });
}


</script>

要添加的Html：

<div id='childFormHTML' style='display:none;'>
<br class='clear:both;'/><div class='formPrompt'>Value</div>
<div class='formInput'><input type='text' id='child[1][label]' value=' ' name='child[1][label]' class='formInput'/><input type='hidden' name='child[1][id]'/></div>
<br class='clear:both;'/><br class='clear:both;'/>
<div class='formPrompt'>Value</div>
<div class='formInput'><input type='text' id='child[2][label]' value=' ' name='child[2][label]' class='formInput'/>   <input type='hidden' name='child[2][id]'/></div>
<br class='clear:both;'/><br class='clear:both;'/>
<div class='formPrompt'>Value</div><div class='formInput'><input type='text' id='child[3][label]' value=' ' name='child[3][label]' class='formInput'/>
<input type='hidden' name='child[3][id]'/></div>
<br class='clear:both;'/><br class='clear:both;'/>
<div class='formPrompt'>Value</div>
<div class='formInput'><input type='text' id='child[4][label]' value=' ' name='child[4][label]' class='formInput'/><input type='hidden' name='child[4][id]'/></div>
<br class='clear:both;'/><br class='clear:both;'/>
<div class='formPrompt'>Value</div><div class='formInput'><input type='text' id='child[5][label]' value=' ' name='child[5][label]' class='formInput'/><input type='hidden' name='child[5][id]'/></div><br class='clear:both;'/></div>

Answer 1

因为您的html是动态插入的，所以您需要使用：

$（“＃form-container”）。delegate（“form”，“submit”，function（event）{}）;

在value属性中设置时，通过Jquery动态添加的表单元素仅发布值

1 个答案: