Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/426.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
JavaScript:为什么在使用页面之间的数据传输时,在Submit上运行的表单验证停止工作?_Javascript_Html_Forms_Validation_Transfer - Fatal编程技术网

JavaScript:为什么在使用页面之间的数据传输时,在Submit上运行的表单验证停止工作?

JavaScript:为什么在使用页面之间的数据传输时,在Submit上运行的表单验证停止工作?,javascript,html,forms,validation,transfer,Javascript,Html,Forms,Validation,Transfer,当我不使用.getitem和setitem将数据从其他页面传递到查询页面时,我的表单验证代码工作正常。我有点知道问题出在哪里,但我的知识太肤浅,我无法理解,也不知道如何解决它。有人知道该怎么办吗 这是产品页面的第一个HTML文件(相关代码): 查询 这是查询页面: <!-- enquiry form --> <form id="detail" method="post" class="font-josefin"

当我不使用.getitem和setitem将数据从其他页面传递到查询页面时,我的表单验证代码工作正常。我有点知道问题出在哪里,但我的知识太肤浅,我无法理解,也不知道如何解决它。有人知道该怎么办吗

这是产品页面的第一个HTML文件(相关代码):

查询
这是查询页面:

<!-- enquiry form -->
    <form id="detail" method="post" class="font-josefin" action="mailto:101231212@students.swinburne.edu.my" novalidate="novalidate" onsubmit="return validateForm()">
        <fieldset>
            <legend>Personal Details</legend>
                <label class= 'margin-l50' for="fname">Name:</label><br/>
                <input class= 'margin-l50' type="text" id="fname" name="fname" placeholder="Your name" size="50" maxlength="30" required="required"/>*<br/>
                <label class= 'margin-l50' for="fmail">Email:</label><br/>
                <input class= 'margin-l50' type="email" id="fmail" name="fmail" placeholder="Your email" size="50" maxlength="30" required="required"/>*<br/>
                <label class= 'margin-l50' for="fhp">Personal Phone Number:</label><br/>
                <input class= 'margin-l50' type="tel" id="fhp" name="fhp" placeholder="###-#######" size="50" required="required"/>*
        </fieldset>

        <fieldset>
            <legend>Address</legend>
                <label class= 'margin-l50' for="stname">Street Name:</label><br/>
                <input class= 'margin-l50' type="text" id="stname" name="stname" placeholder="Street" size="50" maxlength="40" required="required"/>*<br/>
                <label class= 'margin-l50' for="city">City/Town:</label><br/>
                <input class= 'margin-l50' type="text" id="city" name="city" placeholder="City/Town" size="50" maxlength="20" required="required"/>*<br/>
                <label class= 'margin-l50'>State:</label><br/>
                    <select class= 'margin-l50' name="state" id="statedrop">
                        <optgroup label="States">
                                <script>statelist()</script>
                        </optgroup>
                    </select>*<br/><br/>
                <label class= 'margin-l50' for="fhp">Postcode:</label><br/>
                <input class= 'margin-l50' type="text" id="postcode" name="postcode" placeholder="#####" size="50" required="required"/>*
        </fieldset>

        <fieldset>
            <legend>Enquiries</legend>
                <label class= 'margin-l50' for="subject" id="subjectLabel">Subject Enquiry On:</label><br/>
                <input class= 'margin-l50' type="text" name="subject" id="subject" size="40" /><br/>
                <label class= 'margin-l50'>Your queries:</label><br/>
                <label class= 'margin-l50'>Service Categories:</label><br/>
                    <select class= 'margin-l50' name="query" id="servicedrop" onchange="change()">
                        <optgroup label="Services">
                                <script>serviceList()</script>
                        </optgroup>
                    </select>*<br/><br/>
                <label class= 'margin-l50'>Description of your queries</label><br/>
                <textarea class= 'margin-l50' id="description" name="description" rows="5" cols="50" placeholder="Enter your queries"></textarea>
        </fieldset>

        <fieldset>
            <legend>Making Appointment</legend>
            <label class= 'margin-l50' for="date">Date:</label>
            <input class= 'margin-l50' type="date" id="date" name="date"/><br/>
            <label class= 'margin-l50' for="time">Time:</label>
            <input class= 'margin-l50' type="time" id="time" name="time"/><br/><br/>
            <p class= 'margin-l50'>Our team will contact you within 1 business day upon booking to confirm the following booking.</p><br/>
        </fieldset>

        <div class="button_container">
            <button type="submit" class="enqbutton font-josefin" value="Submit">Submit</button>
            <button type="reset" class="enqbutton font-josefin" value="Reset">Reset</button>
        </div>
    </form>

