Flow of data from PHP file, to JavaScript, then back to PHP

Question

I have a php file with a wordpress shortcode, and when this shortcode is placed on a webpage, it correctly calls a php function from within the php file.

The function, when called, runs an SQL query to find data.

All straight forward so far.

This data (stored in a php array) from the resulting mysql query is then converted to a JS array via JSON which is then used to populate a drop-down list, which is displayed on the webpage using an EOD tag to display the JavaScript drop-down list.

Still all good so far.

I have then programmed in JavaScript, a second drop down list which is dynamically created from the selection made by the user in the first drop-down list. Again within the EOD tag in the same PHP file.

Now comes the bit I don't get.

My question is (and I've been stuck all day long with this issue) how do I then program the return of the selected item (from the second drop-down) back to a PHP variable for further processing?

It seems that to do this all in one PHP file is not possible as although I would need to use Ajax to pass the JS drop-down selection back to the php file, the php file would have already been executed and therefore would not notice the return.

My question therefore is, what is my next step?

Ultimately I want a php file to be able to receive the selected item from the second JS drop-down, so that it can do further processing on that returned data. How do I get a second PHP file to be called into action the moment the second drop-down item is selected by the user of the webpage and how do I get this new PHP file to receive the selected drop-down item?

Edit*******

Here is my code although the most important element is right at the end. I am trying to pass JS variable 'chosenStudent' back to the PHP file.

            $Content3 = <<<EOD

            <form id="myGroupSelectForm" method="post">
              <select id="selectGroup">
                <option>Choose a Group</option>
              </select>
                <select id="selectStudent">
                <option>Choose a Student</option>
              </select>
            </form>

            <script type="text/javascript">

            var select = document.getElementById("selectGroup"); 
            var options = {$js_array_leadersGroupsName}; 
            var i;

            for(i = 0; i < options.length; i++) {
                var opt = options[i];
                var el = document.createElement("option");
                el.textContent = opt;
                el.value = opt;
                select.appendChild(el);
            }

            </script>

            <script>

            var studentList = {$js_array_students_lists}; 
            var select2 = document.getElementById("selectStudent");

            var a = document.getElementById('selectGroup');
            a.addEventListener('change', function() {

                var i;
                for(i = 0; i < options.length; i++) {
                        if ((this.value) == options[i]) {
                            var chosenStudentList = studentList[i];
                        }
                    }

                var select = document.getElementById("selectStudent");
                var length = select.options.length;
                for (i = length-1; i >= 0; i--) {
                  select.options[i] = null;
                }

                var i;
                for(i = 0; i < chosenStudentList.length; i++) {
                    var opt = chosenStudentList[i][0];
                    var el = document.createElement("option");
                    el.textContent = opt;
                    el.value = opt;
                    select2.appendChild(el);
                }

                }, false);

                var b = document.getElementById('selectStudent');
                b.addEventListener('change', function() {
                    var chosenSudent = this.value;
                    $.post('WickCustomLD.php', {variable: chosenSudent});
                    }, false);

            </script>



EOD;


            $Content3 .="\n";
            if(!empty($_POST['variable'])) {
               $chosenStudent = $_POST['variable'];
               echo "<br>";
               echo "<br>";
               echo "<br>";
               echo "<br>";
               echo $chosenStudent;
            }

            return $Content3;

Try using AJAX, thats the only way you can send data from homepage back to server. Maybe I am wrong but I think that is possible with Vue.js, React or Angular? — Jon Nezbit
– Jon Nezbit, Commented Jun 12, 2020 at 23:10
"the php file would have already been executed", PHP files can be executed multiple times and you can call multiple PHP files. Create new one especially for this function or reuse old one. Is this helpful? — Jon Nezbit
– Jon Nezbit, Commented Jun 12, 2020 at 23:12
"the php file would have already been executed and therefore would not notice the return" That's irrelevant. Every request executes the script separately. — gre_gor
– gre_gor, Commented Jun 12, 2020 at 23:13
Cool, so how do I get the same PHP file to react to the user's selection? — sw123456
– sw123456, Commented Jun 12, 2020 at 23:14
You've answered the question yourself while asking - you need Ajax. (Which absolutely does not require any JavaScript framework, contrary to a previous comment.) This discussion may be helpful to you in understanding what happens. — Robin Zigmond
– Robin Zigmond, Commented Jun 12, 2020 at 23:14

Éder Rocha · Accepted Answer · 2020-06-13 01:39:59Z

1

Try change this

$.post('WickCustomLD.php', {variable: chosenSudent});

by this

$.post("NewFile.php", {variable: chosenSudent}, function(data){ 
   alert(data);
   //data contains the echoed value from php
});

Create NewFile.php

<?php
if(isset($_POST['variable'])){
   //manipulate and return value
   echo "Value is ".$_POST['variable'];
}
else
   echo 'error';
?>

answered Jun 13, 2020 at 1:39

Éder Rocha

1,57814 silver badges33 bronze badges

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

Collectives™ on Stack Overflow

Flow of data from PHP file, to JavaScript, then back to PHP

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related