首先，我不想修改Wordpress模板中的任何主脚本或原始脚本。
我可以直接在Wordpress页面中创建表单（不需要数据库）吗？或者我将创建插件以将其附加到特定的Wordpress页面上？
我已在Wordpress外部测试并成功使用AJAX Call。我试图在页面编辑器的文本模式下插入脚本，但在更新页面后它无法正常工作。
一般工作流程如下：
HTML（form.html）
<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>
JavaScript（call.js）
$(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');
}
}
});
});
});
PHP（process.php）
$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;
}
有什么建议吗？