我有一个表单，其中输入是使用Jquery动态创建的。如果我将元素硬编码与使用Jquery创建的元素完全相同，那么我可以很好地获得POST数据。但是，当动态创建元素时，它们不会提交POST数据。
用于创建元素的Jquery（使用Jquery-UI拖放元素，当它被删除时，它会在该区域中创建一个新元素。）
$(".drop-container").droppable({
accept: ".draggable",
addClasses: false,
drop: function (event, ui) {
var drag_name = ui.draggable.html();
ui.draggable.hide();
var new_body_count = '<tr><td class="btn btn-primary">' + drag_name + '</td><td class="badge"><input placeholder="Number of Kills" name="body_count" class="number-count" type="number"></td></tr>'
$('.table').prepend(new_body_count)
}
});
它创建的HTML -
<tr>
<td class="btn btn-primary">
<span class="glyphicon glyphicon-resize-vertical" aria-hidden="true">
<input type="hidden" name="actor_id[]" value="162705079">
</span>
Julie Benz - J
</td>
<td class="badge">
<input placeholder="Number of Kills" name="body_count" class="number-count" type="number">
</td>
</tr>
它肯定在表单标签内。就像我说的，如果我对html进行硬编码，它就可以了，但是当输入是由Jquery创建的时候，没有帖子。我很确定它是动态创建的。
编辑 -
$('#update_form').on('submit', 'form', function(){
$('.abridged-hide input').attr('disabled', true);
$('.unabridged-hide input').attr('disabled', true);
});
编辑 - HTML表单的代码
<legend class="text-center">Film title: <?=$film_title_text?></legend>
<div class="col-md-3">
<?=form_open('update/add_category');?>
<label for="category">Category Title</label>
<?=form_input($cat_title, '');?>
<button type="submit" class="btn btn-primary">Add Category</button>
<?=form_close();?>
</div>
<div id="event_form" class="col-md-6">
<?=form_open('/update/save_entry', $update_id);?>
<?php if(isset($thenav['nav_id'])){?>
<input type="hidden" name="film_id" value="<?=$q?>">
<div class="form-group">
<label for="add_category">Add Category</label>
<?=form_dropdown('cat_id', $cat, '', $cat_id );?>
</div>
<div class="form-group">
<label for="heading">Article Title</label>
<?=form_input($title, '');?>
</div>
<div class="well">
<div class="form-group">
<label for="heading">Add Custom Body Count Field</label>
<input type="text" class="form-control" name="body_count">
<button class="btn btn-primary" id="custom_body_cnt">Add Custom Body Count Field</button>
</div>
</div>
<div class="panel panel-primary">
<div class="panel-heading">Abridged Cast</div>
<div class="panel-body abridged-hide">
<?php
foreach ($this_actors as $this_actor['name']) {
$characters = $this_actor['name']->name;
if(isset($characters[0])){
$characters = $characters[0];
}else{
$characters = '';
}
echo "<span class='btn btn-primary draggable'><input type='hidden' class='actor_field' name='actor_id[]' value='".$this_actor['name']->id."'><span class='glyphicon glyphicon-resize-vertical' aria-hidden='true'></span> ".$this_actor['name']->name." - ".$characters."</span>";
}?>
</div>
</div>
<button id="slide-abridged" class="btn wide-button"><span class='glyphicon glyphicon-resize-vertical' aria-hidden='true'></span></button>
<div class="panel panel-primary">
<div class="panel-heading">Unabridged Cast</div>
<button id="slide-unabridged" class="btn wide-button"><span class='glyphicon glyphicon-resize-vertical' aria-hidden='true'></span></button>
<div class="panel-body unabridged-hide">
<?php
foreach ($unabridged_actors as $this_actor['name']) {
$characters = $this_actor['name']->characters;
if(isset($characters[0])){
$characters = $characters[0];
}else{
$characters = '';
}
echo "<input type='text' name='actor_name' value='".$this_actor['name']->id."'>";
echo "<span class='btn btn-primary draggable'><span class='glyphicon glyphicon-resize-vertical' aria-hidden='true'></span> ".$this_actor['name']->name." - ".$characters."</span>";
}?>
</div>
</div>
<button id="slide-unabridged" class="btn wide-button"><span class='glyphicon glyphicon-resize-vertical' aria-hidden='true'></span></button>
<?=form_textarea($article, '');?>
</div>
<div class="col-md-3">
<span class="label label-default">Body Count Inventory</span>
<div class="well drop-container clearfix">
<table class="table">
<tr>
<td class="btn btn-primary">Total</td>
<td class="badge"><input placeholder="Number of Kills" name="film_total" class="film_total" disabled type="number"></td>
</tr>
</table>
</div>
<button type="submit" id="entry_submit" class="btn btn-primary">Update Page</button>
<?php }?>
<?=form_close()?>
</div>
答案 0 :(得分：0)
我想问你一些更多的细节，但堆栈溢出不会让我。
无论如何，如果您通过jQuery处理提交事件的POST，很可能是您没有将事件绑定到动态添加的表单。
例如，如果您以这种方式将事件绑定到表单：
$("form").on("submit", function(){
//do POST stuff
})
它只会在绑定事件时将事件附加到DOM中的表单。
为了将事件绑定到动态元素，您必须通过非动态元素来完成。例如，假设您的表单包含在ID为forms-container的div中。然后你可以附上这样的事件：
$("#forms-container").on("submit", "form", function(){
//do POST stuff
})
这样，事件将附加到#forms-container内的所有元素，包括动态添加的元素。
答案 1 :(得分：0)
我怀疑这是代表团问题，但我仍然不太明白。
这有效 -
$('#reg_form').on('submit', function(event){
var address = $('input[name=address]').val();
var city = $('input[name=city]').val();
var state = $('select[name=state]').val();
var zip = $('input[name=zip]').val();
var format_address = address + '+' + city + '+' + state + '+' + zip;
var password = $('input[name=password]').val();
var password_verify = $('input[name=confirm_password]').val();
var email = $('input[name=email]').val();
var confirm_email = $('input[name=confirm_email]').val();
if(email != confirm_email){
event.preventDefault();
$('.text-danger').show();
$('.text-danger').html('Email Address does not match.');
}
if(password != password_verify)
{
event.preventDefault();
$('.text-danger').show();
$('.text-danger').html('Password does not match.');
}
//call google maps api
$.getJSON( "https://maps.googleapis.com/maps/api/geocode/json?address=" + format_address, function( data ) {
console.log(data.results[0].geometry.location.lat);
console.log(data.results[0].geometry.location.lng);
//populate form fields
$('input[name=lat]').val(data.results[0].geometry.location.lat);
$('input[name=lng]').val(data.results[0].geometry.location.lng);
});
$(this).unbind('submit');
});
如果我取出了unbind，表单不会发布动态生成的值。我曾尝试过一些喜欢这样做的事情 -
$('.form_container').on('submit', 'form', function(event){
我尝试了一些其他的东西现在不能用。绑定防止默认，取消绑定防止默认。
但就像我说的那样，上面的代码与unbind有效。也许比我更了解约束力和授权的人可以权衡它。