Issue with getting value of selected option PHP

Question

I have the following snippet from HTML:

<div id="result" class = "hide">
        <select id = "selectIngredients">
          <option>Choose a recipe</option>
          <option value="Carrot">Carrot</option>
          <option value="Cabbage">Cabbage</option>
          <option value="Broccoli">Broccoli</option>
        </select>
        <button class="btn" onClick="viewRecipe()"> View Recipe</button>
      </div>

I am trying to use some PHP to get the value chosen when the button is clicked. Is this possible without having it in a form?

When I do the following it isn't working.

                $selected_val = $_POST['selectIngredients'];  // Storing Selected Value In Variable
                echo "You have selected :" .$selected_val;  // Displaying Selected Value
                }

I want to use this value to go into a string I'm using in PHP so would this work with jquery? Example: ``` $newString = "StringOne".$selected_val."StringTwo";``` — Shauna, Feb 28 '20 at 22:06
@beingprabhu its just a function which is showing a recipe which works fine. — Shauna, Feb 28 '20 at 22:13
To display the selected option from the select box you can use the JS on change event. — BEingprabhU, Feb 28 '20 at 22:14
@beingprabhu How would this value then be used to be in the php string? — Shauna, Feb 28 '20 at 22:16
What do you mean by PHP string?? Do you want to post it to server or just to display it in current page?? — BEingprabhU, Feb 28 '20 at 22:17
[this](https://stackoverflow.com/questions/9789283/how-to-get-javascript-variable-value-in-php) might help — jibsteroos, Feb 28 '20 at 22:24
@beingprabhu The php string is going to be a URL which is getting data from an API and sending it to a mySQL database. As far as I'm aware this can't be done with JavaScript. — Shauna, Feb 28 '20 at 22:25
If you don't have a form, you can use AJAX to send the selected option to PHP. — Barmar, Feb 28 '20 at 23:15

score 0 · Answer 1 · answered Feb 29 '20 at 06:24

You can't use $_POST without using form, and if you don't want to use form you can achieve by javascript check below code it will help you.

<script>
function viewRecipe(el)
{
    var e = document.getElementById(el);
    var strSel = e.options[e.selectedIndex].text;
    alert(strSel);
}
</script>

<div id="result" class = "hide">
     <select id = "selectIngredients">
        <option>Choose a recipe</option>
          <option value="Carrot">Carrot</option>
          <option value="Cabbage">Cabbage</option>
          <option value="Broccoli">Broccoli</option>
    </select>

    <button onClick="viewRecipe('selectIngredients');">Get Selected Item</button>
</div>

I want to get the selected value but then I want to assign it to a PHP variable to have it be in a request to an API with a URL in PHP — Shauna, Feb 29 '20 at 11:28

score 0 · Answer 2 · answered Feb 29 '20 at 07:31

You cannot send a post request without a form in html but you can do it in javascript/ajax.

here is $_POST example:

    function viewRecipe(){
      var e = document.getElementById('selectIngredients');
      var strSel = e.options[e.selectedIndex].text;
      var req = new XMLHttpRequest();
      req.open('POST', "pageName.php", true);
      req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
      req.send('selectIngredients='+strSel);
      req.onload = function() {
      var res=req.response;
      alert(res);
    }
}

PHP code:

if(isset($_POST['selectIngredients'])){
  $selected_val = $_POST['selectIngredients'];
  echo "You have selected :" .$selected_val;
}

if you are sending request to same page here is $_GET Method example.

function viewRecipe(){
  var e = document.getElementById('selectIngredients');
  var strSel = e.options[e.selectedIndex].text;
  window.location.href = window.location.pathname+"?selectIngredients="+strSel;
  }

Let me know if you face any error. :D

Issue with getting value of selected option PHP

2 Answers2