0

i am trying to enter a number in the textbox and show the message as name of the day in another div tag via switch function. the variable i am passing into switch function has to get the value from the textbox. but i am not able to output the function on clicking button, it shows the message "undefined". Help please :). Thank you

<input type = "text" id = "test" />
<br>
<div id="box3" style = "border:solid 2px blue; height:15px;width:100px;"></div>
<br>
<input type = "button" onClick = "myTest()" value = "Click me" />

<script type="text/javascript">
function myTest(){
var x;
var d =document.getElementById('test').value;
switch (d)
{
case 0:
x="Today it's Sunday";
break;
case 1:
x="Today it's Monday";
break;
case 2:
x="Today it's Tuesday";
break;
case 3:
x="Today it's Wednesday";
break;
case 4:
x="Today it's Thursday";
break;
case 5:
x="Today it's Friday";
break;
case 6:
x="Today it's Saturday";
break;
}
document.getElementById('box3').innerHTML=x;
}

</script>

6 Answers 6

1

you need to cast it to an integer first:

var d = parseInt(document.getElementById('test').value);
Sign up to request clarification or add additional context in comments.

Comments

1

You're cases are all ints, everything that comes from the dom will be a string, so you'll have to fix that:

var d = +(document.getElementById('test').value);//+ converts to number

Be sure there are no characters in there, though as +someString will return NaN when the string looks like 123fdsf. parseInt can deal with numbers, followed by chars, but isn't all too friendly with strings with leading spaces and leading zeroes (interprets input as octal), so preferably use parseFloat if its likely the input will contain chars/leading zeroes.

Alternatively, quote your cases, and provide a defaul case:

case '6': x = 'Today is Saturday'; break;
default: x = 'Don\'t know what '+d+' is';

So you can see what value you passed to the switch


In response to @KooiInc Let's simplify: let's optimize and, admittedly, complicate (but improve performance):

Closure: (dom needs to be loaded first here)

var test = (function(dayArray)
{
    var out = document.getElementById('box3');//only search dom once
    var in = document.getElementById('test');
    return function()
    {
        var day = dayArray[in.value] || 'Don\'t know day ' + in.value;
        out.innerHTML = 'Today is ' + day;
    }
})('Sunday,Monday,Tuesday,Wednessday,Thursday,Friday,Saturday'.split(','));

function properties:

function test()
{
    if (!test.inElem)
    {
        test.inElem = document.getElementById('test');//search dom on first call
    }
    if (!test.outElem)
    {
        test.outElem = document.getElementById('box3');
    }
    if (!(test.days instanceof Array))
    {
        test.days = 'Sunday,Monday,Tuesday,Wednessday,Thursday,Friday,Saturday'.split(',');//create array once
    }
    var day = dayArray[test.inElem] || 'Don\'t know day ' + test.inElem;
    test.outElem.innerHTML = 'Today is ' + day;
}

These examples are just for fun. I know premature optimization is the root of all evil, so don't worry about it that much at this stage. Just know that functions are objects, so you can set properties, that remain in memory, even after the function has returned, and know that closures can do that, too (and Sóó much more).

1 Comment

@kambajwa: It's custom to accept the answer that solved your problem, and upvote those that were generally helpful/informative. Just saying (just offered 100rep bounty and I'm trying to get that rep back, so I could certainly do with an upvote). Also: accepting any of these answers will give you some rep, too
0

It's reading the value as a string, not an int.

Either you convert your value at the switch statement to an int, or change your case to strings.

e.g. for each case statement

case '1':

instead of

case 1:

or

switch ( d ) {

becomes

switch ( Number ( d ) ) {

Comments

0

Whenever you get a number from an input you really need to parse it to a number type.

var d = parseInt(document.getElementById('test').value, 10);

Comments

0

I'd recommend using an array instead of a switch statement. Also you need to parse your input as a number.

function myTest() {
    var days = [
        'Sunday',
        'Monday',
        'Tuesday',
        'Wednesday',
        'Thursday',
        'Friday',
        'Saturday'
    ];

    var d = parseInt(document.getElementById('test').value, 10);

    document.getElementById('box3').innerHTML = 'Today is ' + days[d];
}

1 Comment

Nice idea, I'd like to add some side-notes, though: when using an array (since Arrays are objects, and JS internally converts the keys to strings anyway) the parseInt can be omitted. I know this might be confusing for the OP, but I'd set the array in a closure, so as to not construct an array on each function call, or set it as a property of the function.
0

Let'simplify:

function dayOfWeek(val){
 // create an array of weekdays
 var dow = 'Sunday,Monday,Tuesday,Wednessday,Thursday,Friday,Saturday'
            .split(',');
 // print a string in #box3
 document.getElementById('box3').innerHTML = 
     'Today it\'s '+dow[Number(val)] || 'can\'t determine';
}
dayOfWeek(document.getElementById('test').value);

See jsfiddle

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.