PHP的形式三个输入，选择两个，并根据第二拳计算第三
[英]php form three inputs, choose two and calculate the thrid one according to thefist two
问题描述
我正在从事php任务。 我在表单输入上有问题。 基本上，我需要构建一个需要三个输入的计算器，即距离，速度和花费的时间。 如果用户输入距离和速度，则将计算时间；如果用户输入时间和速度，则将计算距离。 如果用户仅提供一个输入，将会出现一条错误消息，提醒用户提供足够的输入。
我不能将以上内容变成一种形式。 相反，我将三种形式合并为一个html文件。
<html> <head> <title>Distance,Speed,Time</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <h4>Time from Distance and Speed</h4> <form method="POST" action="calculation.php" > <table> <tr> <td>distance :</td> <td><input type=text name=distvalue size="15" value="" onfocus="clearcell(this.value)"></td> </tr> <tr> <td>speed :</td> <td><input type=text name="speedvalue" size="15" value="" onfocus="clearcell(this.value)"></td> </tr> </table> <table> <tr> <td>Time is :</td> <td><input type="text" name="hourvalue" size="5" value="" readonly></td> <td>Hours</td> <td><input type="text" name="hourvalue" size="5" value="" readonly></td> <td>Minutes</td> <td><input type="text" name="hourvalue" size="5" value="" readonly></td> <td>Seconds</td> </tr> </table> <input type=button value="Calculate" > <input type=button value="Reset" > </form> <hr> <h4>Distance from Speed and Time</h4> <form method="POST" action="calculation.php"> <table> <tr> <td>speed :</td> <td><input type="text" name="speedvalue" size="15" value="1" onfocus="clearcell(this.value)"></td> </tr> </table> <table> <tr> <td> time:</td> <td><input type="text" name=hourvalue size="5" value="0" onfocus="clearcell(this.value)"></td> <td>Hours</td> <td><input type="text" name=minutevalue size="5" value="0" onfocus="clearcell(this.value)"></td> <td>Minutes</td> <td><input type="text" name=secondvalue size="5" value="0" onfocus="clearcell(this.value)"></td> <td>Seconds</td> </tr> </table> <table> <tr> <td>Distance is :</td> <td><input type=text name=distvalue size=15 value="" readonly></td> </tr> </table> <input type=button value="Calculate" > <input type=button value="Reset" > </form> <hr> <h4>Speed from Distance and Time</h4> <form method="POST" action="calculation.php"> <table> <tr> <td> distance :</td> <td><input type=text name=distvalue size=15 value="1" onfocus="clearcell(this.value)"></td> </tr> </table> <table> <tr> <td> time:</td> <td><input type=text name="hourvalue" size=5 value="0" onfocus="clearcell(this.value)"></td> <td>Hours</td> <td><input type=text name=minutevalue size=5 value="0" onfocus="clearcell(this.value)"></td> <td>Minutes</td> <td><input type=text name=secondvalue size=5 value="0" onfocus="clearcell(this.value)"></td> <td>Seconds</td> </tr> </table> <table> <tr> <td>Speed is :</td> <td><input type=text name=speedvalue size=15 value="1" readonly></td> </tr> </table> <input type=button value="Calculate" > <input type=button value="Reset" > </form> </body> </html>
在我的php部分中，我计划单独进行计算。 例如计算时间：
$distance = filter_input("disvalue");
$speed =filter_input("speedvalue");
$time = $distace / $speed ;
function convertTime($time)//
{
$seconds = ($dec * 3600);
$hours = floor($dec);
$seconds -= $hours * 3600;
$minutes = floor($seconds / 60);
$seconds -= $minutes * 60;
Return "YOu spent"$hours."hours,"$seconds."seconds and"$seconds.seconds".
但是它根本没有计算。
我想知道是否有人可以帮助我找到一种使用较短代码完成此任务的简单方法。
1 个解决方案
解决方案1
0 2015-10-11 05:29:14
这是如何使用ajax的提示...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>ini helper</title>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" />
<script src="js/jquery-2.1.4.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script>
$(document).ready(function() {
$('#stepOne').click(function(event) {
var speed = $("#speedvalue").val();
var dist = $("#distvalue").val();
var hour = $("#hourvalue").val();
var min = $("#minutevalue").val();
var sec = $("#secondvalue").val();
var seconds = parseInt(hour * 3600) + parseInt(min *60) + parseInt(sec) ;
if(speed == 0 || speed =='' ){
if(seconds == 0 || dist =='' || dist ==0){
alert('Must input time and distance');
return false;
}else{
//apply your logic here Or give a ajax request to your php page
var fData = $('#ajaxForm').serialize();
var actionName = '_process/processText.php';
$.ajax({
type : 'POST',
url : actionName,
data : fData,
dataType : 'html',
encode : true
})
.done(function(data) {
$("#speedvalue").val(data);
})
.always(function(data){
console.log(data);
})
.fail(function(data) {
console.log(data);
});
}
}else if(seconds == 0){
//validate distance then calculate time with ajax request...
//do it yourself
alert('what is the time?');
}else {
//calculate dist with ajax request...
alert('what is the distance?');
}
event.preventDefault();
return false;
});
});//end of ready function
</script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12"> <h1>Distance from Speed and Time</h1><hr/></div>
<div class="col-md-12">
<form method="POST" class="form-horizontal atiqFormStyle" id="ajaxForm">
<table>
<tr>
<td>speed :</td>
<td><input type="text" id="speedvalue" name="speedvalue" size="15" value="1" onfocus="clearcell(this.value)"></td>
</tr>
</table>
<table>
<tr>
<td> time:</td>
<td><input type="text" id="hourvalue" name=hourvalue size="5" value="0" onfocus="clearcell(this.value)"></td>
<td>Hours</td>
<td><input type="text" id="minutevalue" name=minutevalue size="5" value="0" onfocus="clearcell(this.value)"></td>
<td>Minutes</td>
<td><input type="text" id="secondvalue" name=secondvalue size="5" value="0" onfocus="clearcell(this.value)"></td>
<td>Seconds</td>
</tr>
</table>
<table>
<tr>
<td>Distance is :</td>
<td><input type=text name="distvalue" name=distvalue size=15 value="0"></td>
</tr>
</table>
<button id="stepOne" class="btn btn-success"> Calculate </button>
<input type=button value="Reset" >
</form>
</div>
</div>
<div class="row">
<div class="col-md-12" id="result"></div>
</div>
</div>
</body>
</html>
或者，您可以不通过JavaScript验证就发送整个表格，然后进行所有php验证和计算...请注意，数据类型为json，因此您需要在php操作[$data['flag'] ='speed' $data['result'] ='result'; echo json_encode($data);] [$data['flag'] ='speed' $data['result'] ='result'; echo json_encode($data);]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Form ini helper</title>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" />
<script src="js/jquery-2.1.4.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script>
$(document).ready(function() {
$('#stepOne').click(function(event) {
var fData = $('#ajaxForm').serialize();
var actionName = '_process/processText.php';
$.ajax({
type : 'POST',
url : actionName,
data : fData,
dataType : 'json',
encode : true
})
.done(function(data) {
if(data.flag == 'speed')
$("#speedvalue").val(data);
else if(data.flag == 'time'){
//set the times value
}else if(data.flag == 'dist'){
//set the distance value
}
})
.always(function(data){
console.log(data);
})
.fail(function(data) {
console.log(data);
});
});
});//end of ready function
</script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12"> <h1>Distance from Speed and Time</h1><hr/></div>
<div class="col-md-12">
<form method="POST" class="form-horizontal atiqFormStyle" id="ajaxForm">
<table>
<tr>
<td>speed :</td>
<td><input type="text" id="speedvalue" name="speedvalue" size="15" value="1" onfocus="clearcell(this.value)"></td>
</tr>
</table>
<table>
<tr>
<td> time:</td>
<td><input type="text" id="hourvalue" name=hourvalue size="5" value="0" onfocus="clearcell(this.value)"></td>
<td>Hours</td>
<td><input type="text" id="minutevalue" name=minutevalue size="5" value="0" onfocus="clearcell(this.value)"></td>
<td>Minutes</td>
<td><input type="text" id="secondvalue" name=secondvalue size="5" value="0" onfocus="clearcell(this.value)"></td>
<td>Seconds</td>
</tr>
</table>
<table>
<tr>
<td>Distance is :</td>
<td><input type=text name="distvalue" name=distvalue size=15 value="0"></td>
</tr>
</table>
<button id="stepOne" class="btn btn-success"> Calculate </button>
<input type=button value="Reset" >
</form>
</div>
</div>
<div class="row">
<div class="col-md-12" id="result"></div>
</div>
</div>
</body>
</html>
PHP 使用一种形式将两种不同的文件类型与两种不同的输入上传到两个不同的目录中
[英]PHP Upload Two Different File Types Using One Form With Two Different Inputs Into Two Different Directories
在 PHP 中将数字 (1, 2, 3) 转换为字符串 (一, 二, 三)
[英]Converting a number (1, 2, 3) to a string (one, two, three) in PHP
PHP：如何与两个单独的表单输入共享一个下拉菜单（一个文本区域，一个文件上传）
[英]PHP: how can I share one drop-down menu with two separate form inputs (one textarea, one file upload)
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.