Javascript not loading

  • Resolved ealbury

    (@ealbury)


    4 years, 6 months ago

    My javascript is not loading. I use this logic in my html code. When I run this program with a CSS file in my IDE it works but the Javascript logic does not seem to be applied to my WordPress page. The CSS and HTML code does seem to be. I’ve selected Javascript from the plugin options and the correct page. Am I missing some script in the Javascript code? Thanks

    <script>

    var targetDate = new Date();
    var current = targetDate.getDate();
    var last = current + 1;

    var startDate = new Date(targetDate.setDate(current)).toUTCString().split(‘ ‘).slice(0,4).join(‘ ‘);

    var appointments = [startDate];
    var dayList = [];
    var dayListMultiplied = [];
    var timesAdded = [];
    var multiplyThisManyTimes = 1;
    var finalList = [];

    function createAppointmentsList() {
    while (appointments.length < 14) {
    var lastDate = new Date(targetDate.setDate(last)).toUTCString().split(‘ ‘).slice(0,4).join(‘ ‘);
    appointments.push(lastDate);
    last += 1;
    }
    }

    function checkDays() {
    for (var i = 0; i < appointments.length; i++) {
    if (appointments[i].includes(‘Mon’)|| appointments[i].includes(‘Wed’)|| appointments[i].includes(‘Fri’)) {
    dayList.push(appointments[i]);
    }
    }
    }

    function multiplyDays() {
    for (var i = 0; i < dayList.length; i++) {
    for(var k = 0; k < multiplyThisManyTimes; k++) {
    dayListMultiplied.push(dayList[i]);
    }
    }
    }

    var timeSlots = [“2:00pm-2:10pm”, “2:10pm-2:20pm”, “2:20pm-2:30pm”, “2:30pm-2:40pm”, “2:40pm-2:50pm”, “2:50pm-3:00pm”]

    function addTimes() {
    for (var i = 0; i < dayListMultiplied.length; i++) {
    for (var t = 0; t < timeSlots.length; t++)
    finalList.push(dayListMultiplied[i] + ” ” + timeSlots[t]);
    }
    }

    function countDays() {
    var numberOfDays = dayListMultiplied.length;
    return numberOfDays;
    }

    createAppointmentsList()
    checkDays();
    multiplyDays();
    countDays();
    addTimes();

    </script>

    Here is my html code:

    <!DOCTYPE html>
    <html lang=”en”>
    <head>
    <meta charset=”utf-8″ />
    <!–<meta name=”viewport” content=”width=device-width. initial-scale=1.0″ />–>

    <title>Reading Refugees Support Group</title>

    <link rel=”stylesheet” type=”text/css” href=”style.css” media=”screen”/>
    <script type=”text/javascript” src=”scripts.js”></script>
    </head>
    </head>
    <body>
    <h1>Book An Appointment</h1>
    <form action=”Link to the form processor script” method=”post”>
    <div class=”contact-details”>
    <p>
    First Name: <input type=”text” name=”FirstName” id=”First-Name” value=”Enter Your First Name” size=”25″/>
    </p>
    <p>
    Last Name: <input type=”text” name=”LastName” id=”Last-Name” value=”Enter Your Last Name” size=”25″/>
    </p>
    <p>
    Email: <input type=”text” name=”Email” id=”Email” value=”Enter Your Email Address” size=”40″/>
    </p>
    <p>
    Phone Number: <input type=”text” name=”PhoneNumber” id=”Phone-Number” value=”Enter Your Phone Number” size=”40″/>
    </p>
    </div>
    <p>
    <select id=”selectAppointment”>
    <option value=”default”>Select an Appointment</option>
    </select>
    <script>

    var selectAppointment = document.getElementById(“selectAppointment”);

    for (var i = 0; i < finalList.length; i++)
    {
    var option = document.createElement(“OPTION”),
    txt = document.createTextNode(finalList[i]);
    option.appendChild(txt);
    option.setAttribute(“value”, finalList[i]);
    selectAppointment.insertBefore(option,selectAppointment.lastChild);
    }

    </script>
    <br>
    </br>
    <select id=”selectEnquiry”>
    <option value=”default”>Select an Enquiry</option>
    </select>

    <script>

    var selectEnquiry = document.getElementById(“selectEnquiry”);
    var enquiryList = [“finances”, “legal”, “housing”, “employment”, “aid”];

    for (var i = 0; i < enquiryList.length; i++)
    {
    var option = document.createElement(“OPTION”),
    txt = document.createTextNode(enquiryList[i]);
    option.appendChild(txt);
    option.setAttribute(“value”, enquiryList[i]);
    selectEnquiry.insertBefore(option,selectEnquiry.lastChild);
    }
    </script>
    <p>
    <input type=”submit” name=”submit” value=”Submit”/>
    </p>
    </form>

    </body>
    </html>

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter ealbury

    (@ealbury)

    I found a solution. I just had to move the JavaScript Code Block up the top of the Code Blocks in the plugin admin window. I didn’t realise they ran in order.

    Thread Starter ealbury

    (@ealbury)

    Resolved.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Javascript not loading’ is closed to new replies.