www.webdeveloper.com
Results 1 to 6 of 6

Thread: [RESOLVED] Return data based on input field...

Hybrid View

  1. #1
    Join Date
    Dec 2012
    Posts
    81

    resolved [RESOLVED] Return data based on input field...

    I'm not sure if this is something JS should do, or PHP... I just know I can't do it with an HTML form...

    Here's what I'm trying to do...

    I want my user to enter a number. Then, I suppose the JS would validate that number to be between two other numbers. If it's between any two given numbers, then it would return certain information.

    For example, if the user enters '2101', then an output script would read, "Based on the score you entered (2101), you will receive approximately $600 as a scholarship, toward your degree program."

    I'm just looking for a good starting point. Designing the input form in HTML is simple... but I need help with the JS. I'm just looking for a good starting point, as I'm learning more about JS. I don't want any handouts and I'm not looking for someone to write this for me. Just some guidance!

    Much thanks!

  2. #2
    Join Date
    Aug 2008
    Location
    Sweden
    Posts
    227
    Here's a simple example how you could do it with just JavaScript:

    Code:
    <script>
    
    function showScholarship(score) {
    
      var scholarship;
    
      if (score < 1000)
        scholarship = 400;
      else if (score < 2500)
        scholarship = 600;
      else if (score < 3500)
        scholarship = 900;
      else
        scholarship = 1200;
    
      alert('Based on the score you entered ('+score+'), you will receive'
        +' approximately $'+scholarship+' as a scholarship, toward your'
        +' degree program.');
    
    }
    
    </script>
    
    <form onsubmit="showScholarship(this.score.value); return false;">
        <div>
            Score: <input type="text" name="score" />
        </div>
        <div>
            <input type="submit" value="Calculate scholarship" />
        </div>
    </form>
    Basically, the code in the form's onsubmit attribute calls the showScholarship function and then stops the submission of the form by returning false. this.score.value returns the value of the score input in the form. What happens in the showScholarship function is probably pretty self-explanatory.

    You could also do something similar with PHP through form submission (which wouldn't require users to have JavaScript enabled), or with a combination of JavaScript and PHP using Ajax techniques to fetch and show data from the server without loading a new page. But the latter might be overkill for what you're trying to do. :)

  3. #3
    Join Date
    Dec 2012
    Posts
    81
    Hey refreezed...

    I'm now trying to fashion this to exactly what I need, but I don't know why this particular snippet doesn't work when I try it...

    Code:
      var scholarship;
    
      if (score = 0)
        scholarship = 5550;
      if (score >= 1 && score <= 100)
        scholarship = 5500;
      else if (score >= 101 && score <= 200)
        scholarship = 5400;
      else
        scholarship = 0;
    If a score of zero is entered, then I want the scholarship amount of $5550 to display. If the score is between two integers, then another value will display and so on. But when I try this with any value, I get a scholarship display of $0 every time...

    Is my "between" clause written incorrectly?

    I have also tried other comparison operators such as '==' and '==='


    I'm a bit lost...

  4. #4
    Join Date
    Dec 2012
    Posts
    81
    Hi again... I don't know if I solved my problem or not... I think I've created a new one. Instead of trying to figure out the whole "between" clause... I've gone with this...

    Code:
    	
            if (score < 1)
    		scholarship = 5550;
    		
    	else if (score < 101)
    		scholarship = 5500;
    		
    	else if (score < 201)
    		scholarship = 5400;
    
    	else if (score < 301)
    		scholarship = 5300;		
    
    	else if (score < 401)
    		scholarship = 5200;

    However, now I'm trying to add additional variables... Here's what I have so far...

    Code:
      
      var scholarship;
      var item2;
      var item3;
      var item4;
      var item5;
      var item6;
    
    	if (score < 1)
    		scholarship = 5550;
                    item2 = 0;
                    item3 = 23;
    		item4 = 55;
                    item5 = 0;
                    item6 = 633;
    
    	else if (score < 101)
    		scholarship = 5500;
    		
    	else if (score < 201)
    		scholarship = 5400;
    
    	else if (score < 301)
    		scholarship = 5300;		
    
    	else if (score < 401)
    		scholarship = 5200;
    But when I run this, I get errors when I'm adding on these extra variables.

    Any ideas?

  5. #5
    Join Date
    Aug 2008
    Location
    Sweden
    Posts
    227
    = is not a comparison operator - it's an assignment operator. score = 0 will set score to 0, and in JavaScript that whole assignment expression will also return the value (which in this case is 0). So what happens when you say

    if (score = 0)

    is that score is set to 0, then the if statement checks if 0 is true. It's not, so the next statement will not execute. The following if statements will also fail because we never check if score is 0. Ultimately, the statement after the last else is executed - setting scholarship to 0.

    Your code should look more like this:

    Code:
      if (score == 0)
        scholarship = 5550;
      else if (score <= 100) // Here we already know score > 0 because the
        scholarship = 5500;  //   last if-statement failed.
      else if (score <= 200) // And here we already know score > 100.
        scholarship = 5400;
      else
        scholarship = 0; // A score higher than 200 means we get here.
    Edit:

    Just saw your new post.

    You need curly brackets if you're executing multiple statements in an if block.

    Code:
    	if (score < 1) {
    		scholarship = 5550;
                    item2 = 0;
                    item3 = 23;
    		item4 = 55;
                    item5 = 0;
                    item6 = 633;
    	}
    Last edited by ReFreezed; 01-13-2013 at 12:52 AM.

  6. #6
    Join Date
    Dec 2012
    Posts
    81
    Thanks refreezed! It's all working and good now.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles