How to pass a php variable value in jquery selector?

Question

I want to highlight that portion of a mapped image whose id is retrieved from mysql database. I have stored the id in $loc variable. Now using jquery selectors I want to pass this php variable in my jquery selector so that it will highlight the portion of image having the same id as in $loc. Here is my working code:

    <script type="text/javascript" src="jquery.js"></script>
 <script type="text/javascript" src="jquery.maphilight.js"></script>
<script type="text/javascript">
 $(function () {
        $(".mapping").maphilight();


    $(".hoverable").css("border", "3px solid red");


    var data = $('#cr2').data('maphilight') || {};  
    data.alwaysOn = !data.alwaysOn;
    $('#cr1').data('maphilight', data).trigger('alwaysOn.maphilight'); // portion to always highlight (I WANT TO PASS THE PHP VARIABLE $LOC INSTEAD OF '#CR1'

});<area shape="poly" id="cr1" class="room" coords="549,272,489,334,534,377,594,316" href="www.msn.com" target="_top" alt="CR1" name="room-1">

I want to pass the value of $loc (php variable) into jquery selector in place of '#cr1'. In the second last line ! Please help — Faizan
– Faizan, Commented Dec 17, 2012 at 13:08
Why can't you simply change $('#cr1') to be $('#<?php echo $loc; ?>') ? — Matt
– Matt, Commented Dec 17, 2012 at 13:09
Oh thanks alot it works, I am actually new to jquery , haven't thought that I can pass php code inside script tag ... — Faizan
– Faizan, Commented Dec 17, 2012 at 13:12

Viral Patel · Accepted Answer · 2012-12-17 13:11:32Z

5

Replace #cr1 with #<?php echo $loc ?>

Instead of:

$('#cr1').data('maphilight', data).trigger('alwaysOn.maphilight');

Use:

$('#<?php echo $loc ?>').data('maphilight', data).trigger('alwaysOn.maphilight');

answered Dec 17, 2012 at 13:11

Viral Patel

8,6093 gold badges34 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Matt Over a year ago

You probably also need the # in the selector.

Faizan Over a year ago

@Matt I am following you on Twitter

Matt · Accepted Answer · 2012-12-17 13:13:55Z

-1

You can use json_encode function and pass the php variable $loc as a parameter

For example

var data = <?php echo json_encode($loc); ?>;

jQuery.each(data, function(i,event) {
   // alert(event.toSource());
   var id = event.id;  // here id is the array of the value based on the php variable for $loc
   badge_name = event.name; // here name is the array of the value based on the php variable for $loc
});

edited Dec 17, 2012 at 13:13

Matt

75.4k26 gold badges156 silver badges181 bronze badges

answered Dec 17, 2012 at 13:11

somasundaram

1394 bronze badges

1 Comment

Faizan Over a year ago

I got it working , just by echoing the php variable inside jquery selector. Why go for a long code when it can be done in a short code :) @Matt

Collectives™ on Stack Overflow

How to pass a php variable value in jquery selector?

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related