我遇到的问题是:
1。让我的表单在提交表单之前验证是否选中了单选按钮。
2。当用户点击提交时重置表单(没有重置按钮),以便用户可以在不刷新页面的情况下提交另一个表单。
我正在尽力找到我面临的问题的解决方案,有很多教程和其他形式我可以尝试,但我想弄清楚如何使用这种特殊方法,因为这种形式对许多人来说效果很好我的项目
过去对我有用的原始表单只有姓名,电子邮件,电话和查询。但是这次我需要添加更多问题,这需要一个下拉选项和一些单选按钮。
我尽力使用在线资源和表单的原始工作来使其工作,但我无法对其进行验证。
如果填写了所有字段,表单会提交。 表单首先检查文本字段和下拉列表是否被选中,然后检查php服务器端错误,如长度,数字等 - 除了单选按钮。
我提出的单选按钮的最佳解决方案是检查字符串长度是否短于2个字母。但这不是正确的方法。
如果一个人想要多次提交查询,他们将无法使用该表格,除非刷新。
请帮助!!!
我尝试使用if(!isset ...)它没有用。 如果我尝试将新字段添加到//检查$ _POST vars已设置,如果有任何缺失则退出,表单中断! 对于其他情况,我无法在堆栈上使用大多数建议,我希望保持这种简单,而不必混合使用两种不同的表单方法。 我对编码的了解仍然很基础,所以我不知道如何解决这个问题。
jquery
<script type="text/javascript">
$(document).ready(function() {
$("#submit_btn").click(function() {
//collect input field values
var user_location = $('select[name=location]').val();
var user_chain = $('input:radio[name=chain]:checked').val();
var user_number = $('input:radio[name=number]:checked').val();
var user_first = $('input:radio[name=first]:checked').val();
var user_message = $('textarea[name=message]').val();
//simple validation at client's end
//we simply change border color to red if empty field using .css()
var proceed = true;
if(user_location=="Select Country") {
$('select[name=location]').css('border-color','red');
proceed = false;
}
//everything looks good! proceed...
if(proceed)
{
//data to be sent to server
post_data = {'userName':user_name, 'userEmail':user_email, 'userPhone':user_phone, 'userLocation':user_location, 'userChain':user_chain, 'userNumber':user_number, 'userFirst':user_first, 'userMessage':user_message};
//Ajax post data to server
$.post('contact_me.php', post_data, function(data){
//load success massage in #result div element, with slide effect.
$("#result").hide().html('<div class="success">'+data+'</div>').slideDown();
//reset values in all input fields
$('#contact_form input').val('');
$('#contact_form textarea').val('');
$('#contact_form select').val('');
$('#contact_form input[type:radio]').val('');
}).fail(function(err) { //load any error data
$("#result").hide().html('<div class="error">'+err.statusText+'</div>').slideDown();
});
}
});
//reset previously set border colors and hide all message on .keyup()
$("#contact_form input, #contact_form textarea, #contact_form select").keyup(function() {
$("#contact_form input, #contact_form textarea, #contact_form select").css('border-color','');
$("#result").slideUp();
});
});
</script>
PHP服务器端
<?php
if($_POST)
{
//check if its an ajax request, exit if not
if(!isset($_SERVER['HTTP_X_REQUESTED_WITH']) AND strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) != 'xmlhttprequest') {
die();
}
$to_Email = "xyz@gmail.com"; //Replace with recipient email address
$subject = 'Enquiry for Contract Packaging'; //Subject line for emails
//check $_POST vars are set, exit if any missing
if(!isset($_POST["userName"]) || !isset($_POST["userEmail"]) || !isset($_POST["userPhone"]) || !isset($_POST["userMessage"]))
{
die();
}
//Sanitize input data using PHP filter_var().
$user_Location = filter_var($_POST["userLocation"], FILTER_SANITIZE_STRING);
$user_Chain = filter_var($_POST["userChain"], FILTER_SANITIZE_STRING);
$user_Number = filter_var($_POST["userNumber"], FILTER_SANITIZE_STRING);
$user_First = filter_var($_POST["userFirst"], FILTER_SANITIZE_STRING);
$user_bodymessage ="NAME: ".$user_Name."\n\n";
$user_bodymessage.="EMAIL: ".$user_Email."\n\n";
$user_bodymessage.="PHONE: ".$user_Phone."\n\n";
$user_bodymessage.="LOCATION: ".$user_Location."\n\n";
$user_bodymessage.="CHAIN: ".$user_Chain."\n\n";
$user_bodymessage.="QUANTITY: ".$user_Number."\n\n";
$user_bodymessage.="FIRST TIME: ".$user_First."\n\n";
$user_bodymessage.="ENQUIRY: ".$user_Message."\n\n";
//additional php validation
if(strlen($user_Name)<3) // If length is less than 4 it will throw an HTTP error.
{
header('HTTP/1.1 500 Name is too short or empty!');
exit();
}
if(!filter_var($user_Email, FILTER_VALIDATE_EMAIL)) //email validation
{
header('HTTP/1.1 500 Please enter a valid email!');
exit();
}
if(!is_numeric($user_Phone)) //check entered data is numbers
{
header('HTTP/1.1 500 Only numbers allowed in phone field');
exit();
}
if(strlen($user_Chain)<2) // If length is less than 4 it will throw an HTTP error.
{
header('HTTP/1.1 500 Have you missed a few questions?');
exit();
}
if(strlen($user_Message)<5) //check emtpy message
{
header('HTTP/1.1 500 Too short message! Please enter something.');
exit();
}