I load the options for my select from a database (which loads the options) and am trying to run a script when the selected option changes (which doesn't run) the script is below
<script>
$(function()
{
function subrace()
{
var race = $("#race").val();
console.log(race + "!");
}
$("#race")
.selectmenu()
.selectmenu(
{
change: subrace()
})
.selectmenu("menuWidget")
.addClass("overflow");
});
</script>
<select name="race" id="race">
<?php
$dbhost = "localhost";
$dbuser = "DanD_user";
$dbpass = "****************";
$dbname = "dand_user";
$mysqli = new mysqli($dbhost, $dbuser, $dbpass, $dbname);
$query = "SELECT * FROM races ORDER BY name ASC";
$result = mysqli_query($mysqli, $query);
$x = 0;
while($row = $result->fetch_array(MYSQLI_BOTH))
{
echo" <option value=\"" . $row['name'] . "\">" . $row['name'] . "</option>
";
$x++;
}
if($x === 0)
{
echo"<option disabled selected>No Races Available</option>";
}
?>
</select>
The script is in the head element and once I get the script to run I'll be adjusting it the console is just a peice to see if it runs
Through working on my code further I discovered that the answer is that I can't just lay out the function I want to run in the situation I need to enclose it in another function
<script>
$(function()
{
function subrace()
{
var race = $("#race").val();
console.log(race + "!");
}
$("#race")
.selectmenu()
.selectmenu(
{
change: function( event, ui )
{
subrace();
}
})
.selectmenu("menuWidget")
.addClass("overflow");
});
</script>
<select name="race" id="race">
<?php
$dbhost = "localhost";
$dbuser = "DanD_user";
$dbpass = "****************";
$dbname = "dand_user";
$mysqli = new mysqli($dbhost, $dbuser, $dbpass, $dbname);
$query = "SELECT * FROM races ORDER BY name ASC";
$result = mysqli_query($mysqli, $query);
$x = 0;
while($row = $result->fetch_array(MYSQLI_BOTH))
{
echo" <option value=\"" . $row['name'] . "\">" . $row['name'] . "</option>
";
$x++;
}
if($x === 0)
{
echo"<option disabled selected>No Races Available</option>";
}
?>
</select>