4

I am using the impromptu jquery plugin. I have options to insert html under "html" option, but i need to populate an array of values that i get from php. Iam not able to insert it.

What i want is to populate a select box with values that are in php variable. I tried with:

JSFIDDLE

var statesdemo = {
    state0: {
        title: 'Terms of Use',
        html:'<table width="100%" border="0" cellpadding="3" cellspacing="1" bgcolor="#FFFFFF"><tr><td><strong>Data1</strong></td><td>:</td><td id=\'Data1\'>   <select name=\'Data1\' id=\'cart_wonid\' class=\'Data1\'><?php echo $options;?> </select></td></tr></table>',
        buttons: { Cancel: false, Agree: true },
        focus: 1,
        submit:function(e,v,m,f){
            if(v){
                e.preventDefault();
                $.prompt.goToState('state1', true);
                return false;
            }
            $.prompt.close();
        }
    },

Update 1:

1- Main idea is dropddown list inside the popup.
2- I want to get the dropdown list data from the mysql query that i wrote in the server side ( php ). So without this popup, the idea @tomloprod suggested works perfectly. Now coming back to the popup, i can add html contents like

 html : '< table > < /table > '  

But i want to insert the php variable inside it like

html : '< table > < ?php $myvariable ?> < /table >'
  • Iam getting error where i use the " " segment –  Dec 24 '14 at 14:01
  • what is the error? Don't ask two questions at once, one question at a time makes your question more useful to others – Ruan Mendes Dec 24 '14 at 15:02
  • @JuanMendes : When i insert the PHP i get the error "Uncaught SyntaxError: Unexpected number" . & the Update1 is the long description of the question , bot points to the same one. –  Dec 24 '14 at 15:05
  • 1
    Don't ever embed PHP variables directly in JavaScript strings, they will break the JavaScript if they contain a value that must be escaped, in your case, a `'`, but could be a newline, tab. Use `'< table >'+ < ?php echo json_encode($myvariable) ?> + '< /table >'` – Ruan Mendes Dec 24 '14 at 15:05
  • Now iam getting : **Uncaught SyntaxError: Unexpected token <** '''
    Project:
    Description:
    –  Dec 24 '14 at 15:11
  • The string you are showing is not using `json_encode` as I've recommended – Ruan Mendes Dec 24 '14 at 15:16

2 Answers2

3

METHOD 1: Use json_encode (recommended)

You can add a php array to a javascript array as follow:

var javascript_Array = <?php json_encode($php_Array); ?>;

METHOD 2: Put elements of php array into select directly

Try doing it directly with the array in PHP; I do not really see the need to pass it to JS...

<select name="data1" id="cart_wonid" class="Data1">
  <?php
     $len = count($options);
     for($c=0;$c<$len;$c++){
        echo '<option value="'.$options[$c].'">$options[$c]</option>';
     }
  ?>
</select>

METHOD 3: Put elements of javascript array into select

HTML:

<select name="data1" id="cart_wonid" class="Data1"> </select>

Javascript:

// Define the array
var javascript_Array = []; 

// Push elements
javascript_Array.push("Hi");
javascript_Array.push("Bye");

// Get the select with id cart_woneid
var sel = document.getElementById('cart_wonid');

// Fill the "select" with the elements of array
var i, len = javascript_Array.length;

for(i = 0; i < len; i++) {
    var opt = document.createElement('option');
    opt.innerHTML = javascript_Array[i];
    opt.value = javascript_Array[i];
    sel.appendChild(opt);
}

JSFiddle: http://jsfiddle.net/1dpud00v/

Community
  • 1
  • 1
tomloprod
  • 7,472
  • 6
  • 48
  • 66
  • ok.. then just add that variable inside the "html" will work? –  Dec 24 '14 at 14:03
  • but how shall i add that in the "html", i added the "javascript_Array", but its not working. iam getting an emptydropdown box –  Dec 24 '14 at 14:06
  • This code must be added to a "" block. After you can use the `javascript_Array` as you want. – tomloprod Dec 24 '14 at 14:06
  • JsFiddle can not use server-side code (PHP). You are not defining the array `$options`. Try in your own application, inside your hosting, please. Anyway, your jsfiddle is incorrect. I will edit my answer... – tomloprod Dec 24 '14 at 14:11
  • Sorry @tomloprod : iam showing only the necessary contents. I have declared the $options in my file. And all is working fine. But when i try to bring it on the html, it fails & says "Uncaught SyntaxError: Unexpected number" –  Dec 24 '14 at 14:16
  • Thanks @tomlprod Actually i need the dropdown, inside the popup. This make use of JS, so when i tried to fill it from the PHP variable its showing the error. problem is how can i bring the array values ( inside dropdown ) into the " html " of the impromptu popup. –  Dec 24 '14 at 14:30
  • I edited, again, my answer. I wrote a code which I think is what do you need. – tomloprod Dec 24 '14 at 14:34
  • Thanks again....@tomloprod : BUT the real problem lies when i populate the select box in the JS with the values from the PHP variable. **It is the popup which is not making the above method to work** Please tell whether i need to provide more data –  Dec 24 '14 at 14:40
  • @mastermind I dont understand you... Sorry, really. I'll try to help you more, but I hope other people try to help you too. May I see your website? – tomloprod Dec 24 '14 at 14:51
  • Thanks for the support. Iam running this under localhost only. –  Dec 24 '14 at 14:53
  • **1**- Main idea is dropddown list inside the popup. **2**- I want to get the dropdown list data from the mysql query that i wrote in the server side ( php ). So without this popup, the idea you suggested works perfectly. Now coming back to the popup, i can add html contents like 'html :
    '. But i want to insert the php variable inside it like **
    **.
    –  Dec 24 '14 at 14:54
  • A much more robust way (so that your JS string is properly encoded) is to use `var javascript_Array = ` – Ruan Mendes Dec 24 '14 at 15:04
  • @mastermind How is the jsfiddle supposed to know about your PHP variables? – Ruan Mendes Dec 24 '14 at 15:17
  • @tomloprod The answer added by the OP shows why what you have done is not good practice, -1 until you properly escape your PHP that is going to be used in JavaScript – Ruan Mendes Dec 24 '14 at 15:19
2

thank God... i got the answer... its the " json_encode($options) " does the work.... Thanks you stackoverflow and thanks for the support @tomloprod & Juan Mendes