个人资料
名称:
*
电子邮件:
*
个人电话号码:
* 地址 街道名称:
*
城市/城镇:
*
状态:
状态列表() *

邮政编码:
* 查询 主题查询:

您的查询:
服务类别:
服务列表() *

查询说明
预约 日期:
时间:

我们的团队将在预订后1个工作日内与您联系,以确认以下预订。


提交 重置
这是javascript文件

var gErrorMsg = "";


function init() {
    displayitem();
}



function validateForm(){
    "use strict"; //directive to ensure variables are declared
    var isAllOK = false;
    gErrorMsg = ""; //reset error message
    var nameOK = chkName();
    var emailOK = chkEmail();
    var hpOk = chkHp();
    var stOk = chkSt();
    var cityOk = chkCt();
    var stateOk = chkState();
    var postOk = chkPost();
    var subOk = chkSubject();
    var selectOk = chkSelect();
    if (nameOK && emailOK && hpOk && stOk && cityOk && stateOk && postOk && selectOk){
        isAllOK = true;
    }
    else{
        alert(gErrorMsg); 
        gErrorMsg = ""; 
        isAllOK = false;
    }
    return isAllOK;
}


function chkName() {
    var name = document.getElementById("fname").value;
    var pattern = /^[a-zA-Z ]+$/
    var nameOk = true;
    if ((name.length == 0)){
        gErrorMsg = gErrorMsg + "Please enter your name\n"
        nameOk = false; 
    }

    else if ((name.length > 25)){
        gErrorMsg = gErrorMsg + "Input name must be within 25 characters.\n"
        nameOk = false; 
    }

    else{
        if (!pattern.test(name)){
            gErrorMsg = gErrorMsg + "Your name must only contain alpha characters\n"
            nameOk = false;
        }
    }
    return nameOk;
}

function chkEmail() {
    var email = document.getElementById("fmail");
    var result = false;
    var pattern = /[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-za-zA-Z0-9.-]{1,4}$/;
    if (pattern.test(email.value)){
        result = true;
    }
    else{ //braces a good idea even if not strictly needed for single statement
        result = false;
        gErrorMsg = gErrorMsg + "Enter a valid email address\n"
    }
    return result;
}

function chkHp(){
    var hp = document.getElementById("fhp").value;
    var result = true;
    var pattern = /^(\+?6?01)[0|1|2|3|4|6|7|8|9]\-*[0-9]{7,8}$/;
    if (pattern.test(hp)){
        result = true;
    }
    else{
        result = false;
        gErrorMsg = gErrorMsg + "Enter a valid Malaysian phone numbers (11 numerical digits allowed for numbers with '011' prefix) \n"
    }
    return result;
}

function chkSt() {
    var street = document.getElementById("stname").value;
    var pattern = /^[a-zA-Z ]+$/
    var stOk = true;
    if ((street.length == 0)){
        gErrorMsg = gErrorMsg + "You must enter the name of the street of your living place\n"
        stOk = false; 
    }

    else if ((street.length > 20)){
        gErrorMsg = gErrorMsg + "Input street name must be within 20 characters\n"
        stOk = false; 
    }

    else{
        if (!pattern.test(street)){
            gErrorMsg = gErrorMsg + "Street name must only contain alpha characters\n"
            stOk = false;
        }
    }
    return stOk;
}

function chkCt() {
    var city = document.getElementById("city").value;
    var pattern = /^[a-zA-Z ]+$/
    var cityOk = true;
    if ((city.length == 0)){
        gErrorMsg = gErrorMsg + "You must enter the city of your living place\n"
        cityOk = false; 
    }

    else if ((city.length > 15)){
        gErrorMsg = gErrorMsg + "Input city name must be within 15 characters\n"
        cityOk = false; 
    }

    else{
        if (!pattern.test(city)){
            gErrorMsg = gErrorMsg + "City name must only contain alpha characters\n"
            cityOk = false;
        }
    }
    return cityOk;
}

function chkState(){
    var selected = false;
    var state = document.getElementById("statedrop").value;
    if (state!="------"){
        selected = true;
    }
    else{
        selected = false;
        gErrorMsg = gErrorMsg + "You must select your state\n"
    }
    return selected;
}

