djac
djac

Reputation: 197

when 2nd javascript is called by 1st javascript , it is not getting executed

Following is my code. The issue is , the 2nd javascript [changeText(i)]is not getting executed when it is called by 1st javascript [changeImage(i)] (I tried it in firefox and chrome.). I think even the call for the script changeText(i) is not executing. Can you help me to find out the above stated problem? what might be the reason behind changeText(i) is not executing?

<html>

  <head>
    <title>Menu</title>

    <script type="text/javascript">
      function changeText(i)
                {

                        switch(i)
                                    {
                            case 'a':   document.getElementById('hed').innerHTML = "Previous Month"+ <?php echo "hai"; ?> ;

                                                break;
                            case 'b':  document.getElementById('hed').innerHTML = "You pressed " + <?php echo "hai"; ?> + i;
                                                break;

                            default: return false;
                        }

        }
    </script>

    <script type="text/javascript">
      function changeImage(i) {

        var img = document.getElementById("img");

        switch (i) {
          case 'a':
            img.src = "graph_bar.php";
            changeText(i);
            break;
          case 'b':
            img.src = "graph_bar1.php";changeText(i);
            break;
          default:
            return false;
        }
      }

    </script>

  </head>

  <body bgcolor="#FFFFFF">

    <div align="center">

      <input type="button" value="Previous-Day" onclick="changeImage('a');" />&nbsp &nbsp
      <input type="button" value="Previous-Month" onclick="changeImage('b');" />



    <table style="width:100%">
      <tr>
        <th>Type of Index: <strong id="hed"> </strong></th>
        <th>

        </th>

      </tr>


    </table>
    <div>

    <img id="img">

    </div>

    </div>

  </body>    
</html>

Upvotes: 1

Views: 41

Answers (2)

epascarello
epascarello

Reputation: 207527

Well now that you showed what is actually happening with the edit, you can see your PHP is causing a syntax error

"You pressed " + <?php echo "hai"; ?> + i;

will produce

"You pressed " + hai + i;

and I doubt you have a javascript variable hai. It needs to be quoted. Look into using json_encode to output the string.

Upvotes: 0

sumit chauhan
sumit chauhan

Reputation: 1300

your change text is not executing in case b because you didn't call the function over there.

<html>

  <head>
    <title>Menu</title>

    <script type="text/javascript">
      function changeText(i) {
        document.getElementById('hed').innerHTML = "Previous Month";
        switch (i) {
          case 'a':
            document.getElementById('hed').innerHTML = "Previous Month";
            break;
          case 'b':
            document.getElementById('hed').innerHTML = "You pressed " + i;
            break;

          default:
            return false;
        }

      }

    </script>

    <script type="text/javascript">
      function changeImage(i) {

        var img = document.getElementById("img");

        switch (i) {
          case 'a':
            img.src = "https://placeimg.com/300/100/animal";
            changeText(i);
            break;
          case 'b':
            img.src = "https://placeimg.com/300/100/tech";
			changeText(i);
            break;
          default:
            return false;
        }
      }

    </script>

  </head>

  <body bgcolor="#FFFFFF">

    <div align="center">

      <input type="button" value="Previous-Day" onclick="changeImage('a');" />&nbsp &nbsp
      <input type="button" value="Previous-Month" onclick="changeImage('b');" />

    </div>

    <table style="width:100%">
      <tr>
        <th>Type of Index: <strong id="hed"> </strong></th>
        <th>

        </th>

      </tr>
      <tr>
        <td>Master Id : <strong id="hed1"> </strong></td>

      </tr>

    </table>
    </div>

    <img id="img">

    </div>

    </div>

  </body>    
</html>

Upvotes: 1

Related Questions