1
'친구 추천'페이지에 대해 하나의 제출 양식에 여러 양식을 게시하고 있습니다. 처음에는 리퍼러 용과 추천 용으로 2 가지 형식이 있습니다. 사용자는 추천 양식을 clone()하여 컨테이너에 추가하는 더하기 기호를 클릭하여 더 많은 추천 양식을 '추가'할 수 있습니다.AJAX는 하나의 제출 양식에 복제 양식을 게시합니다.
<div class="form-wrap">
<form id="referrer-form" role="form" action="<?=$_SERVER['REQUEST_URI'];?>" method="post" >
inputs...
</form>
<form id="first-ref" class="referral-form" role="form" action="<?=$_SERVER['REQUEST_URI'];?>" method="post">
inputs...
</form>
</div>
<div class="buttons">
<a id="plus" class="btn btn-primary" href=""></a>
<a id="minus" class="btn btn-danger" href=""></a>
<button id="submit" class="btn btn-warning btn-lg form-control">SUBMIT</button>
</div>
내 현재 jQuery에서는 페이지 마크 업 게시물과 함께로드되는 2 개의 양식이 잘 처리됩니다. 그러나 clone() 된 것은 게시하지 않습니다. 모든 속성은 동일하게 나타납니다. 각 양식에
가 // AJAX 게시물
var form = $('form');
$("#submit").click(function() {
$('#referrer', '#referrer-form').val('what is posted to leadsource field');
$(form).each(function() {
if ($(this).attr("id") != "referrer-form") {
$('#referrer', this).val('Referred by: ' + $('#referrer-form #name').val());
}
var formData = $(this).serialize();
$.ajax({
type: 'POST',
url: $(form).attr('action'),
data: formData
});
});
alert("form submitted");
$('form input').val('');
});
$("#plus").click(function() {
$("#first-ref").clone().appendTo(".form-wrap");
$(".referral-form").last().attr('id', '');
$(".referral-form").last().find('input').val('');
load_phoneMask_js();
});
$("#minus").click(function() {
$(".referral-form").last().remove();
});
</script>