Use a PHP variable in Javascript - php

How can I use a PHP variable inside the Javascript onclick=function?
<?php
for($i=0;$i<10;$i++){
echo '<li><div><img src='. $mobile_image_link[$i+$p] .' width="160" height="165" alt="" border="0" /></div></div></li>';
}
?>

Just concatenate the strings, and use backslashes to escape the necessary quotes:
echo '
<a href="#"
onclick="showPopUp(\''. $mobile_image_link[$i+$p].'\',
\''. $mobile_image_link[$i+$p].'\');">
<img src="'.$mobile_image_link[$i+$p].'" alt="" />
</a>'
Would result in:
<a href="#"
onclick="showPopUp('http://mylink.com/1',
'http://mylink.com/2');">
<img src="http://mylink.com/image.png" alt="" />
</a>
On a side note, please read the HTML latest specifications, setting tag style using width="", height="" and border="" is deprecated and discouraged

Simply echo php variable in javascript code:
<script type="text/javascript">
var js_variable= <?php echo $php_variable; ?>
</script>

Either use the double quotes approach (php variables are only inserted into double quote strings.
<?php for($i=0;$i<10;$i++){
echo "<li><div><img src=\"$mobile_image_link[$i+$p]\" width="160" height="165" alt="" border="0" /></div></div></li>";}
?>
or do what you already did for the img tag. You'll need to escape some quotes to make it work.
<?php for($i=0;$i<10;$i++){
echo '<li><div><img src="'.$mobile_image_link[$i+$p].'" width="160" height="165" alt="" border="0" /></div></div></li>';}
?>

<?php
for($i=0;$i<10;$i++){
$onclickvariable = "showPopUp('".$mobile_image_link[$i+$p]."','".$mobile_image_link[$i+$p]."');"
echo '<li><div><a href="#" onclick="'.$onclickvariable.'">
<img src='.$mobile_image_link[$i+$p].' width="160" height="165" alt="" border="0" /></a>
</div></li>';}
?>

Related

Style an echoed image

it seems like I cannot style my echoed image in php. How can I do this? Thanks :)
<img src="data:image/jpeg;base64,'.base64_encode($row['image'] ).'" height="80px" width="80px" class="img-thumnail" style="margin-bottom:90px;"/>
Try This code
<img class="im" src="data:image/jpeg;base64,'<?php echo base64_encode($row['image'] ); ?>'" height="180px" width="180px" class="img-thumnail" style="margin-bottom:90px;"/>

Using a $_GET variable as img src

I am trying to link an image using the same name as a $_GET variable, example bellow:
The $_GET
$venue = $_GET['venue'];
Is it possible to use '$venue' as the image src example being something like
<div id="imgbox">
<img src="$venue.jpg" alt="venueimage" height="150" width="250">
</div>
My attempts so far have been unsuccessful, is it possible in a similar way to this or is there an alterantive?
Thankyou
You forgot your PHP tags and echo statement:
<div id="imgbox">
<img src="<?php echo $venue; ?>.jpg" alt="venueimage" height="150" width="250">
</div>
or shorthand:
<div id="imgbox">
<img src="<?= $venue; ?>.jpg" alt="venueimage" height="150" width="250">
</div>
As pointed out by Quentin we should take this a step further and sanitize our output:
<div id="imgbox">
<img src="<?= htmlspecialchars($venue); ?>.jpg" alt="venueimage" height="150" width="250">
</div>
You should be able to use <img src="<?php echo $venue; ?>.jpg" alt="venueimage" height="150" width="250">
I forgot to sanitize the code as well. You would need to add:
<img src="<?php echo htmlspecialchars($venue); ?>.jpg" alt="venuimage" height="150" width="250">

Regex to replace url in html page

i have an html page
<tr>
<td rowspan="7">
<a href="http://www.link1.com/" style="text-decoration: none;">
<img src="image1.jpg" width="34" height="873" alt="" style="display:block;border:none" />
</a>
</td>
<td colspan="2" rowspan="2">
<a href='http://www.link1.com/test.php?c=1'>
<img src="image1.jpg" width="287" height="146" alt="" style="display:block;border:none" />
</a>
</td>
<td colspan="2" rowspan="2">
<a href='http://www.url.com/test.php?c=1'>
<img src="image1.jpg" width="287" height="146" alt="" style="display:block;border:none" />
</a>
</td>
I want to replace all url in href by mytest.com?url=$link
I try with :
$messaget = preg_replace('/<a(.*)href="([^"]*)"(.*)>/','mytest.com?url=$2',$messaget);
This may help you in the short run:
preg_replace('/<a (.*)href=[\'"]([^"]*)[\'"](.*)>/', '<a $1href="mytest.com?url=$2"$3>', $messaget);
In your regex you were using href="...", that is, double quotes, but in your HTML you have a mixture of both double and single quotes.
And in the replacement string you forgot to include $1 and $3.
That said, DO NOT use regex to parse HTML. The answer by #BenLanc below is better, use that instead. Read the link he posted.
Don't use regex on HTML, HTML is not regular.
Assuming your markup is valid (and if it's not, pass it through Tidy first), you should use xpath, to grab the elements and then update the href directly. For example:
<?php
$messaget = <<<XML
<tr>
<td rowspan="7">
<a href="http://www.link1.com/" style="text-decoration: none;">
<img src="image1.jpg" width="34" height="873" alt="" style="display:block;border:none" />
</a>
</td>
<td colspan="2" rowspan="2">
<a href='http://www.link1.com/test.php?c=1'>
<img src="image1.jpg" width="287" height="146" alt="" style="display:block;border:none" />
</a>
</td>
<td colspan="2" rowspan="2">
<a href='http://www.url.com/test.php?c=1'>
<img src="image1.jpg" width="287" height="146" alt="" style="display:block;border:none" />
</a>
</td>
</tr>
XML;
$xml = new SimpleXMLElement($messaget);
// Select all "a" tags with href attributes
$links = $xml->xpath("//a[#href]");
// Loop through the links and update the href, don't forget to url encode the original!
foreach($links as $link)
{
$link["href"] = sprintf("mytest.com/?url=%s", urlencode($link['href']));
}
// Return your HTML with transformed hrefs!
$messaget = $xml->asXml();
Don't forget /m at the end of your regexp since your are using multiline source:
PHP Doc PCRE
Regex to match an url:
/^(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?$/
More background info

Why won't my image name convert to lowercase in PHP?

Here is the code I'm using:
<img src="/images/<?php strtolower(the_title()); ?>.jpg" border="0" >
Wordpress the_title() function echoes the title by default. You need to set the echo argument to false and echo the lowercase output yourself.
<img src="/images/<?php echo strtolower(the_title('','',false)); ?>.jpg" border="0" />
It looks like the_title() actually echo's out the title since you don't have an echo statement in your snippet. So your call to strtolower() is basically doing nothing. You'll need to capture the output of the_title() then you can convert it to lower case.
ob_start();
the_title();
$title = $template = ob_get_clean();
<img src="/images/<?php echo strtolower($title); ?>.jpg" border="0" />

Using Wordpress methods in echo - doesn't seem to work correctly?

Not even sure if methods is the correct terminology...
Here is the original working code:
<a href="<?php bloginfo('url'); ?>">
<img src="<?php bloginfo('stylesheet_directory'); ?>/images/logo.png" alt="Polished Logo" id="logo"/></a>
<img src="<?php bloginfo('stylesheet_directory'); ?>/images/separator.png" width="2" height="59" alt="Line" class="logo_line"/>
<p id="logo_title"><?php bloginfo('description'); ?></p>
I wanted it to only execute on the homepage, so I wrote this:
<?
if ( $_SERVER["REQUEST_URI"] == '/' ){
echo '<a href="'.bloginfo('url').'">
<img src="'.bloginfo('stylesheet_directory').'/images/logo.png" alt="Polished Logo" id="logo"/></a>
<img src="'.bloginfo('stylesheet_directory').'/images/separator.png" width="2" height="59" alt="Line" class="logo_line"/>
<p id="logo_title">'.bloginfo('description').'</p>';
}
?>
But it outputs the bloginfo() and the other declarations completely outside the html tags I have created. For instance, with bloginfo('stylesheet_directory') it will display the directory outside the IMG tags I created.
Any ideas? Apparently my syntax isn't correct or something....
bloginfo function directly echoes the output. In this case you should use get_bloginfo to add the returned value to the string and echo the complete string. I believe this will work
<?php
if ( $_SERVER["REQUEST_URI"] == '/' ) {
echo '<a href="'.get_bloginfo('url').'">
<img src="'.get_bloginfo('stylesheet_directory').'/images/logo.png" alt="Polished Logo" id="logo"/></a>
<img src="'.get_bloginfo('stylesheet_directory').'/images/separator.png" width="2" height="59" alt="Line" class="logo_line"/>
<p id="logo_title">'.get_bloginfo('description').'</p>';
}
?>
Here is a better alternative:
<?php if ( $_SERVER["REQUEST_URI"] == '/' ) { ?>
<a href="<?php bloginfo('url') ?>">
<img src="<?php bloginfo('stylesheet_directory') ?>/images/logo.png" alt="Polished Logo" id="logo"/>
</a>
<img src="<?php bloginfo('stylesheet_directory') ?>/images/separator.png" width="2" height="59" alt="Line" class="logo_line"/>
<p id="logo_title"><?php bloginfo('description') ?></p>
<?php } ?>
I also suggest using the is_home() function provided by wordpress to check for the homepage instead of checking the $_SERVER['REQUEST_URI'] value.
bloginfo() outputs data with echo and returns nothing, so instead of trying to concatenate everything, just output in sequence, e.g.
echo '<a href="';
bloginfo('url');
echo '"><img src="';
bloginfo('stylesheet_directory');
//etc...
Ugly I know, but see answer by Nithesh for a possible alternative.
if you want to get the template path without auto echoing it by the bloginfo() function use:
get_bloginfo( 'stylesheet_directory', 'display' )

Categories