How to pass HTML/php variable into JavaScript

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • mike4722
    New Member
    • Aug 2007
    • 6

    How to pass HTML/php variable into JavaScript

    I wish to have the form to be able to automatically select the radio button based on the logic of HTML/php variable. example show below:

    javascript:

    [CODE=javascript]function autoForm(value)
    {
    var myForm = document.forms["search"];

    if (value == '1')
    myForm.elements["category"][0].checked = true;
    if (value == '0')
    myForm.elements["category"][1].checked = true;
    }[/CODE]

    [CODE=html]<body onload = "autoForm('1')" >[/CODE]

    html:

    [HTML]<form name = "search">
    <input type = "radio" name = "category"/>category 1
    <input type = "radio" name = "category"/>category 2

    <?php
    $value = '1'; /* with either 1 or 0 */
    ?>
    </form>[/HTML]

    Question:

    if I pass value as constant, it will work as shown in next line code,
    <body onload = "autoForm('1')" > or <body onload = "autoForm('0')" >

    if I pass value as variable from php, it doesn't work at all,
    <body onload = "autoForm("$val ue")">

    How I can pass value of variable from html/php into Java Script ?
    Thanks for ur insight..
    Last edited by gits; Aug 21 '07, 09:18 PM. Reason: added code tags
  • gits
    Recognized Expert Moderator Expert
    • May 2007
    • 5388

    #2
    hi ...

    welcome to TSDN ...

    you have to use single quotes inside the onload, or no quotes when you are sure that $value is always a number and $value must be printed to the html page (that has to be processed before sent to the client):

    Code:
    <body onload = "autoForm($value);">
    kind regards

    Comment

    • mike4722
      New Member
      • Aug 2007
      • 6

      #3
      Thanks for ur response.

      I tried it either use single quotes inside the onload, or no quotes at all. Both doesn't make Javascript see the value the onLoad try to pass in.

      <body onload = "autoForm($RRI) ;">
      <body onload = "autoForm('$RRI ');">

      However, in HTML/Php portion of code, if I did
      echo "<hr><b>the RRI value is: ".$RRI." </b><br />";

      On HTML page, it will show
      the RRI value is: 1

      Still stretch my hair :-(((

      Thanks

      Comment

      • jx2
        New Member
        • Feb 2007
        • 228

        #4
        [CODE=html]<body onload = "autoForm('<?ph p echo $value; ?>')">[/CODE]


        regards
        jx2

        Comment

        • mike4722
          New Member
          • Aug 2007
          • 6

          #5
          I tried the following three variation, none of them able to pass the value to JavaScript:
          [code=html]
          <body onload = "autoForm('<?ph p echo $value; ?>')">
          <body onload = "autoForm(< ?php echo $value; ?>)">
          <body onload = "autoForm(< ?php echo "$value"; ?>)">
          [/code]
          However, in HTML, this code[code=php]
          <?php
          echo "the value is $value</b><br />";
          ?>[/code]
          will display
          the value is 1

          Any suggestion is welcomed..

          Thanks
          Last edited by pbmods; Sep 3 '07, 06:31 PM. Reason: Added [CODE] tags.

          Comment

          • gits
            Recognized Expert Moderator Expert
            • May 2007
            • 5388

            #6
            hi ...

            as i said ... it has to be printed to the html ;) ... (or even echoed :) )

            ok ... is $value initialized with a value before you print it to the onload-function? ... try it in firefox and have a look at the js-console ... are here errors in it?

            kind regards

            Comment

            • mike4722
              New Member
              • Aug 2007
              • 6

              #7
              Here's my testing script/html:

              [HTML]<html>
              <head>
              <title>Configur ation Testing</title>
              <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
              <script type="text/javascript">
              function autoForm(value) {
              var myForm = document.forms["thisform"];
              if (value == '1')
              myForm.category[0].checked=true;
              if (value == '0')
              myForm.category[1].checked=true;
              }
              </script>
              </head>
              <body onload="autoFor m('<?php echo $value; ?>')">

              <form name="thisform" method="post" action="next-test.php">
              <?php
              $value='1';
              echo "$value</b><br />";
              ?>

              The selection choice:<br />
              Enable:<input type="radio" value="Enable" name="category" >:<br />
              Disable:<input type="radio" value="Disable" name="category" >:<br />
              <input type="submit" value="submit" name="submit">< br />
              </form><br />
              [/HTML]
              Here's the page display, after the form is executed:

              1
              The selection choice:
              Enable:: <=== both radio button is blank
              Disable::

              Here's the chunk of form source code display from Firebug, after the form is executed:

              [HTML]</script>
              </head>
              <body onload="autoFor m('')">
              [/HTML]
              In other words, the '1' of $value didn't substitute here, why ?? I don't get it.

              Without php assitance in form's source code, for example
              <body onload="autoFor m('1')">
              This will work as it will display exactly the same in firebug.

              However, for source code as:
              <body onload="autoFor m('$value')">
              , it won't work as it will display the same in firebug. It treat $value as string char.

              Did I miss something terrible ? Still learn how to debug from firebug !
              I'm using firefox, no error from firebug console as far as I can tell.

              Thanks much for ur help,
              Last edited by acoder; Aug 22 '07, 05:54 PM. Reason: Added code tags

              Comment

              • acoder
                Recognized Expert MVP
                • Nov 2006
                • 16032

                #8
                Please use CODE tags when posting code. Thanks!

                I think you're setting $value afterwards. Move it up to before the body tag.

                Comment

                • mike4722
                  New Member
                  • Aug 2007
                  • 6

                  #9
                  Yes, u are hitting right on the nail... after I move $value section before the <body> tag, everything works great.

                  May be I was naive about this, I thought <body onload="> always has to be at top of HTML, and will be executed as last section of html code after form loaded?
                  <body onload="functio n()">, I was wrong obviously.

                  Any pointer on how "onload" is working?

                  Thanks for everyone's great help and wisdom.

                  Comment

                  • acoder
                    Recognized Expert MVP
                    • Nov 2006
                    • 16032

                    #10
                    Yes, onload will run on page load, but that's Javascript. PHP will run whilst the page is loading. In actual fact, what's happening is that you're just generating what parameters will be passed to Javascript for the function which will run on page load.

                    Comment

                    • mike4722
                      New Member
                      • Aug 2007
                      • 6

                      #11
                      This is what caught me logically. If "Onload" is part of Javascript, and PHP generating the parameters for it, then they are two separate piece and the actual sequence of code line shall not be matter, right ?
                      Hence, it seems this "onLoad" tend to execute at the beginning of HTML form, not at the end of page reload.

                      Let's say, if I have HTML "radio button" preset with "checked" after the <input type="radio", checked> , then "onLoad" invoke the JavaScript with "unchecked" to reset it by whatever the logic, then what the form will display ?
                      If "onLoad" execute first, then the botton will be "checked",
                      if "onLoad" execute last, then the botton will be "unchecked" .

                      Thanks again for ur thoughtful insight..

                      Comment

                      Working...