hi,
my purpose of my code is to get an array of subcategory details
and format it and when when mouse over some subcategory
- an image will change (dynamically).
this code is PHP with Javascript


My problem is how can i get the variable 'key1' from the javascript
funtion to the PHP which echoes the .src
here: (key1 is the a key number is an array of images)
document.getElementById("cat_subcat_img").src="<?php echo IMG_SUBCAT_DIR.$subcat_img1["key1"]; ?>";

my full code:

foreach($subcat as $key => $val) {   //inner foreach
  $subcat_id = $val['id'];
  $sub_category = $val['subcat']; 
	  
  $subcat1 = array( );
  $subcat_img1[] = $val['img'] ; ?>
	 
 <script language="Javascript1.2"  type="text/javascript"> 
    function changeSrc_subcat1(key1) {
       document.getElementById("cat_subcat_img").src="<?php echo IMG_SUBCAT_DIR.$subcat_img1["key1"]; ?>";
		  }
	  </script>
													
	 <tr valign="top">
		 <td valign="top" align="left" nowrap="nowrap">
		  <!-- LINK to display products of the current sub category -->
		  <a href="shw_subcat_prod.php?subcatID=<?php echo $subcat_id; ?>" class="subcat" onMouseOver="changeSrc_subcat1(<?php echo $key; ?>)"><?php echo $sub_category; ?></a>
		  </td>
	 </tr>
	 
	 <?php
	} //end foreach

Recommended Answers

All 3 Replies

hi,
my purpose of my code is to get an array of subcategory details
and format it and when when mouse over some subcategory
- an image will change (dynamically).
this code is PHP with Javascript


My problem is how can i get the variable 'key1' from the javascript
funtion to the PHP which echoes the .src
here: (key1 is the a key number is an array of images)
document.getElementById("cat_subcat_img").src="<?php echo IMG_SUBCAT_DIR.$subcat_img1["key1"]; ?>";

my full code:

foreach($subcat as $key => $val) {   //inner foreach
  $subcat_id = $val['id'];
  $sub_category = $val['subcat']; 
	  
  $subcat1 = array( );
  $subcat_img1[] = $val['img'] ; ?>
	 
 <script language="Javascript1.2"  type="text/javascript"> 
    function changeSrc_subcat1(key1) {
       document.getElementById("cat_subcat_img").src="<?php echo IMG_SUBCAT_DIR.$subcat_img1["key1"]; ?>";
		  }
	  </script>
													
	 <tr valign="top">
		 <td valign="top" align="left" nowrap="nowrap">
		  <!-- LINK to display products of the current sub category -->
		  <a href="shw_subcat_prod.php?subcatID=<?php echo $subcat_id; ?>" class="subcat" onMouseOver="changeSrc_subcat1(<?php echo $key; ?>)"><?php echo $sub_category; ?></a>
		  </td>
	 </tr>
	 
	 <?php
	} //end foreach

You cannot pass a variable from JavaScript to PHP on the server, or pass PHP to javascript on the client.
JavaScript executes on the client (usually a browser) and PHP on the web server.

The only cases where passing new params from client to/from server this is needed, is if you want the browser to retrieve new information from the server. For this, the Client will make a new HTTP Request to the PHP page, and retrieve variables passed as strings in the HTTP Response. (Eg: XMLHttpRequest, Iframe Remoting, On Demand JS etc.)

In the example you have, all the information needed exists on one execution of a PHP file/page on the Server.

I believe what you want to do is write these PHP variables into an HTML page so they can be used by JavaScript.

To do this, you'll need to output the PHP variables as JavaScript variables. These variables can be written as JavaScript literals between the <script> tags, or placed in the HTML event handlers.

In the example below, the PHP variable, $img_url; , is placed directly in the event handler.

onMouseOver="changeSrc_subcat1('<?php echo $img_url; ?>')"

When the HTML is printed out, it will look like this example:

onMouseOver="changeSrc_subcat1('http://example.com/image.jpg')"

As you can see, the $img_url variable in PHP is printed out in HTML as a JavaScript String Literal.

Heres the example code:

<?php

foreach($subcat as $key => $val) {   //inner foreach
  $subcat_id = $val['id'];
  $sub_category = $val['subcat'];  
  $img_url = $val['img'] ; // is this image url?

?>
											
	 <tr valign="top">
		 <td valign="top" align="left" nowrap="nowrap">
		  <!-- LINK to display products of the current sub category -->
		  <a href="shw_subcat_prod.php?subcatID=<?php echo $subcat_id; ?>" class="subcat" onMouseOver="changeSrc_subcat1('<?php echo $img_url; ?>')"><?php echo $sub_category; ?></a>
		  </td>
	 </tr>
	 
	 <?php
	} //end foreach

?>

<script language="Javascript1.2"  type="text/javascript"> 
    function changeSrc_subcat1(src) {
       document.getElementById("cat_subcat_img").src= src;
		  }
	  </script>

Thank you very much that workes !!! :)

Thank you very much that workes !!! :)

you're welcome... :)

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.