Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 29
  1. #1
    New to the CF scene
    Join Date
    Oct 2013
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Check for range 0-99

    Hi guys, I was wondering how I can check if the numbers for each type of candy is between 0-99? Any help would be greatly appreciated.
    Code:
    function totalCost(){
        //declare variables
        var snicker = parseInt(document.getElementById("snicker").value);
    
        var twix = parseInt(document.getElementById("twix").value);
        var chips = parseInt(document.getElementById("chips").value);
        var salesTax = 0.05;
        var total = 0;
      
    
        if (!isNaN(snicker)) {
            total += (snicker * .59);    
        }
     
        if (!isNaN(twix)) {
            total += (twix * .49);
        }
     
        if (!isNaN(chips)) {
            total += (chips * .39);
        }
     
        total += (salesTax * total);
     
        if (total != 0) {
            alert("The total is " + total);
            return false;
        } else {
            alert("Invalid total cost, please make a selection");
        }
    }

  • #2
    New Coder
    Join Date
    Aug 2013
    Posts
    50
    Thanks
    0
    Thanked 11 Times in 11 Posts
    You can just use less than and greater than symbols. Then, you won't even need to use !isNaN(...) because NaN isn't bigger or smaller than anything and will always return false.

    Also, I made parseInt use base-10 for you. Just in-case any weird stuff happens.

    Code:
    function inRange(n) {
        // easily change the min/max values here
        var min = 1;
        var max = 99;
    
        return n >= min && n <= max;
    }
    
    function totalCost() {
        //declare variables
        var snicker = parseInt(document.getElementById("snicker").value, 10);
        var twix = parseInt(document.getElementById("twix").value, 10);
        var chips = parseInt(document.getElementById("chips").value, 10);
        var salesTax = 0.05;
        var total = 0;
      
    
        if ( inRange(snicker) ) {
            total += snicker * .59;    
        }
     
        if ( inRange(twix) ) {
            total += twix * .49;
        }
     
        if ( inRange(chips) ) {
            total += chips * .39;
        }
     
        total += salesTax * total;
     
        if (total > 0) {
            alert("The total is " + total);
            return false;
        } else {
            alert("Invalid total cost, please make a selection");
        }
    }

  • #3
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,460
    Thanks
    11
    Thanked 600 Times in 580 Posts
    you don't need javascript to do that anymore

    Code:
     <input id=twix min=0 max=99 type=number />

    this is a more semantic solution and allows the visually impaired to become aware of the input constraints instead of hiding the rules in javascript.

    it goes without saying that it's a far simpler approach to implement and customize...

    you can drop in an HTML5 shim if you need to support legacy browsers.
    Last edited by rnd me; 10-06-2013 at 10:56 PM.
    my site (updated 2014/10/20)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.3, IE11:9.2, IE9:2.7, IE10:2.6, FF:16.8, CH:47.5, SF:7.8, NON-MOUSE:37%

  • #4
    New to the CF scene
    Join Date
    Oct 2013
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hi Thank You both for the suggestions. They both work great. Just curious if I wanted to place an alert message in each one. For an example right now if the user enters valid numbers for twix and snickers but not chips it still gives the correct amount but ignores chips. Can I change it so it gives an error message? If it too complicated, I am fine leaving it the way it is. Thanks.

  • #5
    Regular Coder
    Join Date
    Jan 2013
    Location
    Germany
    Posts
    578
    Thanks
    4
    Thanked 77 Times in 77 Posts
    You can add "required" to it to stick with rnd_me's modern ways:

    Code:
    <input ... required>
    The same things rnd_me said about support for older browsers goes here, too. Keep in mind that any real validation (if this is more than just an exercise) should be done server-side, never client-side. Client-side validation is only for a fast feedback to improve the user experience, but not safe at all since it can be tricked with almost no effort.

  • #6
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,308
    Thanks
    203
    Thanked 2,563 Times in 2,541 Posts
    Code:
    if ( inRange(snicker) ) {
    total += snicker * .59;    
    }
    else {
    alert ("You must enter a value from 0 to 99 for snickers");
    return false;
    }
    But alerts are considered to be obsolete. In practice you should use DOM methods to display a message to your user.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #7
    New Coder
    Join Date
    Aug 2013
    Posts
    50
    Thanks
    0
    Thanked 11 Times in 11 Posts
    Quote Originally Posted by Philip M View Post
    In practice you should use DOM methods to display a message to your user.
    alert is a DOM method, just saying, lol. You may want to re-phrase that.

  • #8
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,308
    Thanks
    203
    Thanked 2,563 Times in 2,541 Posts
    Quote Originally Posted by joesimmons View Post
    alert is a DOM method, just saying, lol. You may want to re-phrase that.
    Hmm. alert() is a method of the Javascript window object.

    innerHTML is a property of the HTML DOM element object. That is what I was indicating.

    I am aware that the innerHTML property is not actually part of the official DOM specification. Despite this, it is supported in all major browsers, and has had widespread use across the web for many years. DOM, which stands for Document Object Model, is the hierarchy used to access and manipulate HTML objects from within JavaScript.
    Last edited by Philip M; 10-07-2013 at 11:33 AM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #9
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,460
    Thanks
    11
    Thanked 600 Times in 580 Posts
    my site (updated 2014/10/20)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.3, IE11:9.2, IE9:2.7, IE10:2.6, FF:16.8, CH:47.5, SF:7.8, NON-MOUSE:37%

  • #10
    New Coder
    Join Date
    Aug 2013
    Posts
    50
    Thanks
    0
    Thanked 11 Times in 11 Posts
    Quote Originally Posted by Philip M View Post
    Hmm. alert() is a method of the Javascript window object.
    It's not actually a part of JavaScript, though, just like setTimeout, prompt, etc.

    If you run it in an environment with no context, those methods won't work because they don't exist.

    For example... run this in the latest Firefox's location bar:
    Code:
    javascript: alert(5);
    It won't work... uncaught exception: ReferenceError: alert is not defined
    It's because the browser provides that method. JavaScript run in the location bar in Firefox runs with no context (no alert, no DOM, etc).

  • #11
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,308
    Thanks
    203
    Thanked 2,563 Times in 2,541 Posts
    Quote Originally Posted by joesimmons View Post
    It's not actually a part of JavaScript, though, just like setTimeout, prompt, etc.

    If you run it in an environment with no context, those methods won't work because they don't exist.

    For example... run this in the latest Firefox's location bar:
    Code:
    javascript: alert(5);
    It won't work... uncaught exception: ReferenceError: alert is not defined
    It's because the browser provides that method. JavaScript run in the location bar in Firefox runs with no context (no alert, no DOM, etc).
    When I type javascript:alert(5) into IE's address bar I get an alert with text 5. Same in Chrome. I don't see how it can not be a part of Javascript.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #12
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,460
    Thanks
    11
    Thanked 600 Times in 580 Posts
    Quote Originally Posted by Philip M View Post
    When I type javascript:alert(5) into IE's address bar I get an alert with text 5. Same in Chrome. I don't see how it can not be a part of Javascript.
    no, your other latest firefox; you're not paying attention...

    i think what joesimmons is driving at is that alert, escape, atob, and even window, etc are defined by the DOM/Browser/Host, not by ECMAScript itself...
    Last edited by rnd me; 10-08-2013 at 05:46 PM.
    my site (updated 2014/10/20)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.3, IE11:9.2, IE9:2.7, IE10:2.6, FF:16.8, CH:47.5, SF:7.8, NON-MOUSE:37%

  • #13
    New Coder
    Join Date
    Aug 2013
    Posts
    50
    Thanks
    0
    Thanked 11 Times in 11 Posts
    Quote Originally Posted by Philip M View Post
    When I type javascript:alert(5) into IE's address bar I get an alert with text 5. Same in Chrome. I don't see how it can not be a part of Javascript.
    The browser provides those functions. They are not in the language itself.

    I told you to do it in Firefox location bar because they run the code with no context (aka pure JavaScript/ECMAScript).

    It works in IE because IE provides those functions for script you run in the location bar.

    I feel like you're not reading what I'm typing, maybe?

  • #14
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,308
    Thanks
    203
    Thanked 2,563 Times in 2,541 Posts
    Quote Originally Posted by joesimmons View Post
    The browser provides those functions. They are not in the language itself.

    I told you to do it in Firefox location bar because they run the code with no context (aka pure JavaScript/ECMAScript).

    It works in IE because IE provides those functions for script you run in the location bar.

    I feel like you're not reading what I'm typing, maybe?
    Seems to me another pointless argument. I am not a fan of Firefox. Suggest you drop it now, and rather than picking flies prefer to focus on helping the people who ask the questions.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #15
    New Coder
    Join Date
    Aug 2013
    Posts
    50
    Thanks
    0
    Thanked 11 Times in 11 Posts
    It's not even an argument. I'm trying to HELP you understand... It has nothing to do with Firefox and how much you like it.


  •  
    Page 1 of 2 12 LastLast

    LinkBacks (?)

    1. 03-19-2014, 12:28 AM

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •