How to deal with PHP variables in javascript

Question

I have this query (Javascript) function that it's changed an input value every time I change the select menu. I bring the value from a php variable. (See the example). For every option in my select I insert a value from 1 to n like this:

$i = 0;
foreach($videos as $val)
{
    echo '<option value='.$i.'>'.$val->title.'</option>';
    $i++;
}

So the idea am I bringing the option value with JQuery and I want to use in a PHP expression that I use in Javascript and I want to know how put the javascript variable in PHP expression in this case (See my example PHP echo $videos [ii] ->title; Exactly this expression the ii it's a javascript variable and the rest is PHP)

$('select').change(function(){

    var i =  $( "#select option:selected" ).val();
    var ii = parseInt(i,10);

    $( "#titre" ).val("<?php echo $videos[ii]->title; ?>");

});

Thanks

Answer 1

Before you insert the variable into the jquery statement, create a new variable and give it the PHP value. (I haven't tried out your example, but I think you'll have more luck if you try it this way) var whatever = ""; Then insert whatever into your jquery. If you need to create javascript variables using php, construct a statement to write the javascript using PHP, write it to a javascript file and include it in the page.

Answer 2

In your example, strictly speaking, you are not using a PHP variable inside Javascript.

What you are doing is: You use PHP to output Javascript, and you use PHP variables in that output.

PHP is server side, the resulting output of HTML and Javascript (and anything else) will be transferred to the browser (client side), where it will be parsed/executed.

But: On client side, there is no PHP. You cannot just use Javascript variables in any PHP code you create on client side.

What you can do is: Use Javascript variables in a request to a server side (PHP) script, for which you can use standard form submit or Ajax like methods. In that case you will request the execution of a server side script using Javascript variables as request parameters. The output of the PHP script can then be used on the client side again ... either after page refresh or (when using Ajax) right on the same page you're currently on.

Answer 3

You can't send javascript values to php the way you describe. You can use ajax to send the javascript value to the server, evaluate it and get a response.

Another way is to add a data attribute somewher like this:

<div id="somediv" data-value="..." >

then

retrieve it using jQuery with

$('#somediv').attr('data-value') ;

or

  $('#somediv').data('value') ;

Answer 4

I'm not sure you're really understand when javascript and php are executed.

Because this line is really a non-sence :

$( "#titre" ).val("<?php echo $videos[ii]->title; ?>");

Javascript doesn't know php at all. On server side, php create a html file and where javascript is loaded after.

When javascript is executed on client side, there's no php anymore. Your browser doesn't execute php, it's the server which do this.

Then, if you want to execute a php script after the page loading, you have to use an ajax process. If I modify your code, it's more like :

$('select').change(function(){

    var i =  $( "#select option:selected" ).val();
    var ii = parseInt(i,10);

    $.ajax({
                        type: 'POST',
                        url: 'get_video_title.php',
                        data: {idVideo:ii},
                        dataType: 'json',
                        success: function (data) {
                            $("#titre").val(data);
                        }
                });

});

Answer 5

As the comments mention you cannot use javascript variables to manipulate php code. This is because by the time the javascript is running the page has already run through the php parser and passed to the browser.

There are 3 things you can do

1. Since you are just using the same data that you are using as the option text, set it as the value of the option as well and use the .val() to retrieve it, good if you do not need the other parts of $videos array
2. Have php echo out your data so that it will be interpreted by the javascript engine, good if you need to also access $videos data elsewhere in code
3. Do ajax request to the server to get the value you need (which in this particular case would be allot of requests to the server just to get a single piece of data on each request)

Change option value to reflect title text

echo '<option value='.$val->title.'>'.$val->title.'</option>';

js

$( "#titre" ).val($(this).val());

Dynamic javascript

<script>
   //output a json string which javascript will
   //then interpret as a object/array literal
   var data = <?php echo json_encode($videos);?>;

   //...   
   $('select').change(function(){
      var i =  $( "#select option:selected" ).val();
      var ii = parseInt(i,10);

      //use the data variable appropriately 
      $( "#titre" ).val(data[ii].title);
   });
</script>

Using ajax request

someScript.php

<?php
    $data = $_POST['somedata'];

    //some processing to get the appropriate return value
    //based on $data

   //if output is supposed to be an array/object
   echo json_encode($output);

   //or if it is supposed to be text etc
   echo $output;

JS

$('select').change(function(){
  var i =  $( "#select option:selected" ).val();
  var ii = parseInt(i,10);

  $.ajax({
     url:"someScript.php",
     type:"POST",
     data:{
        somedata:33
     }
     //can set datatype or remove and let jquery 
     //parse based on mime type 
     dataType:"text"
  }).success(function(data){
     //gonna assume data is just text
     $( "#titre" ).val(data);
  });
});

Answer 6

Using your code and using $( "#select option:selected" ).text() to get the title:

$('#select').change(function(){
    var i =  $( "#select option:selected" ).val();

    $( "#titre" ).text($( "#select option:selected" ).text());
});

JS Fiddle Demo

Answer 7

You can't use Javascript variables in PHP. They're totally different systems.