ユーザー入力を検証するには、Javascript ファイルが必要です。名前が文字のみであること、年齢が 18 歳以上 110 歳以下であること、アイテムが選択されていることを確認する必要があります。また、適切にフォーマットされていないフォームを拒否したいと思います。フォーカスされた入力ボックスを検証するスクリプトを取得しようとしました。何が間違っていますか?
<!--catalog.php
A catalog exploring different study material in IT.
-->
<head>
<link type="text/css" rel="stylesheet" href="style.css"/>
<title>Study Guides</title>
</head>
<body>
<h2 align="center">A Simple Table for Certification Preparation</h2>
<center>
<label><p>Name: <input type="text" id="custName"; onchange= "custName_onchange()"; size="32";</p></label>
<label><p>Age: <input type="text" id="custAge" onblur="custAge()" size="3" maxlength="3";</p></label>
<table border="1">
<tr><th>Selection</th> <th>Book</th> <th>Image</th> <th>Description</th> <th>Unit Price</th></tr>
<tr>
<td> <p> <label> <input type = "radio" name = "price" value = "$34.13" checked = "checked" /></label></p></td>
<td>CompTIA A+</td>
<td><img src = "images/A+.jpeg" height = "150" width = "100" alt= "Picture of CompTIA A+ Book"/></td>
<td>The CompTIA A+ certification is the starting point for a career in IT. The exam covers maintenance of PCs, mobile devices, laptops, operating systems and printers.</td>
<td>$34.13</td>
</tr>
<tr>
<td> <p> <label> <input type = "radio" name = "price" value = "$31.16" checked = "checked" /></label></p></td>
<td>CompTIA Network+</td>
<td><img src = "images/Network+.jpeg" height = "150" width = "100" alt= "Picture of CompTIA Network+ Book"/></td>
<td>The exam covers network technologies, installation and configuration, media and topologies, management, and security. Candidate job roles include network administrator, network technician, network installer, help desk technician and IT cable installer.</td>
<td>$31.16</td>
</tr>
<tr>
<td> <p> <label> <input type = "radio" name = "price" value = "$29.08" checked = "checked" /></label></p></td>
<td>CompTIA Security+</td>
<td><img src = "images/Security+.jpeg" height = "150" width = "100" alt= "Picture of CompTIA Security+ Book"/></td>
<td>CompTIA Security+ not only ensures that candidates will apply knowledge of security concepts, tools, and procedures to react to security incidents, it ensures that security personnel are anticipating security risks and guarding against them.</td>
<td>$29.08</td>
</tr>
<tr>
<td> <p> <label> <input type = "radio" name = "price" value = "$35.17" checked = "checked" /></label></p></td>
<td>CompTIA Linux+</td>
<td><img src = "images/Linux+.jpeg" height = "150" width = "100" alt= "Picture of CompTIA Linux+ Book"/></td>
<td>CompTIA Linux+ Powered by LPI is a high-stakes, vendor-neutral certification that validates the fundamental knowledge and skills required of junior Linux administrators.</td>
<td>$35.17</td>
</tr>
<tr>
<td> <p> <label> <input type = "radio" name = "price" value = "$31.50" checked = "checked" /></label></p></td>
<td>Cisco CCNA</td>
<td><img src = "images/CCNA.jpeg" height = "150" width = "100" alt= "Picture of Cisco CCNA Book"/></td>
<td> The CCNA Routing and Switching validates the ability to install, configure, operate, and troubleshoot medium-size routed and switched networks.</td>
<td>$31.50</td>
</tr>
</table>
<form action = "" id="form1">
<p>
<input type = "button" value = "submit" id="btnSubmitForm" onclick="btnSubmitForm_onclick()"/>
<input type = "button" value = "reset" />
</p>
</form>
<a href= "Home.php">Back to Home</a><br />
<script type = "text/javascript" src = "catalog.js" >
</script>
</p>
</form>
</center>
</body>
</html>
//JavaScript to Validate Form
function btnSubmitForm_onclick()
{
var myForm= document.form1;
if(myForm.custAge.value=="" || myForm.custName=="")
{
alert("Please fill out entire form before submission.");
if(myForm.custName=="")
{
myForm.custName.focus();
}
else
{
myForm.custAge.focus();
}
}
else
{
alert("Submission Accepted" + myForm.custName.value);
}
}
function custAge_onblur()
{
var custAge= custAge;
if (isNaN(custAge.value)==true)
{
alert("Please enter a valid age");
custAge.focus();
custAge.select();
}
if (age>=18 || age<=110)
{
return true;
}
if(!(age>=18 || age<=110))
{
alert("Your age is NOT between 18 and 110.")
return false;
}
}
function custName_onchange()
{
var custName= custName;
if(custName<4)
{
alert("The name you entered ("+custName.value+
")is not in the correct form. \n"+
"The correct form is: First-name Last-name \n"+
"Please try again.")
return false;
}
else
{
return true;
}
}