1

can anyone help me with this if else statement....

Coding

<script>
$("#id_add_select").change(function(){
    if($("#id_add_select" == "2")){
        handler(1)
    } else {
        handler(2) 
    } 
}); 


function handler(situation){
var situation = situation;
    switch (situation)
    case 1:
          display: (".name")
          display: (".address")
    case 2:
          disable: (".age")
          disable: (".email")   
}
</script>

html coding

<html>
 ------

<select name="add_select" id="id_add_select">
        <option value="1">working</option>
        <option value="2">not working</option>
        <option value="3">retired</option>
</select>

 ------- 

my situation is if i select 2"not working" then it will display case 1. else will display case 2. basic one but i just can't figure it out. thanks a million.

1
  • You know you have to surround the js code with $(document).ready(function(){...}); for it to work with jQuery, right? Commented Oct 15, 2012 at 10:51

7 Answers 7

3

This is not right:

if($("#id_add_select" == "2")){

You probably want to do something like:

if($(this).val() == 2) {

You can do more optimizations with your code, but this should be in the right direction:

$("#id_add_select").change(function(){
    if($(this).val() == 2){
        handler(1)
    } else {
        handler(2) 
    } 
});

Alternative solution

IMO, using a map object with functions is cleaner than using switch statements in your case. So I would probably do something like:

var actions = {
    1: function() {
        // first choice logic
    },
    2: function() {
        // second choice logic
    }
};

$("#id_add_select").change(function() {
    actions[this.value]();
});

Demo: http://jsfiddle.net/PurjS/

Sign up to request clarification or add additional context in comments.

2 Comments

dont forget the colons to avoid possible issues in case you edit it in future. (though this runs without colons aswell)
@Jan-StefanJanetzky Colons? Semicolons perhaps?
2

if($("#id_add_select" == "2")){ => if($("#id_add_select").val() == "2"){

Comments

2

First of all you aren't getting any value:

  <script>
  $("#id_add_select").change(function(){
     if($("#id_add_select").val()==2){
     handler(1);
   } else {
     handler(2);
    } 
  }); 
  </script>

Don't forget to put the break statement after every case in the switch loop.

1 Comment

irrelevant. javascript does semicolon autoinsertion for theese two
1

Figuring out why certain things can't work

$("#id_add_select" == "2")

Apparently, you intended to check whether the selected element's value was 2. However, without needing to know how jQuery works, it's clear that this cannot work.

For this, you simply need to dissect the statement into its essential parts.

We have a function call $() which we perform by passing one argument: "#id_add_select" == "2".

We notice, that the argument to the function is completely independent of the actual call, which is true for all function calls. What this means is, that the result of the comparison will be passed. Because both operands of the comparison are literals, we can evaluate the expression ourselves and replace it by a constant: "#id_add_select" == "2" is obviously not equal, thus the result will be false.

We conclude, that it is the same as writing: $(false). From here, it should be obvious that this code can't check whether some arbitrary element has the value 2.


In addition to the other answer, be aware of

How Switch/Case works

Be aware, that JavaScript's switch/case statement has fall-through behavior.

This means, that once a case clause is executed because it's value matches the input x, it will execute all code below it until it hits a break; statement to exit the switch/case construct.

In the below example, executing printTo5Or8(1) will not have it terminate after console.log(1), instead, it will "fall through" to console.log(2); until the break; statement!

function printTo5Or8(x) {
    switch(x){
        case 1: 
            console.log(1); 
        case 2: 
            console.log(2);
        case 3: 
            console.log(3);
        case 4: 
            console.log(4);
        case 5: 
            console.log(5);
            break;
        case 6:
            console.log(6);
        case 7:
            console.log(7);
        case 8:
            console.log(8);

    }
}
printTo5Or8(1); // Prints 1 2 3 4 5
printTo5Or8(3); // Prints 3 4 5
printTo5Or8(6); // Prints 6 7 8
printTo5Or8(7); // Prints 7 8

Invalid Syntax

The switch/case statement requires a block: { statements; } to follow after switch(expression)! You don't have any.


display: (".name")
display: (".address")

You probably meant display(".name");. At the moment, you have labels that do nothing.

Redundant code

function handler(situation){
    var situation = situation; // <-- Remove

The formal parameter list (situation) already declares a local variable situation. It is not necessary to declare it.

Conclusion

I suggest you devote some energy to learning JavaScript as a language. Knowing how JavaScript works will help you to reason about your code and rule "impossible" code that couldn't ever work. Without a good grasp on how programming languages or in this case JavaScript works, programming will feel like mixing together some magic incantations that just happen to do sometimes what you want, but go awry more often than not.

Programming is an exact science, not guessing and luck.

1 Comment

good explaination. i think this is a worth answer to the question.
0

i think this code is more clean:

<script>
$("#id_add_select").change(function(){

if( $(this).val() == "2"))
    handler(1)
 else 
    handler(2) 

}); 


function handler(situation){

switch (situation){
case 1:
      display: (".name");
      display: (".address");
      break;
case 2:
      disable: (".age");
      disable: (".email");
       break;  
}
}
</script>

Comments

0

a piece of optimized love:

$("#id_add_select").change(handler);

var handler = function () {
    switch (this.value) {
        case 1:
            display(".name");
            display(".address");
            break;
        default:
            disable(".age");
            disable(".email");
            break;
    }
};

or this way:

$("#id_add_select").change(function () {
    switch (this.value) {
        case 1:
            display(".name");
            display(".address");
            break;
        default:
            disable(".age");
            disable(".email");
            break;
    }
});

or this way:

$("#id_add_select").change(function () {
    if (this.value === "1") {
        display(".name");
        display(".address");
    } else {
        disable(".age");
        disable(".email");
    }
});

also dont forget that you need a display and a disable method (but i guess you already have made them because your code looks like you have)

1 Comment

@NewbieDjango Instead of posting "Thanks", you can upvote answers that have been helpful. Comments are here to discuss posts or provide constructive feedback, not to say thanks ;)
0
    <html>
    <head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>


    <script>
    $(document).ready(function(){
    $("p").click(function(){
    $(this).hide();
    });

    $("#id_add_select").change(function(){

        if($(this).val() == "2")
            handler(1)
         else 
            handler(2) 
    });  
    });
     function handler(situation)
    {
    switch (situation){
    case 1:
     alert(situation);
      break;
    case 2:
      alert(situation);
       break;  
    }
    }
</script>
</head>

<body>
<p>If you click on me, I will disappear.</p>
<select name="add_select" id="id_add_select">
        <option value="1">working</option>
        <option value="2">not working</option>
        <option value="3">retired</option>
</select>
</body>

</html>

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.