将变量发送到表单

时间:2017-12-22 23:15:08

标签: jquery ajax

我想在单击ORDER按钮后打开(隐藏)表单,并在表单主题中自动显示数据(生成) - 字段$ name $ part_nr,并在单击SEND表单按钮后表格将会消失。

<?php
echo "<div id=\"container\">
<ul class=\"list\">
<li>
<section class=\"list-top\">
<h5 class=\"title\"><span class=\"temat\">$name $part_nr</span></h5>
</section>
<section class=\"list-right\">
<span><a class=\"order\">ORDER</a></span>
</section>
</li>
</ul>
</div>";
?>

形式:

<div id="order" style="display:none" >
<section id="formularz">
<div class="form-container">
<div class="col-md-12">
<form id="main-contact-form" class="formularz" name="formularz" method="post" action="sendemail.php">
<input type="text" class="form-control" id="title" name="title" required="required" placeholder="Subject" value="<?php echo $form_title; ?>">
<input type="text" class="form-control" id="name" name="name" required="required" placeholder="Name">
<input type="text" class="form-control" id="number" name="number" placeholder="Phone">
<input type="email" class="form-control" id="email" name="email" required="required" placeholder="E-mail">
<textarea class="form-control" rows="3" id="message" name="message" required="required" placeholder="Message"></textarea>
<button class="btn btn-default" id="submit" type="submit" name="submit" >SEND</button>
<button class="btn btn-default" id="reset" type="reset" name="reset" >Clear</button>
</form>
</div>
</div>
</section>
</div>

和ajax代码

$(document).ready(function() {

// Contact form
var form = $('#main-contact-form');
form.submit(function(event){
event.preventDefault();
var form_status = $('<div class="form_status"></div>');
$.ajax({
url: $(this).attr('action'),
method: 'POST',
data: form.serialize(),
beforeSend: function(){
form.prepend( form_status.html('<p><i class="fa fa-spinner fa-spin"></i> Sending message ...</p>').fadeIn() );
}
}).done(function(data){
form_status.html('<p class="text-success">' + data.message + '</p>').delay(3000).fadeOut();
});
});

$(".order").click(function()
{
var formtyt = $(this).parent().parent().find('span.temat').html();
$('body').find('form#main-contact-form').find('input.title').val(formtyt);
});
});

点击ORDER

后无法执行任何操作

0 个答案:

没有答案