How to echo php array in javascript?

Question

I have an php array that is generated by server-side code. I want to show the array value in my input field after user pick an option from my dropdown menu. Please see my code:

$(document).ready(function(){
$('select[name="job_number"]').change (function () {
    var selectedVal = $(this).val();
    var test="<?php echo $JNarray['selectedVal'];?>"; //where the problem is
    $('input[name="project"]').val(test);  
//I want show value1 to value 3 in my input field when user picks 
//an option from my dropdown menu. 

});

<?php 
   $JNarray['job1']=value1;
   $JNarray['job2']=value2;
   $JNarray['job3']=value3;
?>

<form action='project_manager' method='post'>
<input type='text' name='project' value='show value1 to value3 when user picks an option' />
<select name='job_number'>
<option value='job1'>job1</option>
<option value='job2'>job2</option>
<option value='job3'>job3</option>
</select>

</form>

Any thoughts? Thanks for the help!

what is the actual error / problem? You never mention it.

Jakub
– Jakub

2012-03-06 02:06:20 +00:00
Commented Mar 6, 2012 at 2:06 — Jakub
– Jakub, Commented Mar 6, 2012 at 2:06

charlietfl · Accepted Answer · 2012-03-06 02:07:50Z

2

Here's a cleaner way to do it without having to set the array to a variable. Use a data attribute that jQuery reads with $.data()

HTML:

  <option value='job1' data-job-val="<? echo $arrayvalue ?>">job1</option>

JS:

$('select[name="job_number"]').change (function () {
    var test=$(this).find('option:selected').data('job-val');
    $('input[name="project"]').val(test);
});

answered Mar 6, 2012 at 2:07

charlietfl

172k14 gold badges125 silver badges154 bronze badges

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

2 Comments

FlyingCat Over a year ago

Thanks a lot! I like your answer. Learn something new everyday.

charlietfl Over a year ago

if you take a look at jQuery mobile...the whole framework is driven by a wide variety of these data attributes for everything from themeing to page delineation

uadnal · Accepted Answer · 2012-03-06 01:49:16Z

1

Though, I don't recommened echoing php in js...

var test=JSON.parse(<?php echo json_encode($JNarray['selectedVal']);?>); //where the problem is

answered Mar 6, 2012 at 1:49

uadnal

11.5k2 gold badges35 silver badges40 bronze badges

2 Comments

FlyingCat Over a year ago

I got an error saying undefined variable $JNarry. Is it because javascript attempts to get the array that was created by php before the page was generated? +1 though.

uadnal Over a year ago

Javascript should have no knowledge of $JNarray

mpm · Accepted Answer · 2012-03-06 01:54:17Z

1

<select name='job_number'>
<option value='<?php echo $JNarray['job1'] ?>'>job1</option>
...
...
</select>

<script>
$(document).ready(function(){
$('select[name="job_number"]').change (function () {
    $('input[name="project"]').val($(this).val()); 
});
</script>

something like that.

answered Mar 6, 2012 at 1:54

mpm

20.2k7 gold badges52 silver badges56 bronze badges

1 Comment

FlyingCat Over a year ago

I like your way. Thanks a lot! +1

bfavaretto · Accepted Answer · 2012-03-06 02:12:07Z

1

You have to declare and populate your array before you use it on the jquery code. Move your <?php ?> code to the top.

Then pass the whole php array to javascript, using JSON as Trevor suggested:

$(document).ready(function(){
    var options = JSON.parse(<?php echo json_encode($JNarray);?>);
    $('select[name="job_number"]').change (function () {
        var selectedVal = $(this).val();
        var test=options[selectedVal]; //where the problem was
        $('input[name="project"]').val(test);  
    });
});

answered Mar 6, 2012 at 2:12

bfavaretto

72k18 gold badges118 silver badges162 bronze badges

Comments

Philip · Accepted Answer · 2012-03-06 02:03:12Z

0

I agree with Trevor, however try

"<?php echo $JNarray['"+selectedVal+"'];?>"

Echoing PHP means your calling your JS from a PHP file, not a good approach dude!, The only thing I would pass is maybe a BASE_URL or FILE_UPLOAD_TYPE/SIZE, even those are ewwwwwwwy

answered Mar 6, 2012 at 2:03

Philip

4,5822 gold badges22 silver badges28 bronze badges

Collectives™ on Stack Overflow

How to echo php array in javascript?

5 Answers 5

2 Comments

2 Comments

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

2 Comments

2 Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related