Use PHP variables in Jquery

Question

Hi i have read this thread about using php variable in jquery but somehow it doesnt work on my site: LINK

Javascript:

<script>
var row_id="<?php echo $r['id']; ?>";

$(document).ready(function(){
  $("#que"+row_id).click(function(){
    $("#ans"+row_id).slideToggle();
  });
});


</script>
<?php foreach($res as $r) : ?>

    <li id="que<?php echo $r['id']; ?>">Q<?php echo $r['id']; ?>: <?php echo $r['question']; ?>          </li> 
    <div id="ans<?php echo $r['id']; ?>" style="padding:5px;">A: <?php echo $r['answer']; ?></div> 
<?php endforeach; ?>

"Doesn't work" is not a very good description of the problem, what exactly doesn't work, did you check the console for errors etc — adeneo, Jan 02 '14 at 07:32
As a sidenote, you do understand that the variables inside the loop are not available outside the loop, as you seem to think you can use those PHP variables anywhere ? — adeneo, Jan 02 '14 at 07:33
I am trying to make a FAQs section, that when people click the "question" the answer will slide down, with jquery toggle. — answerway, Jan 02 '14 at 07:35

score 7 · Answer 1 · answered Jan 02 '14 at 07:38

7

Just use classes. Otherwise you will end up having a jquery piece of code for each question.

<script>
$(document).ready(function(){
  $(".que").click(function(){
    $(this).next().slideToggle();
  });
});
</script>

<?php foreach($res as $r) : ?>
    <li class="que">Q<?php echo $r['id']; ?>: <?php echo $r['question']; ?></li> 
    <div style="padding:5px;">A: <?php echo $r['answer']; ?></div> 
<?php endforeach; ?>

FIDDLE

answered Jan 02 '14 at 07:38

Khawer Zeshan

9,470
6
40
63

holy crap you and i had the exact same answer I was not expecting that haha (not a hard one to figure out but some of these answers tonight have made me question the S.O. crowd lol) – Deryck Jan 02 '14 at 07:49
I hope we are not twins lol :D – Khawer Zeshan Jan 02 '14 at 07:50
why that would be freakin awesome hahaha – Deryck Jan 02 '14 at 07:51
Well because i already have one http://stackoverflow.com/users/860103/aamir-adnan :D Otherwise it will be a trio :D – Khawer Zeshan Jan 02 '14 at 07:52
My goodness yes that would be crazy. Cheers! – Deryck Jan 02 '14 at 07:55

score 2 · Answer 2 · answered Jan 02 '14 at 07:38

2

Script tag should be inside the forach loop.

Please try this and explain exact what error you got?

answered Jan 02 '14 at 07:38

Maulik patel

1,551
8
22
44

So you want his jQuery printed multiple times throughout the page? – Deryck Jan 02 '14 at 07:48
Never try to use such type of script in loop. – Maulik patel Jan 02 '14 at 07:49

score 0 · Answer 3 · answered Jan 02 '14 at 07:41

you wouldn't get this value var row_id="<?php echo $r['id']; ?>"; because $r['id'] is in the foreach.

I assume that you want to take the $r['id'], so try something like this

<script>
    $(document).ready(function(){
        $(".row").click(function(){
            var row_id = $(this).val();
            $("#ans"+row_id).slideToggle();
        });
    });

</script>

<?php foreach($res as $r) : ?>

    <li id="que<?php echo $r['id']; ?>">Q<?php echo $r['id']; ?>: <?php echo $r['question']; ?></li>
    <input type="hidden" value="<?php echo $r['id']; ?>" class="row" />
    <div id="ans<?php echo $r['id']; ?>" style="padding:5px;">A: <?php echo $r['answer']; ?></div>
<?php endforeach; ?>

score 0 · Answer 4 · answered Jan 02 '14 at 07:45

Use classes and .next() to solve this easily:

<script>

$(document).ready(function(){
  $('.que').click(function(){
    $(this).next('.ans').slideToggle();
  });
});


</script>
<?php foreach($res as $r) : ?>
    <li id="que<?php echo $r['id']; ?>" class="que">Q<?php echo $r['id']; ?>: <?php echo $r['question']; ?>          </li> 
    <div id="ans<?php echo $r['id']; ?>" class="ans" style="padding:5px;">A: <?php echo $r['answer']; ?></div> 
<?php endforeach; ?>

Mohan · Answer 5 · 2014-01-02T07:56:08.080

-1

I think you have used the undefined variable $r in javascript.

Which is only defined in the foreach loop. get the javascript into the loop it will work.

<script>
    function q_click(row_id){
        $("#ans"+row_id).slideToggle();
    }
 </script>
    <?php foreach($res as $r) : ?>

        <li id="que<?php echo $r['id']; ?>">Q<?php echo $r['id']; ?>: <?php echo $r['question']; ? onclick="q_click(<?php echo $r['id']; ?>)">          </li> 
        <div id="ans<?php echo $r['id']; ?>" style="padding:5px;">A: <?php echo $r['answer']; ?></div> 
    <?php endforeach; ?>

edited Jan 02 '14 at 07:56

answered Jan 02 '14 at 07:40

Mohan

143
10

I can't see `$r` anywhere in the javascript context in the asker's code. – John Dvorak Jan 02 '14 at 07:41
$r is as PHP variable which is used in javascript – Mohan Jan 02 '14 at 07:42
Concerning your code - I don't think it's a good idea to use a separate `$(document).ready(...)` call for each row in the table. Perhaps you should loop twice instead? (or just see [@Khawer's answer](http://stackoverflow.com/a/20878440/499214)) – John Dvorak Jan 02 '14 at 07:45
@JanDvorak any relation to John C. Dvorak? lol and for the author of this answer: This is very wasteful and inefficient code. Please reconsider – Deryck Jan 02 '14 at 07:48
This is not best to use but it should work. @khawer gives the best solution for this. – Mohan Jan 02 '14 at 07:48
@JanDvorak I have edited my answer and now it should work efficiently. – Mohan Jan 02 '14 at 07:58

Use PHP variables in Jquery

5 Answers5