Lewey Jimoya Lewey Jimoya - 2 months ago 16
HTML Question

How to pass <select> html data in bootstrap modal to jquery

I'm trying to figure out how to pass the selected value from this tag that is located in a modal:

<div class='row'>
<div class='col-md-8'>
<form class='form-inline'>
<select class='form-control' name='sel1' id='sel1'>

<div class='col-md-4' align='right'>
<input style='display: block; width: 100%;' type='button' class='btn btn-success' value='Enter Grade' onclick='enterGrade($offeringno)'' />

Here is my jquery code:

function enterGrade(offering) {
var enteredgrade = $("#myModal3 #sel1").val();
var gradeoffering = offering;
alertify.confirm("Enter grade?", function (e)
{ if (e) {
url : "action.php",
type : "POST",
data : {
gradeofferingPost : gradeoffering,
enteredgrade1: enteredgrade
success : function(data) {
} else {
txt = "You pressed Cancel!";
} });

What is the correct syntax to get the selected option from the
select (that is inside a modal) to the javascript function?


You are trying to access value of element that does not have a value. What you are looking for is .text(). If you want to get currently selected text of the option you should replace this:

var enteredgrade = $("#myModal3 #sel1").val();

with this:

var enteredgrade = $('#sel1 :selected').text();

If you are interested in .val() then you must replace


with this:

<option value="1.00">1.00</option>
<option value="1.25">1.25</option>