Jquery, variable not picking the correct value

Question

In html, i have 2 links with different ids. When i click on both the id's the code enters the first condition of the "If" loop. Any idea what's wrong?

Html:

  <ul class="megamenu-list menuapp">
            <li class="title">Types</li>
            <li><a href="app.html" id="sop">SOP</a></li>
            <li><a href="app.html" id="tpc">TPC</a></li>
    </ul>

My jquery script:

$(document).ready(function(){ 
var $appload;

    $(".menuapp li a").click(function(){
      $appload = $(this).attr('id');
      alert($appload);
    });

  if($appload ="tpc"){ 
    alert("insop"); //in both cases the code enters this condition.
    $("#dynamic").load("app/sop.html");
  }
  else if ($appload ="sop"){
     alert($appload);
    alert(" intpc");
  $("#dynamic").load("app/tpc.html");
  }
});

`=`, `==` and `===` problem. Change `if($appload ="tpc") {` => `if($appload == "tpc") {` — Tushar, Mar 14 '16 at 05:01
If i add a "==" it never goes into either of the if conditions and the alert messages do not show up. — Canute, Mar 14 '16 at 05:07
That's because the code `if...else` is run only once on page load. Move that code inside the `click` handler. — Tushar, Mar 14 '16 at 05:08

score 2 · Answer 1 · edited May 23 '17 at 12:15

2

Use == to check conditions. = is an assignment operator

Use the below code

if($appload == "tpc")

Same change mut be applied for

else if ($appload == "sop"){

You can use this to understand the concept of ==

Update

As per your code it never goes into either of the if conditions.It is because the code if-else is run only once on page load. You can move that conditional statements inside the click event.

Your code will look something like this

$(document).ready(function() {
  var $appload;

  $(".menuapp li a").click(function() {
    $appload = $(this).attr('id');
    alert($appload);
    if ($appload == "tpc") {
      alert("insop");
      $("#dynamic").load("app/sop.html");
    } else if ($appload == "sop") {
      alert($appload);
      alert(" intpc");
      $("#dynamic").load("app/tpc.html");
    }
  });
});

edited May 23 '17 at 12:15

Community

1
1

answered Mar 14 '16 at 05:02

Rino Raj

6,264
2
27
42

If i add a "==" it never goes into either of the if conditions and the alert messages do not show . Not sure what is happening on page load again. – Canute Mar 14 '16 at 05:09
@Canute check the value of the variable before `if`. – Rino Raj Mar 14 '16 at 05:10
Yes @Tushar You are right. I missed it. – Rino Raj Mar 14 '16 at 05:12
@Canute as Tushar mentioned in his comment it will work only once since you have written that on documnet.ready – Rino Raj Mar 14 '16 at 05:13

score 0 · Answer 2 · answered Mar 14 '16 at 05:18

Put your if statement inside the function and use event.preventDefault() to prevent triggering url of a tag.

$(document).ready(function(){ 
   var $appload;
   $(".menuapp li a").click(function(e){
      e.preventDefault();

      $appload = $(this).attr('id');
      if($appload == "tpc"){ 
        alert("insop"); //in both cases the code enters this condition.
        $("#dynamic").load("app/sop.html");
      }else if ($appload == "sop"){
        alert(appload);
        alert(" intpc");
        $("#dynamic").load("app/tpc.html");
      }
  });
});

score 0 · Answer 3 · answered Mar 14 '16 at 05:19

<ul class="megamenu-list menuapp">
    <li class="title">Types</li>
    <li><a href="javascript:void(0)" id="sop">SOP</a></li>
    <li><a href="javascript:void(0)" id="tpc">TPC</a></li>
</ul>
<script src="jquery-2.2.1.min.js"></script>
<script>



    $(document).ready(function () {
        var $appload;
        $(".menuapp li a").click(function () {
            $appload = $(this).attr('id');
            if ($appload == "tpc") {
                $("#dynamic").load("app/sop.html");
            }
            else if ($appload == "sop") {
                $("#dynamic").load("app/tpc.html");
            }
        });
    });
</script>

Jquery, variable not picking the correct value

3 Answers3