Getting php array dynamically in javascript

Question

With the following code I try to add a new div-element with jQuery.

$(document).ready(function () {
  var languages = <?php echo json_encode($languages); ?>;
  var div       = '';
    $.each(languages, function (key, value) {
      div  = '<div class="main bg_notice" style="padding:3px; line-height:20px;">';
      div += '  <img src="/lang/' + value['directory'] + '/admin/images/' + value['image'] + '" alt="' + value['name'] + '" title="' + value['name'] + '" style="border:0;">';
      div += '  <b><?php echo TEXT_MASK_ALIAS; ?></b>';
      div += '  <input type="text" name="mask_alias[' + value['id'] + ']" value="" style="width:80%" maxlength="255">';
      div += '</div>';
      $('[name="categories_name[' + value['id'] + ']').closest('div').after(div);
    });
});

The value for the input field is created dynamically in PHP

echo (isset($mask_alias[$languages[$i]['id']]) ? stripslashes($mask_alias[$languages[$i]['id']]) : $categories_desc_fields['mask_alias']);

How do I get this into javascript writing style.

$languages[$i]['id']

is equivalent to

+ value['id'] +

in javascript.

The result should look like this non working code

div += '  <input type="text" name="mask_alias[' + value['id'] + ']" value="<?php echo (isset($mask_alias[$languages[$i]['id']]) ? stripslashes($mask_alias[$languages[$i]['id']]) : $categories_desc_fields['mask_alias']); ?>" style="width:80%" maxlength="255">';

Since you're doing this in document.ready, it's worth pointing out that you could probably do this with only php, and not have to worry about echoing php variables to be read by javascript. — James
– James, Commented Dec 22, 2017 at 19:49
It might just be me but I am really having a hard time understanding what it is you're asking for, could you elaborate? — zfrisch
– zfrisch, Commented Dec 22, 2017 at 19:50
I've added the codeline which I like to change to javascript syntax. — Modulfux
– Modulfux, Commented Dec 22, 2017 at 19:54
Post (some of) the content of <?php echo json_encode($languages); ?> please. — James
– James, Commented Dec 22, 2017 at 20:00
var languages is 0: Object { id: "2", name: "Deutsch", code: "de", … } 1: Object { id: "1", name: "English", code: "en", … } — Modulfux
– Modulfux, Commented Dec 22, 2017 at 20:03

Zgoo · Accepted Answer · 2017-12-22 19:54:31Z

1

var languages = JSON.parse(<?php echo json_encode($languages); ?>)'

answered Dec 22, 2017 at 19:54

Zgoo

402 bronze badges

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

1 Comment

Zerquix18 Over a year ago

var languages = <?php echo json_encode($languages); ?>; is shorter.

James · Accepted Answer · 2017-12-22 20:34:08Z

0

You should do part of this in php and part of this in javascript.

I suggest that in PHP, you create a new array based on languages that will be handed to javascript, where all the php-level calculations have been already done.

For example

// php code
// you already have $languages defined
$jsLanguages = array_map(function ($key, $lang) {
  $lang['mask'] = isset($mask_alias[$lang['id']]) ? stripslashes($mask_alias[$lang['id']]) : $categories_desc_fields['mask_alias'];
  $lang['imageURL'] = "/lang/{$lang['directory']}/admin/images/{$lang['image']}";
  return $lang;
}, $languages);

then

$(document).ready(function () {
  var languages = <?php echo json_encode($jsLanguages); ?>;
  var div       = '';
    $.each(languages, function (key, lang) {
      div  = '<div class="main bg_notice" style="padding:3px; line-height:20px;">';
      div += '  <img src="' + lang.imageURL + '" title="' + lang.name + '" style="border:0;">';
      div += '  <b><?php echo TEXT_MASK_ALIAS; ?></b>';
      div += '  <input type="text" name="mask_alias[' + lang.id + ']" value="' + lang.mask + '" style="width:80%" maxlength="255">';
      div += '</div>';
      $('[name="categories_name[' + lang.id + ']"').closest('div').after(div);
    });
});

answered Dec 22, 2017 at 20:34

James

22.4k5 gold badges29 silver badges44 bronze badges

4 Comments

Modulfux Over a year ago

The php part causes an error to another javascript loaded by the shopsystem

James Over a year ago

I always forget "use" - that change might work. If it produces an error, what's the error?

Modulfux Over a year ago

When I use your php-code (even in the original file from the shopsystem) it causes an error TypeError: a is undefined in ckeditor.js

Modulfux Over a year ago

If I change function (key, lang) to function (lang) it seems to work

user9129281 · Accepted Answer · 2017-12-22 20:22:45Z

0

I suspect languages is a string in json format rather than an actual object.

Try using JSON.parse to convert the string to an object.

var languages = JSON.parse(<?php echo json_encode($languages); ?>);

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse

The JSON.parse() method parses a JSON string, constructing the JavaScript value or object described by the string.

answered Dec 22, 2017 at 20:22

user9129281

Collectives™ on Stack Overflow

Getting php array dynamically in javascript

3 Answers 3

1 Comment

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related