Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • World
  • Users
  • Groups
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse
Code Project
  1. Home
  2. Web Development
  3. JavaScript
  4. Javascript function error.

Javascript function error.

Scheduled Pinned Locked Moved JavaScript
javascripthtmlhelpquestion
30 Posts 6 Posters 0 Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • J jkirkerx

    I know I'm late on this, but 0 - 0 is 0 opening time is 0 or 12 midnight closing time is 0 or 12 midnight so you get 0

    If it ain't broke don't fix it Discover my world at jkirkerx.com

    A Offline
    A Offline
    and180y
    wrote on last edited by
    #20

    I was just glad the code worked. :) :)

    J 2 Replies Last reply
    0
    • A and180y

      I was just glad the code worked. :) :)

      J Offline
      J Offline
      jkirkerx
      wrote on last edited by
      #21

      :) I wrote a similar function for showing that my business is open, based on open and closed hours in TypeScript. It drove me nuts, was always off by an hour, Daylight savings. I'll get back to it soon, now that I have more experience in TypeScript. :(

      setStoreHours(): void {
      const date = new Date();
      const newDate = new Date(date.getTime() + date.getTimezoneOffset() * 60 * 1000);
      const offset = date.getTimezoneOffset() / 60;
      this.hourOfDay = date.getHours();
      this.dayOfWeek = date.getDay();
      switch (this.dayOfWeek) {
      case 0:
      // Sunday
      this.storeStatus = "Closed";
      break;
      case 1:
      // Monday
      if (this.hourOfDay > 8 && this.hourOfDay < 17) {
      this.storeStatus = "Open";
      }
      break;
      case 2:
      // Tuesday
      if (this.hourOfDay > 8 && this.hourOfDay < 17) {
      this.storeStatus = "Open";
      }
      break;
      case 3:
      // Wednesday
      if (this.hourOfDay > 8 && this.hourOfDay < 17) {
      this.storeStatus = "Open";
      }
      break;
      case 4:
      // Thursday
      if (this.hourOfDay > 8 && this.hourOfDay < 17) {
      this.storeStatus = "Open";
      }
      break;
      case 5:
      // Friday
      if (this.hourOfDay > 8 && this.hourOfDay < 15) {
      this.storeStatus = "Open";
      }
      break;
      case 6:
      // Saturday
      this.storeStatus = "Closed";
      break;
      default:
      this.storeStatus = "Closed";
      }
      }

      If it ain't broke don't fix it Discover my world at jkirkerx.com

      A 2 Replies Last reply
      0
      • J jkirkerx

        :) I wrote a similar function for showing that my business is open, based on open and closed hours in TypeScript. It drove me nuts, was always off by an hour, Daylight savings. I'll get back to it soon, now that I have more experience in TypeScript. :(

        setStoreHours(): void {
        const date = new Date();
        const newDate = new Date(date.getTime() + date.getTimezoneOffset() * 60 * 1000);
        const offset = date.getTimezoneOffset() / 60;
        this.hourOfDay = date.getHours();
        this.dayOfWeek = date.getDay();
        switch (this.dayOfWeek) {
        case 0:
        // Sunday
        this.storeStatus = "Closed";
        break;
        case 1:
        // Monday
        if (this.hourOfDay > 8 && this.hourOfDay < 17) {
        this.storeStatus = "Open";
        }
        break;
        case 2:
        // Tuesday
        if (this.hourOfDay > 8 && this.hourOfDay < 17) {
        this.storeStatus = "Open";
        }
        break;
        case 3:
        // Wednesday
        if (this.hourOfDay > 8 && this.hourOfDay < 17) {
        this.storeStatus = "Open";
        }
        break;
        case 4:
        // Thursday
        if (this.hourOfDay > 8 && this.hourOfDay < 17) {
        this.storeStatus = "Open";
        }
        break;
        case 5:
        // Friday
        if (this.hourOfDay > 8 && this.hourOfDay < 15) {
        this.storeStatus = "Open";
        }
        break;
        case 6:
        // Saturday
        this.storeStatus = "Closed";
        break;
        default:
        this.storeStatus = "Closed";
        }
        }

        If it ain't broke don't fix it Discover my world at jkirkerx.com

        A Offline
        A Offline
        and180y
        wrote on last edited by
        #22

        Where's the best place to learn how to write functions and class functions. I've ran through the courses Richard suggested above but none seem to be taking me where I need to be or am I trying to walk before I can run? :-) To me this should run but it's not returning a value, (or I'm not grasping how to get it to do so)

        $(function(){
        $("#current-charge").keyup(function(){
        var time = $("#time-allowed").val();
        var current = $("#current-charge").val();
        $("breakeven").html(time * current);
        })
        })

        1 Reply Last reply
        0
        • A and180y

          I was just glad the code worked. :) :)

          J Offline
          J Offline
          jkirkerx
          wrote on last edited by
          #23

          That's JQuery like syntax. IMO, Don't waste your time learning JQuery, I've been there and done that already. JQuery is obsolete now, because modern browsers support modern JavaScript. JQuery adds 3 Lbs to your first page download, and is very heavy in weight, in exchange to write shorthand JavaScript. The reason your not absorbing or moving faster with knowledge is because your looking at shorthand JavaScript/JQuery examples, and trying to understand and copy them. These are very advanced writing skills. You should start with entry level skill writing, and when you get that down, move to shorthand. I would of wrote it like this, for a beginner example. ES6 Use HTML to bind the event to the button, and run calcTime(). Use camel case to label things eg. calcTime vs CalcTime vs calc-time let has replaced var use const instead of var or let to when something that is constant. Try not to make a lot of const, see how I did it in one line ES6 Example

          Calculate

          function calcTime() {

          // Make references to input elements
          const time = document.getElementById("currentCharge"),
          current = document.getElementById("timeAllowed"),
          breakEven = document.getElementById("breakEven");

          // Get the element values, convert to number/float
          // By default, values are strings, and don't do math well.
          let t = parseFloat(time.value);
          let c = parseFloat(current.value);

          // Perform the equation
          let bE = t * c;

          // Output the equation
          breakEven.innerHTML = bE.toString();

          }

          JavaScript comes in many flavors now. I think you want ECMAScript 6, ES6, ECMAScript 2015 From there, you can branch out to TypeScript, Node, etc. I don't know of a good learning course, but you need to stick to one version in order to learn. And when searching for help on the internet, find examples in ES6; learn to identity ES6 examples, and then code and test.

          If it ain't broke don't fix it Discover my world at jkirkerx.com

          A 1 Reply Last reply
          0
          • J jkirkerx

            :) I wrote a similar function for showing that my business is open, based on open and closed hours in TypeScript. It drove me nuts, was always off by an hour, Daylight savings. I'll get back to it soon, now that I have more experience in TypeScript. :(

            setStoreHours(): void {
            const date = new Date();
            const newDate = new Date(date.getTime() + date.getTimezoneOffset() * 60 * 1000);
            const offset = date.getTimezoneOffset() / 60;
            this.hourOfDay = date.getHours();
            this.dayOfWeek = date.getDay();
            switch (this.dayOfWeek) {
            case 0:
            // Sunday
            this.storeStatus = "Closed";
            break;
            case 1:
            // Monday
            if (this.hourOfDay > 8 && this.hourOfDay < 17) {
            this.storeStatus = "Open";
            }
            break;
            case 2:
            // Tuesday
            if (this.hourOfDay > 8 && this.hourOfDay < 17) {
            this.storeStatus = "Open";
            }
            break;
            case 3:
            // Wednesday
            if (this.hourOfDay > 8 && this.hourOfDay < 17) {
            this.storeStatus = "Open";
            }
            break;
            case 4:
            // Thursday
            if (this.hourOfDay > 8 && this.hourOfDay < 17) {
            this.storeStatus = "Open";
            }
            break;
            case 5:
            // Friday
            if (this.hourOfDay > 8 && this.hourOfDay < 15) {
            this.storeStatus = "Open";
            }
            break;
            case 6:
            // Saturday
            this.storeStatus = "Closed";
            break;
            default:
            this.storeStatus = "Closed";
            }
            }

            If it ain't broke don't fix it Discover my world at jkirkerx.com

            A Offline
            A Offline
            and180y
            wrote on last edited by
            #24

            Sorry, I think I deleted my reply just as you replied to it. :sigh: :doh: :doh:

            J 1 Reply Last reply
            0
            • A and180y

              Sorry, I think I deleted my reply just as you replied to it. :sigh: :doh: :doh:

              J Offline
              J Offline
              jkirkerx
              wrote on last edited by
              #25

              That's JQuery like syntax. IMO, Don't waste your time learning JQuery, I've been there and done that already. JQuery is obsolete now, because modern browsers support modern JavaScript. JQuery adds 3 Lbs to your first page download, and is very heavy in weight, in exchange to write shorthand JavaScript. The reason your not absorbing or moving faster with knowledge is because your looking at shorthand JavaScript/JQuery examples, and trying to understand and copy them. These are very advanced writing skills. You should start with entry level skill writing, and when you get that down, move to shorthand. I would of wrote it like this, for a beginner example. ES6 Use HTML to bind the event to the button, and run calcTime(). Use camel case to label things eg. calcTime vs CalcTime vs calc-time let has replaced var use const instead of var or let to when something that is constant. Try not to make a lot of const, see how I did it in one line ES6 Example

              Calculate

              function calcTime() {

              // Make references to input elements
              const time = document.getElementById("currentCharge"),
              current = document.getElementById("timeAllowed"),
              breakEven = document.getElementById("breakEven");

              // Get the element values, convert to number/float
              // By default, values are strings, and don't do math well.
              let t = parseFloat(time.value);
              let c = parseFloat(current.value);

              // Perform the equation
              let bE = t * c;

              // Output the equation
              breakEven.innerHTML = bE.toString();

              }

              JavaScript comes in many flavors now. I think you want ECMAScript 6, ES6, ECMAScript 2015 From there, you can branch out to TypeScript, Node, etc. I don't know of a good learning course, but you need to stick to one version in order to learn. And when searching for help on the internet, find examples in ES6; learn to identity ES6 examples, and then code and test.

              If it ain't broke don't fix it Discover my world at jkirkerx.com

              1 Reply Last reply
              0
              • J jkirkerx

                That's JQuery like syntax. IMO, Don't waste your time learning JQuery, I've been there and done that already. JQuery is obsolete now, because modern browsers support modern JavaScript. JQuery adds 3 Lbs to your first page download, and is very heavy in weight, in exchange to write shorthand JavaScript. The reason your not absorbing or moving faster with knowledge is because your looking at shorthand JavaScript/JQuery examples, and trying to understand and copy them. These are very advanced writing skills. You should start with entry level skill writing, and when you get that down, move to shorthand. I would of wrote it like this, for a beginner example. ES6 Use HTML to bind the event to the button, and run calcTime(). Use camel case to label things eg. calcTime vs CalcTime vs calc-time let has replaced var use const instead of var or let to when something that is constant. Try not to make a lot of const, see how I did it in one line ES6 Example

                Calculate

                function calcTime() {

                // Make references to input elements
                const time = document.getElementById("currentCharge"),
                current = document.getElementById("timeAllowed"),
                breakEven = document.getElementById("breakEven");

                // Get the element values, convert to number/float
                // By default, values are strings, and don't do math well.
                let t = parseFloat(time.value);
                let c = parseFloat(current.value);

                // Perform the equation
                let bE = t * c;

                // Output the equation
                breakEven.innerHTML = bE.toString();

                }

                JavaScript comes in many flavors now. I think you want ECMAScript 6, ES6, ECMAScript 2015 From there, you can branch out to TypeScript, Node, etc. I don't know of a good learning course, but you need to stick to one version in order to learn. And when searching for help on the internet, find examples in ES6; learn to identity ES6 examples, and then code and test.

                If it ain't broke don't fix it Discover my world at jkirkerx.com

                A Offline
                A Offline
                and180y
                wrote on last edited by
                #26

                Have added some more elements (not in use at present) but still not getting the breakeven to calculate.

                <div class='col-sm-2 mb-1'>
                <input type='number' id='time' class='form-control' data-calc='time' placeholder='Minutes Allocated' tabindex='2'>
                </div>
                <div class='col-sm-2 mb-2'>
                <input type='text' id='current' class='form-control form-output' data-calc='current' value='£0.00' tabindex='-1'>
                </div>
                <div class='col-sm-2 mb-2'>
                <input type='text' id='breakeven' class='form-control form-output' data-calc='breakeven' value='£0.00' readonly tabindex='-1'>
                </div>
                <div class='col-sm-2 mb-2'>
                <input type='text' id='tier1' class='form-control form-output' data-calc='tier1' value='£0.00' readonly tabindex='-1'>
                </div>
                <div class='col-sm-2 mb-2'>
                <input type='text' id='tier2' class='form-control form-output' data-calc='tier2' value='£0.00' readonly tabindex='-1'>
                </div>
                </div>

                <button type="button" onBlur="calcTime()">Calculate</button>
                

                function calcTime() {

                // Make references to input elements
                const time = document.getElementById("timeAllowed"),
                current = document.getElementById("currentCharge"),
                breakEven = document.getElementById("breakEven"),
                tier1 = document.getElementById ("tier1"),
                tier2= document.getElementById ("tier2");

                // Get the element values, convert to number/float
                // By default, values are strings, and don't do math well.
                let t = parseFloat(time.value);
                let c = parseFloat(current.value);

                // Perform the equation
                let bE = t * c;

                // Output the equation
                breakEven.innerHTML = bE.toString();

                }</pre></x-turndown>

                L J A 3 Replies Last reply
                0
                • A and180y

                  Have added some more elements (not in use at present) but still not getting the breakeven to calculate.

                  <div class='col-sm-2 mb-1'>
                  <input type='number' id='time' class='form-control' data-calc='time' placeholder='Minutes Allocated' tabindex='2'>
                  </div>
                  <div class='col-sm-2 mb-2'>
                  <input type='text' id='current' class='form-control form-output' data-calc='current' value='£0.00' tabindex='-1'>
                  </div>
                  <div class='col-sm-2 mb-2'>
                  <input type='text' id='breakeven' class='form-control form-output' data-calc='breakeven' value='£0.00' readonly tabindex='-1'>
                  </div>
                  <div class='col-sm-2 mb-2'>
                  <input type='text' id='tier1' class='form-control form-output' data-calc='tier1' value='£0.00' readonly tabindex='-1'>
                  </div>
                  <div class='col-sm-2 mb-2'>
                  <input type='text' id='tier2' class='form-control form-output' data-calc='tier2' value='£0.00' readonly tabindex='-1'>
                  </div>
                  </div>

                  <button type="button" onBlur="calcTime()">Calculate</button>
                  

                  function calcTime() {

                  // Make references to input elements
                  const time = document.getElementById("timeAllowed"),
                  current = document.getElementById("currentCharge"),
                  breakEven = document.getElementById("breakEven"),
                  tier1 = document.getElementById ("tier1"),
                  tier2= document.getElementById ("tier2");

                  // Get the element values, convert to number/float
                  // By default, values are strings, and don't do math well.
                  let t = parseFloat(time.value);
                  let c = parseFloat(current.value);

                  // Perform the equation
                  let bE = t * c;

                  // Output the equation
                  breakEven.innerHTML = bE.toString();

                  }</pre></x-turndown>

                  L Offline
                  L Offline
                  Lost User
                  wrote on last edited by
                  #27

                  Look at the id names you are using in the HTML against the ones you are using in the Javascript. You need to read through your code more closely.

                  A 1 Reply Last reply
                  0
                  • A and180y

                    Have added some more elements (not in use at present) but still not getting the breakeven to calculate.

                    <div class='col-sm-2 mb-1'>
                    <input type='number' id='time' class='form-control' data-calc='time' placeholder='Minutes Allocated' tabindex='2'>
                    </div>
                    <div class='col-sm-2 mb-2'>
                    <input type='text' id='current' class='form-control form-output' data-calc='current' value='£0.00' tabindex='-1'>
                    </div>
                    <div class='col-sm-2 mb-2'>
                    <input type='text' id='breakeven' class='form-control form-output' data-calc='breakeven' value='£0.00' readonly tabindex='-1'>
                    </div>
                    <div class='col-sm-2 mb-2'>
                    <input type='text' id='tier1' class='form-control form-output' data-calc='tier1' value='£0.00' readonly tabindex='-1'>
                    </div>
                    <div class='col-sm-2 mb-2'>
                    <input type='text' id='tier2' class='form-control form-output' data-calc='tier2' value='£0.00' readonly tabindex='-1'>
                    </div>
                    </div>

                    <button type="button" onBlur="calcTime()">Calculate</button>
                    

                    function calcTime() {

                    // Make references to input elements
                    const time = document.getElementById("timeAllowed"),
                    current = document.getElementById("currentCharge"),
                    breakEven = document.getElementById("breakEven"),
                    tier1 = document.getElementById ("tier1"),
                    tier2= document.getElementById ("tier2");

                    // Get the element values, convert to number/float
                    // By default, values are strings, and don't do math well.
                    let t = parseFloat(time.value);
                    let c = parseFloat(current.value);

                    // Perform the equation
                    let bE = t * c;

                    // Output the equation
                    breakEven.innerHTML = bE.toString();

                    }</pre></x-turndown>

                    J Offline
                    J Offline
                    jkirkerx
                    wrote on last edited by
                    #28

                    You got it wrong ... You are fresh at this ;) I can't test this at the moment, but it should work. I hope it does.

                    function calcTime() {

                    // Make references to input elements
                    const time = document.getElementById("time"),
                    current = document.getElementById("current"),
                    tier1 = document.getElementById ("tier1"),
                    tier2= document.getElementById ("tier2"),
                    breakEven = document.getElementById("breakEven"),
                    results = document.getElementById("results");

                    // Get the element values, convert to number/float
                    // By default, values are strings, and don't do math well.
                    let t = parseFloat(time.value);
                    let c = parseFloat(current.value);

                    // Perform the equation
                    let bE = t * c;

                    // Output the equation to the span element, remove the comments below
                    console.log("breakEven=", bE); // Diagnostics, hit F12 on your keyboard and select console
                    results.innerHTML = bE.toString(); // innerHTML is for a span tag, value is textbox
                    }

                    Calculate

                    0

                    If it ain't broke don't fix it Discover my world at jkirkerx.com

                    1 Reply Last reply
                    0
                    • A and180y

                      Have added some more elements (not in use at present) but still not getting the breakeven to calculate.

                      <div class='col-sm-2 mb-1'>
                      <input type='number' id='time' class='form-control' data-calc='time' placeholder='Minutes Allocated' tabindex='2'>
                      </div>
                      <div class='col-sm-2 mb-2'>
                      <input type='text' id='current' class='form-control form-output' data-calc='current' value='£0.00' tabindex='-1'>
                      </div>
                      <div class='col-sm-2 mb-2'>
                      <input type='text' id='breakeven' class='form-control form-output' data-calc='breakeven' value='£0.00' readonly tabindex='-1'>
                      </div>
                      <div class='col-sm-2 mb-2'>
                      <input type='text' id='tier1' class='form-control form-output' data-calc='tier1' value='£0.00' readonly tabindex='-1'>
                      </div>
                      <div class='col-sm-2 mb-2'>
                      <input type='text' id='tier2' class='form-control form-output' data-calc='tier2' value='£0.00' readonly tabindex='-1'>
                      </div>
                      </div>

                      <button type="button" onBlur="calcTime()">Calculate</button>
                      

                      function calcTime() {

                      // Make references to input elements
                      const time = document.getElementById("timeAllowed"),
                      current = document.getElementById("currentCharge"),
                      breakEven = document.getElementById("breakEven"),
                      tier1 = document.getElementById ("tier1"),
                      tier2= document.getElementById ("tier2");

                      // Get the element values, convert to number/float
                      // By default, values are strings, and don't do math well.
                      let t = parseFloat(time.value);
                      let c = parseFloat(current.value);

                      // Perform the equation
                      let bE = t * c;

                      // Output the equation
                      breakEven.innerHTML = bE.toString();

                      }</pre></x-turndown>

                      A Offline
                      A Offline
                      and180y
                      wrote on last edited by
                      #29

                      Jkirkerx, not sure why but your post vanished. I tried it but no luck. Going to change a few things so will keep you updated, thanks for your help thus far. :)

                      1 Reply Last reply
                      0
                      • L Lost User

                        Look at the id names you are using in the HTML against the ones you are using in the Javascript. You need to read through your code more closely.

                        A Offline
                        A Offline
                        and180y
                        wrote on last edited by
                        #30

                        Thanks Richard, you were right. In my haste I lost focus. :)

                        1 Reply Last reply
                        0
                        Reply
                        • Reply as topic
                        Log in to reply
                        • Oldest to Newest
                        • Newest to Oldest
                        • Most Votes


                        • Login

                        • Don't have an account? Register

                        • Login or register to search.
                        • First post
                          Last post
                        0
                        • Categories
                        • Recent
                        • Tags
                        • Popular
                        • World
                        • Users
                        • Groups