我已经在function.php
并在我的页面上添加了简短的代码,它正在运行。我正在拿我的表格。
function st_contact_form(){
ob_start();
?>
<div class="contact_form-wrapper popup-contact-form">
<form action="" method="post" name="contact_form" id="contact_form" autocomplete="off">
<div class="row">
<div class="col-xl-6 col-lg-6 col-md-6 col-sm-12 col-xs-12 ">
<div class="form-group">
<input type="text" name="name" placeholder="Name" class="form-control" required>
</div>
</div>
<div class="col-xl-6 col-lg-6 col-md-6 col-sm-12 col-xs-12 ">
<div class="form-group">
<input type="email" name="email" placeholder="Email Id" class="form-control" required>
</div>
</div>
</div>
<div class="row">
<div class="col-xl-6 col-lg-6 col-md-6 col-sm-12 col-xs-12 ">
<div class="form-group">
<input type="text" name="mobileno" placeholder="Phone no" class="form-control" required>
</div>
</div>
<div class="col-xl-6 col-lg-6 col-md-6 col-sm-12 col-xs-12 ">
<div class="form-group select-service">
<select class="form-control" name="type_of_services" required>
<option selected disabled>Select Service</option>
<option value="1">Testing one</option>
<option value="2">Testing two</option>
</select>
</div>
</div>
</div>
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-xs-12 paddingLR0">
<div class="form-group">
<textarea class="form-control" placeholder="Message" name="message" rows="2" required></textarea>
</div>
</div>
<div class="form-group ">
<input type="submit" name="send" value="Submit" class="btn_st btn_maroon form_submit_btn">
</div>
</form>
</div>
<?php
return ob_get_clean();
}
add_shortcode( \'contact_form\', \'st_contact_form\' );
我在脚本文件中添加了下面的脚本,验证正在工作。现在我想知道如何在wordpress中提交表单?我应该创建一个表吗?或者我必须创建流程。php文件并添加一些逻辑?
$("#contact_form").validate({
rules: {
name: {
required:true
},
email: {
required:true,
email: true,
emailExt: true
},
mobileno: {
required:true,
minlength: 10,
maxlength: 10,
number: true
},
type_of_services: {
required:true
},
message: {
required:true
}
},
submitHandler: function(r) {
if(isReqInprogress){
return;
}
isReqInprogress = true;
$.ajax({
url:base_url+"/wp-content/themes/mytheme/process.php",
type: "post",
data:{name:name,email:email,mobileno:mobileno,type_of_services:type_of_services,message:message},
dataType:"JSON",
success: function(response) {
alert("success");
isReqInprogress = false;
}
})
}
});
Process.php
<?php
global $wpdb;
$data = $_POST;
$to = $data[\'email\'];
$subject = \'The subject\';
$body = \'The email body content\';
$headers = array(\'Content-Type: text/html; charset=UTF-8\');
//$mail = wp_mail($data[\'email\'], $subject, $body, $headers );
//if ($mail) {
$wpdb->insert(\'wp_contact\',
array(
\'name\' => $data[\'name\'],
\'email\' => $data[\'email\'],
\'mobileno\' => $data[\'mobileno\'],
\'message\' => $data[\'message\'],
),
array(
\'%s\',
\'%s\',
\'%s\',
\'%s\',
)
);
//}
?>
你能帮帮我吗?
最合适的回答,由SO网友:Naren Verma 整理而成
最后,我得到了我的解决方案,
我在中添加了以下代码function.php
使用快捷码,我在网页上获取表格
function st_contact_form(){
ob_start();
?>
<div class="contact_form-wrapper popup-contact-form">
<form action="" method="post" name="contact_form" id="contact_form" autocomplete="off">
<div class="row">
<div class="col-xl-6 col-lg-6 col-md-6 col-sm-12 col-xs-12 ">
<div class="form-group">
<input type="text" name="name" placeholder="Name" class="form-control" required>
</div>
</div>
<div class="col-xl-6 col-lg-6 col-md-6 col-sm-12 col-xs-12 ">
<div class="form-group">
<input type="email" name="email" placeholder="Email Id" class="form-control" required>
</div>
</div>
</div>
<div class="row">
<div class="col-xl-6 col-lg-6 col-md-6 col-sm-12 col-xs-12 ">
<div class="form-group">
<input type="text" name="mobileno" placeholder="Phone no" class="form-control" required>
</div>
</div>
<div class="col-xl-6 col-lg-6 col-md-6 col-sm-12 col-xs-12 ">
<div class="form-group select-service">
<select class="form-control" name="type_of_services" required>
<option selected disabled>Select Service</option>
<option value="1">Testing one</option>
<option value="2">Testing two</option>
</select>
</div>
</div>
</div>
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-xs-12 paddingLR0">
<div class="form-group">
<textarea class="form-control" placeholder="Message" name="message" rows="2" required></textarea>
</div>
</div>
<div class="form-group ">
<input type="submit" name="send" value="Submit" class="btn_st btn_maroon form_submit_btn">
</div>
</form>
</div>
<?php
return ob_get_clean();
}
add_shortcode( \'contact_form\', \'st_contact_form\' );
现在,下一步是JQuery验证和Ajax。我还创建了
process.php
我的主题中的文件
$("#contact_form").validate({
rules: {
name: {
required:true
},
email: {
required:true,
email: true
},
mobileno: {
required:true,
minlength: 10,
maxlength: 10,
number: true
},
type_of_services: {
required:true
},
message: {
required:true
}
},
submitHandler: function(form) {
if(isReqInprogress){
return;
}
$.ajax({
url:"/wp-content/themes/themename/process.php",
type: "post",
data:$(\'#contact_form\').serialize(),
dataType:"JSON",
success: function(response) {
alert("Your message has been received and we will be contacting you shortly to follow-up.");
isReqInprogress = false;
}
});
}
});
Process.php
注意:我已在数据库中创建了联系人表
<?php
define( \'BLOCK_LOAD\', true );
require_once( $_SERVER[\'DOCUMENT_ROOT\'] . \'/wp-config.php\' );
require_once( $_SERVER[\'DOCUMENT_ROOT\'] . \'/wp-includes/wp-db.php\' );
$wpdb = new wpdb( DB_USER, DB_PASSWORD, DB_NAME, DB_HOST);
global $wpdb; // <--- making $wpdb as global
$data = $_POST;
$query=$wpdb->insert(\'contact\',
array(
\'name\' => $data[\'name\'],
\'email\' => $data[\'email\'],
\'phone\' => $data[\'mobileno\'],
\'type_of_services\' => $data[\'type_of_services\'],
\'message\' => $data[\'message\']
),
array(
\'%s\',
\'%s\',
\'%s\',
\'%s\',
\'%s\',
)
);
if ($query) {
$response[\'error\'] = "true";
}else{
$response[\'error\'] = "false";
}
echo json_encode($response);
exit();
// $wpdb->show_errors();
?>
就是这样。这对我来说非常有效。