Hello I have a select box in which when one item is selected a update_option event fires and get's the selected item's value and echo's it on the page without having to reloading the page. I've put a simple example below of what I am trying to do. I read that I have to use AJAX but I have no idea how this works.

<form action="" method="post">
<select name="SelectItem" size='4'>
   <option>item1</option>
   <option>item2</option>
</select>
<input type="submit" name="submit" value="Submit">
</form>
<?php
if($_SERVER["REQUEST_METHOD"] == "POST"){
    if(!empty($_POST["SelectItem"])){
        update_option('SelectItem', $_POST["SelectItem"]);
    }
}
echo get_option('SelectItem');
?>

Hello I have a select box in which when one item is selected a update_option event fires and get's the selected item's value and echo's it on the page without having to reloading the page. I've put a simple example below of what I am trying to do. I read that I have to use AJAX but I have no idea how this works.

<form action="" method="post">
<select name="SelectItem" size='4'>
   <option>item1</option>
   <option>item2</option>
</select>
<input type="submit" name="submit" value="Submit">
</form>
<?php
if($_SERVER["REQUEST_METHOD"] == "POST"){
    if(!empty($_POST["SelectItem"])){
        update_option('SelectItem', $_POST["SelectItem"]);
    }
}
echo get_option('SelectItem');
?>

• php
• plugin-development
• ajax
• options

1 Answer 1

Hi mate this is a really good tutorial for using Ajax in WordPress. Everything you'll need for what you want is basically covered. https://premium.wpmudev/blog/using-ajax-with-wordpress/

Essentially Ajax is just a custom jquery function in your JavaScript file that listens for an action on the page. It fires to the server to run the php function you specify, and then returns data from the server.