Php 如何在Wordpress中定制AJAX表单
首先，我不想修改Wordpress模板中的任何主脚本或原始脚本 我可以直接在Wordpress页面中创建表单（不需要数据库）吗？或者我将创建插件，以便将其附加到特定的Wordpress页面上 我在Wordpress外部进行了测试，并成功地使用AJAX调用。我曾尝试在页面编辑器的文本模式下插入脚本，但在更新页面后无法工作 一般工作流程如下：Php 如何在Wordpress中定制AJAX表单,php,json,ajax,wordpress,curl,Php,Json,Ajax,Wordpress,Curl,首先，我不想修改Wordpress模板中的任何主脚本或原始脚本 我可以直接在Wordpress页面中创建表单（不需要数据库）吗？或者我将创建插件，以便将其附加到特定的Wordpress页面上 我在Wordpress外部进行了测试，并成功地使用AJAX调用。我曾尝试在页面编辑器的文本模式下插入脚本，但在更新页面后无法工作 一般工作流程如下： [form.html]文件有一个表单供用户选择并提交，以便在不刷新页面的情况下从服务器检索结果 HTML文件中的AJAX（external call.js J
$（文档）.ready（函数（）{
$（“.new loan”）。单击（函数（）{
$（“.newloanTab1”）.show（）；
$（“.retab1”）.hide（）；
$（“.retainetab2”）.hide（）；
});
$（“.refore”）。单击（函数（）{
$（“.retab2”）.show（）；
$（“.newloanTab1”）.hide（）；
});
$（'input[type=“radio”]”）。在（'change'，function（）上{
如果（$（'input[value=“Reforefee”]'）是（“：选中的”）&&（'input[value=“commercial”]'）是（“：选中的”））{
$（“.b1”）.show（）；
}否则{
$（“.retab1”）.hide（）；
}
});
});
贷款类型*
新贷款
再融资
个人/公司*
个人
单位
当前融资人*
财务员1
财务师2
现有贷款金额*
物业购买*
对
不
施工状态*
完整的
在建
电子邮件*
联系人姓名*
电话*
提交
$（文档）.ready（函数（）{
$（'form'）。提交（函数（事件）{
$（'.form group'）.removeClass（'has-error'）；
$（'.help块'）.remove（）；
var formData={
“贷款类型”：$（“输入[名称=贷款类型]：选中”）.val（），
'个人或公司'：$（'input[name=个人或公司]：选中]）.val（），
'当前融资商\ ddl'：$（'select[name=current\u financer\ ddl]选项：selected'）。val（），
'现有贷款金额'：$（'input[name=现有贷款金额]）.val（），
“财产购买”：$（“输入[名称=财产购买]：选中”）.val（），
“施工状态”：$（“输入[名称=施工状态]：已选中”）.val（），
'email'：$（'input[name=email]'）。val（），
'contact_name'：$（'input[name=contact_name]'）。val（），
'phone'：$（'input[name=phone]'）。val（），
};
event.preventDefault（）；
$.ajax({
键入：“POST”，
url:'ajaxtest.php'，
数据：formData，
数据类型：“json”，
编码：对，
成功：功能（数据）{
if（data.success==false）{
if（数据.错误.贷款类型）{
$（“#贷款类型组”）.addClass（'has-error'）；
$（“#贷款类型组”）.append（“”+data.errors.loan_type+“”）；
}
if（数据、错误、个人或公司）{
$（“#个人或公司集团”）.addClass（'has-error'）；
$（“#个人或公司集团”）。追加（“”+data.errors.Personal_或_company+“”）；
}
if（数据.错误.当前\u财务人员\u ddl）{
$（“#当前财务人员ddl组”）.addClass（'has-error'）；
$（'current financer ddl group'）.append（''+data.errors.current_financer_ddl+''）；
}
if（数据、错误、现有贷款金额）{
$（“#现有贷款金额组”）.addClass（'has-error'）；
$（“#现有贷款金额组”）.append（“”+data.errors.existing_loan_amount+“”）；
}
if（数据、错误、属性和购买）{
$（“#物业购买组”）.addClass（'has-error'）；
$（“#物业购买组”）.append（“”+data.errors.property#u purchase+“”）；
}
if（数据、错误、施工状态）{
$（“#构造状态组”）.addClass（'has-error'）；
$（“#构造状态组”）.append（“”+data.errors.construction_status+“”）；
}
if（data.errors.email）{
$（“#电子邮件组”）.addClass（'has-error'）；
$（“#电子邮件组”）.append（“”+data.errors.email+“”）；
}
if（数据.错误.联系人姓名）{
$（“#联系人姓名组”）.addClass（'has-error'）；
$（'#联系人姓名-
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
$(".new-loan").click(function(){
$(".newloanTab1").show();
$(".refinanceTab1").hide();
$(".refinanceTab2").hide();
});
$(".refinance").click(function(){
$(".refinanceTab2").show();
$(".newloanTab1").hide();
});
$('input[type="radio"]').on('change', function() {
if ($('input[value="refinance"]').is(":checked") && $('input[value="commercial"]').is(":checked")) {
$(".refinanceTab1").show();
} else {
$(".refinanceTab1").hide();
}
});
});
</script>
<div class="col-sm-6 col-sm-offset-3">
<form id="loanform">
<div id="tabs">
<div id="mainForm">
<div id="loan-type-group" class="form-group">
<label for="loan_type">Loan Type <strong>*</strong></label>
<input type="radio" name="loan_type" value="new_loan" class="new-loan" />New Loan
<input type="radio" name="loan_type" value="refinance" class="refinance" />Refinance
</div>
</div>
<div style="display: none;" id="refinance" class="refinanceTab1">
<div id="individual-or-company-group" class="form-group">
<label for="individual_or_company">Individual / Company <strong>*</strong></label>
<input type="radio" name="individual_or_company" value="individual" class="refinance-individual" checked="checked" />Individual
<input type="radio" name="individual_or_company" value="company" class="refinance-company" />Company
</div>
</div>
<div style="display: none;" id="refinance" class="refinanceTab2">
<div id="current-financer-ddl-group" class="form-group">
<label for="current_financer_ddl">Current Financer <strong>*</strong></label>
<select name="current_financer_ddl" class="current-financer-ddl">
<option value="financer1">Financer 1</option>
<option value="financer2">Financer 2</option>
</select>
</div>
<div id="existing-loan-amount-group" class="form-group">
<label for="existing_loan_amount">Existing Loan Amount<strong>*</strong></label>
<input type="text" name="existing_loan_amount" class="existing-loan-amount">
</div>
</div>
<div style="display: none;" id="new-loan" class="newloanTab1">
<div id="property-purchase-group" class="form-group">
<label for="property_purchase">Property Purchase <strong>*</strong></label>
<input type="radio" name="property_purchase" value="yes" class="property-purchase" checked="checked" />Yes
<input type="radio" name="property_purchase" value="no" class="property-purchase" />No
</div>
<div id="construction-status-group" class="form-group">
<label for="construction_status">Construction Status <strong>*</strong></label>
<input type="radio" name="construction_status" value="completed" class="construction-status" checked="checked" />Completed
<input type="radio" name="construction_status" value="under-construction" class="construction-status" />Under-Construction
</div>
</div>
<div id="mainForm2">
<div id="email-group" class="form-group">
<label for="email">Email <strong>*</strong></label>
<input type="text" name="email" class="email">
</div>
<div id="contact-name-group" class="form-group">
<label for="contact_name">Contact Name <strong>*</strong></label>
<input type="text" name="contact_name" class="contact-name">
</div>
<div id="phone-group" class="form-group">
<label for="phone">Phone <strong>*</strong></label>
<input type="text" name="phone" class="phone">
</div>
</div>
<button type="submit" class="btn btn-success">Submit <span class="fa fa-arrow-right"></span></button>
</form>
<script src="call.js"></script>
</div>
$(document).ready(function() {
$('form').submit(function(event) {
$('.form-group').removeClass('has-error');
$('.help-block').remove();
var formData = {
'loan_type' : $('input[name=loan_type]:checked').val(),
'individual_or_company' : $('input[name=individual_or_company]:checked').val(),
'current_financer_ddl' : $('select[name=current_financer_ddl] option:selected').val(),
'existing_loan_amount' : $('input[name=existing_loan_amount]').val(),
'property_purchase' : $('input[name=property_purchase]:checked').val(),
'construction_status' : $('input[name=construction_status]:checked').val(),
'email' : $('input[name=email]').val(),
'contact_name' : $('input[name=contact_name]').val(),
'phone' : $('input[name=phone]').val(),
};
event.preventDefault();
$.ajax({
type : 'POST',
url : 'ajaxtest.php',
data : formData,
dataType : 'json',
encode : true,
success: function(data) {
if ( data.success == false ){
if (data.errors.loan_type) {
$('#loan-type-group').addClass('has-error');
$('#loan-type-group').append('<div class="help-block">' + data.errors.loan_type + '</div>');
}
if (data.errors.individual_or_company) {
$('#individual-or-company-group').addClass('has-error');
$('#individual-or-company-group').append('<div class="help-block">' + data.errors.individual_or_company + '</div>');
}
if (data.errors.current_financer_ddl) {
$('#current-financer-ddl-group').addClass('has-error');
$('#current-financer-ddl-group').append('<div class="help-block">' + data.errors.current_financer_ddl + '</div>');
}
if (data.errors.existing_loan_amount) {
$('#existing-loan-amount-group').addClass('has-error');
$('#existing-loan-amount-group').append('<div class="help-block">' + data.errors.existing_loan_amount + '</div>');
}
if (data.errors.property_purchase) {
$('#property-purchase-group').addClass('has-error');
$('#property-purchase-group').append('<div class="help-block">' + data.errors.property_purchase + '</div>');
}
if (data.errors.construction_status) {
$('#construction-status-group').addClass('has-error');
$('#construction-status-group').append('<div class="help-block">' + data.errors.construction_status + '</div>');
}
if (data.errors.email) {
$('#email-group').addClass('has-error');
$('#email-group').append('<div class="help-block">' + data.errors.email + '</div>');
}
if (data.errors.contact_name) {
$('#contact-name-group').addClass('has-error');
$('#contact-name-group').append('<div class="help-block">' + data.errors.contact_name + '</div>');
}
if (data.errors.phone) {
$('#phone-group').addClass('has-error');
$('#phone-group').append('<div class="help-block">' + data.errors.phone + '</div>');
}
}
else {
$('form').append('<div class="alert alert-success">' + data.message.success + '</div>');
alert('success');
}
}
});
});
});
$loan_type = $individual_or_company = $current_financer_ddl = $existing_loan_amount = $property_purchase = $construction_status = $email = $contact_name = $phone = "";
$errors = array();
$data = array();
if ($_SERVER["REQUEST_METHOD"] == "POST") {
if(empty($_POST["loan_type"])){
$errors['loan_type'] = "Loan Type is required";
}
else{
$loan_type = test_input($_POST["loan_type"]);
}
if($loan_type=="refinance" && $property_type=="commercial"){
if(empty($_POST["individual_or_company"])){
$errors['individual_or_company'] = "Individual / Company is required";
}
else{
$individual_or_company = test_input($_POST["individual_or_company"]);
}
}
if($loan_type=="refinance"){
if(empty($_POST["current_financer_ddl"])){
$errors['current_financer_ddl'] = "Current Financer is required";
}
else{
$current_financer_ddl = test_input($_POST["current_financer_ddl"]);
}
if(empty($_POST["existing_loan_amount"])){
$errors['existing_loan_amount'] = "Existing Loan Amount is required";
}
else{
$existing_loan_amount = test_input($_POST["existing_loan_amount"]);
if(!preg_match('/^[0-9]+(\\.[0-9]+)?$/',$existing_loan_amount)){
$errors['existing_loan_amount'] = "Only numeric is allowed.";
}
}
$property_purchase = $construction_status = "";
}
if($loan_type=="new_loan"){
if(empty($_POST["property_purchase"])){
$errors['property_purchase'] = "Property Purchase is required";
}
else{
$property_purchase = test_input($_POST["property_purchase"]);
}
if(empty($_POST["construction_status"])){
$errors['construction_status'] = "Construction Status is required";
}
else{
$construction_status = test_input($_POST["construction_status"]);
}
$existing_loan_amount = $current_financer_ddl = $individual_or_company = "";
}
if(empty($_POST["email"])){
$errors['email'] = "Email is required";
}
else{
$email = test_input($_POST["email"]);
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
$errors['email'] = "Invalid email format";
}
}
if(empty($_POST["contact_name"])){
$errors['contact_name'] = "Contact Name is required";
}
else{
$contact_name = test_input($_POST["contact_name"]);
if(!preg_match("/^[a-zA-Z ]*$/",$contact_name)) {
$errors['contact_name'] = "Only letters and white space are allowed";
}
}
if(empty($_POST["phone"])){
$errors['phone'] = "Phone is required";
}
else{
$phone = test_input($_POST["phone"]);
if(!preg_match('/^[0-9]+$/', $phone)){
$errors['phone'] = "Only numeric is allowed";
}
}
if ( ! empty($errors)) {
$data['http_success'] = false;
$data['errors'] = $errors;
} else {
$data['http_success'] = true;
$data['http_message'] = 'Success!';
$myUrl = "http://mortgage.redbrick.sg/api/lead/addlead";
$fields_string = "";
if(empty($individual_or_company)){
$individual_or_company = "individual";
}
$fields = array(
"loan_type" => $loan_type,
"individual_or_company" => $individual_or_company,
"current_financer_ddl" => $current_financer_ddl,
"existing_loan_amount" => $existing_loan_amount,
"property_purchase" => $property_purchase,
"construction_status" => $construction_status,
"email" => $email,
"contact_name" => $contact_name,
"phone" => $phone,
"apikey" => "some key"
);
foreach($fields as $key=>$value) {
$fields_string .= $key.'='.$value.'&';
}
$fields_string = rtrim($fields_string, '&');
$url = $myUrl.'?'.$fields_string;
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
$api_response = curl_exec($ch);
$resultStatus = curl_getinfo($ch, CURLINFO_HTTP_CODE);
if ($resultStatus == 200) {
$data['info'] = $resultStatus;
} else {
$data['info'] = 'Request failed - HTTP status code: ' . $resultStatus . '<br/>' .curl_error($ch);
}
curl_close($ch);
return $api_response;
}
}
function test_input($data) {
$data = trim($data);
$data = stripslashes($data);
$data = htmlspecialchars($data);
return $data;
}