Closed. This question is off-topic. It is not currently accepting answers.admin管理员组文章数量:1292182
Your question should be specific to WordPress. Generic PHP/JS/SQL/HTML/CSS questions might be better asked at Stack Overflow or another appropriate Stack Exchange network site. Third-party plugins and themes are off-topic for this site; they are better asked about at their developers' support routes.
Closed 7 years ago.
Improve this questionI am using Contact Form 7 with ajax jquery
. The first part is for user to insert vehicle number
and email
.
If success, it will load contact form 7 via ajax. When I click on submit, it will redirect to a new page and will output 0. I had made a research on google and found out the wpcf7-submit
function.
I tried to make an alert function and it response as expected. How do I want to use it with contact form 7 and email the form details if no error on the form?
Coding
form.php
<?php
get_header();
// Include all the theme functions
?>
<form name="season-form" class="form-horizontal" method="post" action="">
<div class="form-group form-group-lg">
<label for="carNo" id="label-cust"> Vehicle Registration No</label>
<input type="text" class="form-control" name="vehicle_no" id="vehicle_no" placeholder="BHK1991">
</div>
<div class="form-group form-group-lg">
<label for="email" id="email">Email</label>
<input type="email" class="form-control" name="email" id="email" placeholder="[email protected]">
</div>
<button type="submit" class="btn btn-primary" id="submit_payment">Make Payment</button>
</form>
<div id="result"></div>
<?php get_footer(); ?>
function.php
function _myConfirmHandler()
{
if(isset($_POST['vehicle_no']))
{
$vehicle_no = $_POST['vehicle_no'];
$email = $_POST['email'];
echo do_shortcode('[cfdb-table form="season parking form_copy" show="your-name,mail,your-platno,your-location" filter="your-platno=' . $vehicle_no . '" headers="your-name=Name,mail=Email,your-platno=Registration No.,your-location=Parking Location"]');
// Display the Form
echo do_shortcode('[contact-form-7 id="6959" title="Payment season Form_Post"]');
}
wp_die();
}
add_action('wp_ajax_confirmRequest', '_myConfirmHandler');
add_action('wp_ajax_nopriv_confirmRequest', '_myConfirmHandler');
jquery.js
jQuery(document).ready(function($) {
$('#submit_payment').click(function(e){
e.preventDefault();
var str = $("form[name=season-form]").serialize();
//alert(str);
$.ajax({
type: "POST",
url: '//www.ktmparking.my/wp-admin/admin-ajax.php',
data: str + '&action=confirmRequest'
}).done(function(data){
$("#result").html(data);
$(".cal").datepicker({
showOn: "button",
dateFormat: "dd-mm-yy",
buttonImage: ".png",
buttonImageOnly: true,
showAnim: 'slideDown',
duration: 'fast',
showButtonPanel: true
});
$('.wpcf7-submit').click(function(e) {
e.preventDefault();
alert('Submit button press!');
});
});
});
});
Do I have to rewrite the post method on the form and email the details if success?
Closed. This question is off-topic. It is not currently accepting answers.Your question should be specific to WordPress. Generic PHP/JS/SQL/HTML/CSS questions might be better asked at Stack Overflow or another appropriate Stack Exchange network site. Third-party plugins and themes are off-topic for this site; they are better asked about at their developers' support routes.
Closed 7 years ago.
Improve this questionI am using Contact Form 7 with ajax jquery
. The first part is for user to insert vehicle number
and email
.
If success, it will load contact form 7 via ajax. When I click on submit, it will redirect to a new page and will output 0. I had made a research on google and found out the wpcf7-submit
function.
I tried to make an alert function and it response as expected. How do I want to use it with contact form 7 and email the form details if no error on the form?
Coding
form.php
<?php
get_header();
// Include all the theme functions
?>
<form name="season-form" class="form-horizontal" method="post" action="">
<div class="form-group form-group-lg">
<label for="carNo" id="label-cust"> Vehicle Registration No</label>
<input type="text" class="form-control" name="vehicle_no" id="vehicle_no" placeholder="BHK1991">
</div>
<div class="form-group form-group-lg">
<label for="email" id="email">Email</label>
<input type="email" class="form-control" name="email" id="email" placeholder="[email protected]">
</div>
<button type="submit" class="btn btn-primary" id="submit_payment">Make Payment</button>
</form>
<div id="result"></div>
<?php get_footer(); ?>
function.php
function _myConfirmHandler()
{
if(isset($_POST['vehicle_no']))
{
$vehicle_no = $_POST['vehicle_no'];
$email = $_POST['email'];
echo do_shortcode('[cfdb-table form="season parking form_copy" show="your-name,mail,your-platno,your-location" filter="your-platno=' . $vehicle_no . '" headers="your-name=Name,mail=Email,your-platno=Registration No.,your-location=Parking Location"]');
// Display the Form
echo do_shortcode('[contact-form-7 id="6959" title="Payment season Form_Post"]');
}
wp_die();
}
add_action('wp_ajax_confirmRequest', '_myConfirmHandler');
add_action('wp_ajax_nopriv_confirmRequest', '_myConfirmHandler');
jquery.js
jQuery(document).ready(function($) {
$('#submit_payment').click(function(e){
e.preventDefault();
var str = $("form[name=season-form]").serialize();
//alert(str);
$.ajax({
type: "POST",
url: '//www.ktmparking.my/wp-admin/admin-ajax.php',
data: str + '&action=confirmRequest'
}).done(function(data){
$("#result").html(data);
$(".cal").datepicker({
showOn: "button",
dateFormat: "dd-mm-yy",
buttonImage: "http://theonlytutorials/demo/x_office_calendar.png",
buttonImageOnly: true,
showAnim: 'slideDown',
duration: 'fast',
showButtonPanel: true
});
$('.wpcf7-submit').click(function(e) {
e.preventDefault();
alert('Submit button press!');
});
});
});
});
Do I have to rewrite the post method on the form and email the details if success?
Share Improve this question asked May 3, 2017 at 3:25 AmranAmran 1151 gold badge2 silver badges5 bronze badges 4 |1 Answer
Reset to default 0You have been loading CF-7 form using ajax
by that means required scripts for that form never executed for that. And, because of that thing your form not working as it was expected to be.
You have to re-initiate
the scripts of CF-7 for the particular form. Here, is the updated PHP code.
Now, your ajax will be:
<?php
function _myConfirmHandler()
{
if(isset($_POST['vehicle_no']))
{
$vehicle_no = $_POST['vehicle_no'];
$email = $_POST['email'];
echo do_shortcode('[cfdb-table form="season parking form_copy" show="your-name,mail,your-platno,your-location" filter="your-platno=' . $vehicle_no . '" headers="your-name=Name,mail=Email,your-platno=Registration No.,your-location=Parking Location"]');
// Display the Form
echo do_shortcode('[contact-form-7 id="6959" title="Payment season Form_Post"]');
?>
<script>
jQuery('.wpcf7 > form').initForm();
var urL = jQuery('.wpcf7 > form').attr('action').split('#');
jQuery('.wpcf7 > form').attr('action', "#" + urL[1]);
</script>
<?php
}
wp_die();
}
?>
Update: initForm is no longer present since CF7 5.4
Thank You @Chris Pink
本文标签: jqueryContact Form 7Submit Form not working After Ajax Request
版权声明:本文标题:jquery - Contact Form 7 - Submit Form not working After Ajax Request 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1741552864a2384980.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
jQuery
code for CF7. Am, I right? – BlueSuiter Commented May 3, 2017 at 5:39