How to pass JQuery variable to $_POST key in JQuery

Question

As i specified in the title, i am using JQuery for processing $_POST requests the sample code is:

<script type="text/javascript">
  $(document).ready(function(){
        var goal_type=[];

        goal_type[1]="<?php echo $_POST['goal_type1'];?>";
        goal_type[2]="<?php echo $_POST['goal_type2'];?>";
        goal_type[3]="<?php echo $_POST['goal_type3'];?>";
        goal_type[4]="<?php echo $_POST['goal_type4'];?>";
        goal_type[5]="<?php echo $_POST['goal_type5'];?>";
        goal_type[6]="<?php echo $_POST['goal_type6'];?>";
        goal_type[7]="<?php echo $_POST['goal_type7'];?>";
        goal_type[8]="<?php echo $_POST['goal_type8'];?>";
  });
</script>

And my requirement is:

<script type="text/javascript">
    $(document).ready(function(){
        var goal_type=[];

       for(var i=1;i<=8;i++)
       {
        var goals="goal_type"+i;
        goal_type="<?php echo $_POST["'+goals+'"]?>";
        console.log("Value is:"+goal_type);
       }      
});
</script>

But it prints blank on console. please acknowledge me how to i pass "goals"(JQUERY VARIABLE) into $_POST['']

Added an answer instead, as I initially missed you use an array variable — Asons, May 08 '18 at 06:31
Why do you use jQuery for this? loading jQuery for just a simple array is a bit too heavy in my opinion. — Dennis Spierenburg, May 08 '18 at 06:42
@DennisSpierenburg OP is not using jQuery to process the array, it use plain javascript. — Asons, May 08 '18 at 06:45
`var goals="goal_type"+i; goal_type="";` - this makes no sense whatsoever; and if you are not aware of that, then you need to go first of all inform yourself about how the technologies you are using basically work: https://stackoverflow.com/questions/25093905/when-and-where-does-javascript-run-how-about-php-can-i-combine-the-two — CBroe, May 08 '18 at 06:45
@CBroe The main issues here, which I described in my answer, none of that is mentioned in the link you provided. How does it relate to OP's question?... I mean, I can't see how they are trying to run PHP client side, just how to build an array with concat'd string/value. — Asons, May 08 '18 at 06:57
@LGSon `goals` is a JavaScript variable (containing value `goal_type1` etc. during the client-side for loop), and then they are trying to use that on the next line `` to try and access a certain entry inside $_POST. — CBroe, May 08 '18 at 07:01
@CBroe You might be right...for me that was so far off so I didn't see how it possibly could be that way :) — Asons, May 08 '18 at 07:10

Pejman · Answer 1 · 2018-05-08T06:42:00.183

I think the most simple way is using json_encode() like this:

<script type="text/javascript">
  $(document).ready(function(){
        var goal_type=<?= json_encode($_POST) ?>;
        console.log(goal_type); //look at your console
  });
</script>

then you may access them by exact same key of $_POST.

var someGoal = goal_type[1];

If you want to filter passed $_POST, then you have to create another array and pass desired keys of $_POST into that, and then you can print it as a json object into your JavaScript code.

 <?php 
    $filtered_post=[
        1=>$_POST['some_key'],
        2=>$_POST['another_key'],
        //...,
    ];
 ?>
 <script type="text/javascript">
   $(document).ready(function(){
         var goal_type=<?= json_encode($filtered_post) ?>;
         console.log(goal_type); //look at your console
   });
 </script>

score 0 · Answer 2 · answered May 08 '18 at 07:06

It's just your syntax error.

goal_type="<?php echo $_POST["'+goals+'"]?>";

It will returns nothing because there's no $_POST value with key '+goals+' therefore goal_type is just empty.

Try this:

<script type="text/javascript">
    $(document).ready(function(){
        var goal_type=[];

        <?php for($i=1; $i<=8; $i++) : ?>
            goal_type[<?php echo $i; ?>] = "<?php echo $_POST['goal_type'.$i]; ?>";
            console.log("Value is: " + goal_type[<?php echo $i; ?>]);
        <?php endfor; ?>
    });
</script>

How to pass JQuery variable to $_POST key in JQuery

2 Answers2