function chkPost (){
    var post = document.getElementById("postcode").value;
    var result = true;
    var pattern = /^[0-9]{5}$/;
    if (pattern.test(post)){
        result = true;
    }
    else{
        result = false;
        gErrorMsg = gErrorMsg + "Enter a valid Malaysian postcode with only 5 numerical digits\n"
    }
    return result;
}

function chkSubject() {
    var sub = document.getElementById("subject").value;
    var pattern = /^[a-zA-Z ]+$/
    var subOk = true;
    if ((sub.length == 0)){
        gErrorMsg = gErrorMsg + "Subject is empty, must select category and service to enquiry on\n"
        nameOk = false; 
    }

    return nameOk;
}

function chkSelect(){
    var selected = false;
    var ser = document.getElementById("servicedrop").value;
    if (ser!="Select a category and service"){
        selected = true;
    }
    else{
        selected = false;
        gErrorMsg = gErrorMsg + "You must select a category and service for your enquiry\n"
    }
    return selected;
}





// Array 



function serviceList() {
    var select = document.getElementById("servicedrop");

    var options = [
        "Select a category and service",
        "Enclosed Space Sanitisation: Home",
        "Enclosed Space Sanitisation: Office",
        "Enclosed Space Sanitisation: Inventory",
        "Enclosed Space Sanitisation: Sport Facilities",
        "Event Hygiene Management: Funeral",
        "Event Hygiene Management: Sports Event",
        "Event Hygiene Management: Gatherings",
        "Event Hygiene Management: Exhibitions",
        "Wide Area Sanitisation: Hosuing Area",
        "Wide Area Sanitisation: Shopping Complex",
        "Wide Area Sanitisation: School Area",
        "Wide Area Sanitisation: Food Court",
        "Object Disinfection: Vehicle",
        "Object Disinfection: Luggage",
        "Object Disinfection: Walkthorugh Sanitisation",
        "Object Disinfection: Professional Gears"
    ];
    for (var i = 0; i < options.length; i++) {
        var opt = options[i];
        var el = document.createElement("option");
        el.textContent = opt;
        el.value = opt;
        select.appendChild(el);
    }
}


function statelist() {
    var select = document.getElementById("statedrop");

    var options = ["------", "Johor", "Kedah", "Kelantan", "Kuala Lumpur", "Labuan", "Malacca", "Negeri Sembilan", "Pahang", "Perak", "Perlis", "Penang", "Sabah", "Sarawak", "Selangor", "Terengganu"];

    for (var i = 0; i < options.length; i++) {
        var opt = options[i];
        var el = document.createElement("option");
        el.textContent = opt;
        el.value = opt;
        select.appendChild(el);
    }
}

function makeAnchor() {
    var div = document.createElement('div');
    var options = ['ENCLOSED SPACE SANITISATION','EVENT HYGIENE MANAGEMENT', 'WIDE AREA SANITISATION', 'OBJECT DISINFECTION'];
    
    for(var i = 0; i < options.length; i++) {
        // Create the list item:
        var a = document.createElement('a');
        var opt = options[i]
        a.href = "./service" + (i + 1) + ".html"
        a.appendChild(document.createTextNode(opt));
    
        div.appendChild(a);
    }
    return div;
}

function makeAnchor2() {
    var div = document.createElement('div');
    var options = ['ENHANCEMENT 1', 'ENHANCEMENT 2'];
    
    for(var i = 0; i < options.length; i++) {
        // Create the list item:
        var a = document.createElement('a');
        var opt = options[i]
        a.href = "./enhancements" + (i + 1) + ".html"
        a.appendChild(document.createTextNode(opt));
    
        div.appendChild(a);
    }
    return div;
}


window.addEventListener("load", function()
    {document.getElementById('dropsc').appendChild(makeAnchor())});

window.addEventListener("load", function()
    {document.getElementById('dropsc2').appendChild(makeAnchor2())});

// transfer within pages

function change() {
    var service = document.getElementById("servicedrop").value;
    if (service == "Select a category and service"){
         document.getElementById("subject").value = "";
    }
    else{
        sessionStorage.service = service;
        document.getElementById("subject").value = sessionStorage.service;
    }
    sessionStorage.clear();
}

// Transfer between pages

function storeitem(item_id) {
    sessionStorage.setItem("item_id", item_id);
    window.location.href = "./enquiry.html";

}

