0
저는 Javascript/Ajax를 사용하여 월별 지불액을 계산할 때 "Amount Financed"및 "Interest Rate"를 사용하는 모기지 계산기를 만들고 있습니다. "금액"& "interest"는 사용자가 입력하며 PHP 프로그램에서 월별 지불액이 계산되어 "지불"필드로 다시 전송됩니다.자바 스크립트 : 유효성 검사 및 숨겨진 필드 값이있는 버튼을 제출하십시오.
계산 된 지불을 표시하려면 사용자 입력의 유효성을 검사하고 "지불"필드를 가져와야합니다.
바로 지금 제출 방법을 올바르게 입력했는데 계산 된 금액이 별도의 페이지 (인쇄 라인을 제외하고는 비어있는 PHP 페이지)에 표시됩니다. 다음은
var sendValues = amount + '|' + interest;
XMLHttpRequestObject.send(sendValues);
:
<link rel="stylesheet" type="text/css" href="css/king.css" />
<script>
var XMLHttpRequestObject = false;
if (window.XMLHttpRequest) {
XMLHttpRequestObject = new XMLHttpRequest();
} else if (window.ActiveXObject) {
XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
}
function calculateRate()
{
if(XMLHttpRequestObject) {
XMLHttpRequestObject.open("POST", "assignment_8_calculate.php");
XMLHttpRequestObject.setRequestHeader('Content-Type',
'application/x-www-form-urlencoded');
XMLHttpRequestObject.onreadystatechange = function()
{
if (XMLHttpRequestObject.readyState == 4 &&
XMLHttpRequestObject.status == 200) {
var returnedData = XMLHttpRequestObject.responseText;
var payment = document.getElementById('payment');
payment.value = returnedData;
}
}
var amount = document.getElementById('amount').value;
var interest = document.getElementById('interest').value;
XMLHttpRequestObject.send(amount);
XMLHttpRequestObject.send(interest);
}
return false;
}
function validateForm()
{
var errmsg = '';
var amount = document.getElementById('amount').value;
if (amount == null || amount == "")
{
errmsg += "<br />You must enter an 'Amount Financed'";
} else {
if (isNaN(amount))
{
errmsg += "<br />'Amount Financed' must be a number";
}
}
var interest = document.getElementById('interest').value;
if (interest == null || interest == "")
{
errmsg += "<br />You must enter an 'Interest Rate'";
} else {
if (isNaN(interest))
{
errmsg += "<br />'Interest Rate' must be a number";
}
}
var messageDiv = document.getElementById('messagediv');
messageDiv.innerHTML = errmsg;
if (errmsg == '')
{
return true;
} else {
return false;
}
}
</script>
</head>
<body>
<body>
<a href="assignment_8.php"><img src="images/KingLogo.jpg"></a><br>
<div id="mortgagecalculatorresults">
<h2>Mortgage Calculation</h2>
<div id="calculator">
<form id="mortgage" method="post" action="assignment_8_calculate.php">
<table>
<tr>
<td>Amount Financed:</td>
<td><input type="text" name="amount" id="amount" ></td>
</tr>
<tr>
<td>Interest Rate:</td>
<td><input type="text" name="interest" id="interest" ></td>
</tr>
<tr>
<td>Calculated Monthly Payment:</td>
<td><input type="text" disabled="disabled" name="payment" id="payment" ></td>
</tr>
</table>
<p><input type="submit" value="Calculate Payment" onclick="return validateForm()" onsubmit=" calculateRate();">
<input type="reset" />
</p>
</form>
</div>
<div style="color: red;" id="messagediv">
</div>
</body>
</html>
나는이 같은 하나의 전송에 PHP 프로그램으로 값을 전송 시도 : 여기
는 HTML 페이지 내 코드입니다 PHP 페이지에 대한 코드 (코드에서 주석을 달았습니다. 예를 들어, 하나의 값만 보내고 PHP 내에서 코드를 내 보려고했을 때 주석을 달았습니다) :<?php
//$sendValues = $_POST['sendValues'];
$amount = $_POST['amount'];
$interest = $_POST['interest'];
//list($amount, $interest) = explode('|', $sendValues);
$payment = ($amount * $interest)/12;
//$payment = $sendValues/12;
$payment = number_format ($payment, 2);
print $payment;
?>
난 그냥 버튼과 버튼을 코드가 아닌 경우 직접 claculateRate 함수에 연결하고 쓸모없는 값이 별도의 PHP 페이지로 보내지 않고 숨겨진 필드에 반환되는 유효성 검사를 생략하지만, 값, 제출 보낸 메일은 항상 0.00입니다.
고맙습니다.
업데이트 된 코드 : 작동하지 않음 - 가져 오기 오류 :
".
요청 방법 POST를 허용하지 방법은 URL /testfiles/Ungar_Bradley_1585_PHPwithMySQL/assignment_8_mortgage.html 허용되지 않습니다"
"버튼"유형을 "제출"으로 변경하는 경우 값이 반환되는 "지불"필드에 0.00 값이 표시됩니다.
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/king.css" />
<script>
var XMLHttpRequestObject = false;
if (window.XMLHttpRequest) {
XMLHttpRequestObject = new XMLHttpRequest();
} else if (window.ActiveXObject) {
XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
}
function calculateRate()
{
if(XMLHttpRequestObject) {
XMLHttpRequestObject.open("POST", "assignment_8_calculate.php");
XMLHttpRequestObject.setRequestHeader('Content-Type',
'application/x-www-form-urlencoded');
XMLHttpRequestObject.onreadystatechange = function()
{
if (XMLHttpRequestObject.readyState == 4 &&
XMLHttpRequestObject.status == 200) {
var returnedData = XMLHttpRequestObject.responseText;
var payment = document.getElementById('payment');
payment.value = returnedData;
}
}
var amount = document.getElementById('amount').value;
var interest = document.getElementById('interest').value;
XMLHttpRequestObject.send(amount);
XMLHttpRequestObject.send(interest);
}
return false;
}
function validateForm()
{
var errmsg = '';
var amount = document.getElementById('amount').value;
if (amount == null || amount == "")
{
errmsg += "<br />You must enter an 'Amount Financed'";
} else {
if (isNaN(amount))
{
errmsg += "<br />'Amount Financed' must be a number";
}
}
var interest = document.getElementById('interest').value;
if (interest == null || interest == "")
{
errmsg += "<br />You must enter an 'Interest Rate'";
} else {
if (isNaN(interest))
{
errmsg += "<br />'Interest Rate' must be a number";
}
}
var messageDiv = document.getElementById('messagediv');
messageDiv.innerHTML = errmsg;
if (errmsg == '')
{
calculateRate();
return true;
} else {
return false;
}
}
</script>
</head>
<body>
<body>
<a href="assignment_8.php"><img src="images/KingLogo.jpg"></a><br>
<div id="mortgagecalculatorresults">
<h2>Mortgage Calculation</h2>
<div id="calculator">
<form id="mortgage" method="post">
<table>
<tr>
<td>Amount Financed:</td>
<td><input type="text" name="amount" id="amount" ></td>
</tr>
<tr>
<td>Interest Rate:</td>
<td><input type="text" name="interest" id="interest" ></td>
</tr>
<tr>
<td>Calculated Monthly Payment:</td>
<td><input type="text" disabled="disabled" name="payment" id="payment" ></td>
</tr>
</table>
<p><input type="submit" value="Calculate Payment" onclick="return validateForm()" onsubmit="return false;">
<input type="reset" />
</p>
</form>
</div>
<div style="color: red;" id="messagediv">
</div>
</body>
</html>
좋아 보이지만 jquery를 사용할 수 없습니다. : – Brad
jQuery 시스템에서 읽을 수있는 방법이 있습니다. – James