function displayitem() {
    var item_id = sessionStorage.getItem("item_id");
    document.getElementById("subject").value = item_id;    
    
    if (item_id == "Enclosed Space Sanitisation: Home"){
        document.getElementById("servicedrop").selectedIndex = "1";
    };
    sessionStorage.clear();
    window.onload = validateForm;
}

var gErrorMsg=”“;
函数init(){
displayitem();
}
函数validateForm(){
“使用strict”;//指令以确保声明变量
var isAllOK=假;
gErrorMsg=”“;//重置错误消息
var nameOK=chkName();
var emailOK=chkEmail();
var hpOk=chkHp();
var stOk=chkSt();
var cityOk=chkCt();
var stateOk=chkState();
var postOk=chkPost();
var subOk=chkSubject();
var selectOk=chkSelect();
如果(nameOK&&emailOK&&hpOk&&stOk&&cityOk&&stateOk&&postOk&&selectOk){
isAllOK=正确;
}
否则{
警报(gErrorMsg);
gErrorMsg=“”;
isAllOK=假;
}
返回isAllOK;
}
函数chkName(){
var name=document.getElementById(“fname”).value;
变量模式=/^[a-zA-Z]+$/
var nameOk=true;
如果((name.length==0)){
gErrorMsg=gErrorMsg+“请输入您的姓名\n”
nameOk=false;
}
如果((name.length>25)){
gErrorMsg=gErrorMsg+“输入名称必须在25个字符以内。\n”
nameOk=false;
}
否则{
如果(!pattern.test(名称)){
gErrorMsg=gErrorMsg+“您的姓名只能包含字母字符\n”
nameOk=false;
}
}
返回nameOk;
}
函数chkEmail(){
var email=document.getElementById(“fmail”);
var结果=假;
变量模式=/[a-zA-Z0-9.\uz%+-]+@[a-zA-Z0-9.-]+\[a-zA-zA-Z0-9.-]{1,4}$/;
if(模式测试(email.value)){
结果=真;
}
else{//即使对于单个语句不是严格需要的,也可以使用大括号
结果=假;
gErrorMsg=gErrorMsg+“输入有效的电子邮件地址\n”
}
返回结果;
}
函数chkHp(){
var hp=document.getElementById(“fhp”).value;
var结果=真;
var模式=/^(+6?01)[0 | 1 | 2 | 3 | 4 | 6 | 7 | 8 | 9]\-*[0-9]{7,8}$/;
if(模式测试(hp)){
结果=真;
}
否则{
结果=假;
gErrorMsg=gErrorMsg+“输入有效的马来西亚电话号码(前缀为'011'的号码允许使用11位数字)\n”
}
返回结果;
}
函数chkSt(){
var street=document.getElementById(“stname”).value;
变量模式=/^[a-zA-Z]+$/
var stOk=真;
如果((street.length==0)){
gErrorMsg=gErrorMsg+“您必须输入您居住地点的街道名称\n”
stOk=假;
}
否则,如果((街道长度>20)){
gErrorMsg=gErrorMsg+“输入的街道名称必须在20个字符以内\n”
stOk=假;
}
否则{
如果(!模式测试(街道)){
gErrorMsg=gErrorMsg+“街道名称只能包含字母字符\n”
stOk=假;
}
}
返回斯托克;
}
函数chkCt(){
var city=document.getElementById(“城市”).value;
变量模式=/^[a-zA-Z]+$/
var cityOk=真;
如果((city.length==0)){
gErrorMsg=gErrorMsg+“您必须进入您居住的城市\n”
cityOk=假;
}
如果((城市长度>15)){
gErrorMsg=gErrorMsg+“输入城市名称必须在15个字符以内\n”
cityOk=假;
}
否则{
如果(!模式测试(城市)){
gErrorMsg=gErrorMsg+“城市名称只能包含字母字符\n”
cityOk=假;
}
}
返回cityOk;
}
函数chkState(){
选择的var=false;
var state=document.getElementById(“statedrop”).value;
如果(状态!=“----”){
所选=真;
}
否则{
所选=假;
gErrorMsg=gErrorMsg+“您必须选择您的状态\n”
}
返回选中的;
}
函数chkPost(){
var post=document.getElementById(“postcode”).value;
var结果=真;
var模式=/^[0-9]{5}$/;
if(模式测试(post)){
结果=真;
}
否则{
结果=假;
gErrorMsg=gErrorMsg+“输入一个只有5位数字的有效马来西亚邮政编码\n”
}
返回结果;
}
函数chkSubject(){
var sub=document.getElementById(“主题”).value;
变量模式=/
var gErrorMsg = "";


function init() {
    displayitem();
}



function validateForm(){
    "use strict"; //directive to ensure variables are declared
    var isAllOK = false;
    gErrorMsg = ""; //reset error message
    var nameOK = chkName();
    var emailOK = chkEmail();
    var hpOk = chkHp();
    var stOk = chkSt();
    var cityOk = chkCt();
    var stateOk = chkState();
    var postOk = chkPost();
    var subOk = chkSubject();
    var selectOk = chkSelect();
    if (nameOK && emailOK && hpOk && stOk && cityOk && stateOk && postOk && selectOk){
        isAllOK = true;
    }
    else{
        alert(gErrorMsg); 
        gErrorMsg = ""; 
        isAllOK = false;
    }
    return isAllOK;
}


function chkName() {
    var name = document.getElementById("fname").value;
    var pattern = /^[a-zA-Z ]+$/
    var nameOk = true;
    if ((name.length == 0)){
        gErrorMsg = gErrorMsg + "Please enter your name\n"
        nameOk = false; 
    }

    else if ((name.length > 25)){
        gErrorMsg = gErrorMsg + "Input name must be within 25 characters.\n"
        nameOk = false; 
    }

    else{
        if (!pattern.test(name)){
            gErrorMsg = gErrorMsg + "Your name must only contain alpha characters\n"
            nameOk = false;
        }
    }
    return nameOk;
}

function chkEmail() {
    var email = document.getElementById("fmail");
    var result = false;
    var pattern = /[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-za-zA-Z0-9.-]{1,4}$/;
    if (pattern.test(email.value)){
        result = true;
    }
    else{ //braces a good idea even if not strictly needed for single statement
        result = false;
        gErrorMsg = gErrorMsg + "Enter a valid email address\n"
    }
    return result;
}

function chkHp(){
    var hp = document.getElementById("fhp").value;
    var result = true;
    var pattern = /^(\+?6?01)[0|1|2|3|4|6|7|8|9]\-*[0-9]{7,8}$/;
    if (pattern.test(hp)){
        result = true;
    }
    else{
        result = false;
        gErrorMsg = gErrorMsg + "Enter a valid Malaysian phone numbers (11 numerical digits allowed for numbers with '011' prefix) \n"
    }
    return result;
}

function chkSt() {
    var street = document.getElementById("stname").value;
    var pattern = /^[a-zA-Z ]+$/
    var stOk = true;
    if ((street.length == 0)){
        gErrorMsg = gErrorMsg + "You must enter the name of the street of your living place\n"
        stOk = false; 
    }

    else if ((street.length > 20)){
        gErrorMsg = gErrorMsg + "Input street name must be within 20 characters\n"
        stOk = false; 
    }

    else{
        if (!pattern.test(street)){
            gErrorMsg = gErrorMsg + "Street name must only contain alpha characters\n"
            stOk = false;
        }
    }
    return stOk;
}

function chkCt() {
    var city = document.getElementById("city").value;
    var pattern = /^[a-zA-Z ]+$/
    var cityOk = true;
    if ((city.length == 0)){
        gErrorMsg = gErrorMsg + "You must enter the city of your living place\n"
        cityOk = false; 
    }

    else if ((city.length > 15)){
        gErrorMsg = gErrorMsg + "Input city name must be within 15 characters\n"
        cityOk = false; 
    }

    else{
        if (!pattern.test(city)){
            gErrorMsg = gErrorMsg + "City name must only contain alpha characters\n"
            cityOk = false;
        }
    }
    return cityOk;
}

function chkState(){
    var selected = false;
    var state = document.getElementById("statedrop").value;
    if (state!="------"){
        selected = true;
    }
    else{
        selected = false;
        gErrorMsg = gErrorMsg + "You must select your state\n"
    }
    return selected;
}

function chkPost (){
    var post = document.getElementById("postcode").value;
    var result = true;
    var pattern = /^[0-9]{5}$/;
    if (pattern.test(post)){
        result = true;
    }
    else{
        result = false;
        gErrorMsg = gErrorMsg + "Enter a valid Malaysian postcode with only 5 numerical digits\n"
    }
    return result;
}

function chkSubject() {
    var sub = document.getElementById("subject").value;
    var pattern = /^[a-zA-Z ]+$/
    var subOk = true;
    if ((sub.length == 0)){
        gErrorMsg = gErrorMsg + "Subject is empty, must select category and service to enquiry on\n"
        nameOk = false; 
    }

    return nameOk;
}

function chkSelect(){
    var selected = false;
    var ser = document.getElementById("servicedrop").value;
    if (ser!="Select a category and service"){
        selected = true;
    }
    else{
        selected = false;
        gErrorMsg = gErrorMsg + "You must select a category and service for your enquiry\n"
    }
    return selected;
}





// Array 



function serviceList() {
    var select = document.getElementById("servicedrop");

    var options = [
        "Select a category and service",
        "Enclosed Space Sanitisation: Home",
        "Enclosed Space Sanitisation: Office",
        "Enclosed Space Sanitisation: Inventory",
        "Enclosed Space Sanitisation: Sport Facilities",
        "Event Hygiene Management: Funeral",
        "Event Hygiene Management: Sports Event",
        "Event Hygiene Management: Gatherings",
        "Event Hygiene Management: Exhibitions",
        "Wide Area Sanitisation: Hosuing Area",
        "Wide Area Sanitisation: Shopping Complex",
        "Wide Area Sanitisation: School Area",
        "Wide Area Sanitisation: Food Court",
        "Object Disinfection: Vehicle",
        "Object Disinfection: Luggage",
        "Object Disinfection: Walkthorugh Sanitisation",
        "Object Disinfection: Professional Gears"
    ];
    for (var i = 0; i < options.length; i++) {
        var opt = options[i];
        var el = document.createElement("option");
        el.textContent = opt;
        el.value = opt;
        select.appendChild(el);
    }
}


function statelist() {
    var select = document.getElementById("statedrop");

    var options = ["------", "Johor", "Kedah", "Kelantan", "Kuala Lumpur", "Labuan", "Malacca", "Negeri Sembilan", "Pahang", "Perak", "Perlis", "Penang", "Sabah", "Sarawak", "Selangor", "Terengganu"];

    for (var i = 0; i < options.length; i++) {
        var opt = options[i];
        var el = document.createElement("option");
        el.textContent = opt;
        el.value = opt;
        select.appendChild(el);
    }
}

function makeAnchor() {
    var div = document.createElement('div');
    var options = ['ENCLOSED SPACE SANITISATION','EVENT HYGIENE MANAGEMENT', 'WIDE AREA SANITISATION', 'OBJECT DISINFECTION'];
    
    for(var i = 0; i < options.length; i++) {
        // Create the list item:
        var a = document.createElement('a');
        var opt = options[i]
        a.href = "./service" + (i + 1) + ".html"
        a.appendChild(document.createTextNode(opt));
    
        div.appendChild(a);
    }
    return div;
}

function makeAnchor2() {
    var div = document.createElement('div');
    var options = ['ENHANCEMENT 1', 'ENHANCEMENT 2'];
    
    for(var i = 0; i < options.length; i++) {
        // Create the list item:
        var a = document.createElement('a');
        var opt = options[i]
        a.href = "./enhancements" + (i + 1) + ".html"
        a.appendChild(document.createTextNode(opt));
    
        div.appendChild(a);
    }
    return div;
}


window.addEventListener("load", function()
    {document.getElementById('dropsc').appendChild(makeAnchor())});

window.addEventListener("load", function()
    {document.getElementById('dropsc2').appendChild(makeAnchor2())});

// transfer within pages

function change() {
    var service = document.getElementById("servicedrop").value;
    if (service == "Select a category and service"){
         document.getElementById("subject").value = "";
    }
    else{
        sessionStorage.service = service;
        document.getElementById("subject").value = sessionStorage.service;
    }
    sessionStorage.clear();
}

// Transfer between pages

function storeitem(item_id) {
    sessionStorage.setItem("item_id", item_id);
    window.location.href = "./enquiry.html";

}

function displayitem() {
    var item_id = sessionStorage.getItem("item_id");
    document.getElementById("subject").value = item_id;    
    
    if (item_id == "Enclosed Space Sanitisation: Home"){
        document.getElementById("servicedrop").selectedIndex = "1";
    };
    sessionStorage.clear();
    window.onload = validateForm;
}