I have 2 dropdown outside the html table generated by PHP code. I have submit button in this table
as explained by following code.
<!doctype html>
Select Year:
<select name=\"year\" id=\"year\" style="width: 200px">
<option value=\"2014\">2014</option>
<option value=\"2015\">2015</option>
</select>
Select Trimester:
<select name=\"trimester\" id=\"trimester\" style="width: 200px">
<option value=\"1st\">1st</option>
<option value=\"2nd\">2nd</option>
<option value=\"3rd\">3rd</option>
</select>
<?php
while($row = mysql_fetch_array($result)){
$ict_id= $row['id'];
$name= $row['name'];
echo "<tr><form name=\"form$id\" id=\"form$id\"><td>".$name."</td>
<td>
<select name=\"absent$id\" id=\"absent$id\" style=\"width: 200px\">
<option value=\"1\">1</option>
<option value=\"2\">2</option>
</select>
</td>
<td>
<select name=\"creative$id\" id=\"creative$id\" style=\"width: 200px\">
<option value=\"1\">1</option>
<option value=\"2\">2</option>
</select>
</td>
<td>
<select name=\"problem$id\" id=\"problem$id\" style=\"width: 200px\">
<option value=\"1\">1</option>
<option value=\"2\">2</option>
</select>
</td>
<td>
<input type=\"button\" name=\"submit$id\" id=\"submit$id\" value=\"Submit\" onclick=\"getVal(this.id)\">
?>
On clicking this button it loads following javascript function.
function getVal(clicked_id){
}
My problem is how can I get the selected value of year and trimester and use inside the getVal function .
Any helps are weled.
I have 2 dropdown outside the html table generated by PHP code. I have submit button in this table
as explained by following code.
<!doctype html>
Select Year:
<select name=\"year\" id=\"year\" style="width: 200px">
<option value=\"2014\">2014</option>
<option value=\"2015\">2015</option>
</select>
Select Trimester:
<select name=\"trimester\" id=\"trimester\" style="width: 200px">
<option value=\"1st\">1st</option>
<option value=\"2nd\">2nd</option>
<option value=\"3rd\">3rd</option>
</select>
<?php
while($row = mysql_fetch_array($result)){
$ict_id= $row['id'];
$name= $row['name'];
echo "<tr><form name=\"form$id\" id=\"form$id\"><td>".$name."</td>
<td>
<select name=\"absent$id\" id=\"absent$id\" style=\"width: 200px\">
<option value=\"1\">1</option>
<option value=\"2\">2</option>
</select>
</td>
<td>
<select name=\"creative$id\" id=\"creative$id\" style=\"width: 200px\">
<option value=\"1\">1</option>
<option value=\"2\">2</option>
</select>
</td>
<td>
<select name=\"problem$id\" id=\"problem$id\" style=\"width: 200px\">
<option value=\"1\">1</option>
<option value=\"2\">2</option>
</select>
</td>
<td>
<input type=\"button\" name=\"submit$id\" id=\"submit$id\" value=\"Submit\" onclick=\"getVal(this.id)\">
?>
On clicking this button it loads following javascript function.
function getVal(clicked_id){
}
My problem is how can I get the selected value of year and trimester and use inside the getVal function .
Any helps are weled.
Share Improve this question asked Nov 14, 2014 at 5:01 stackuserstackuser 933 silver badges13 bronze badges5 Answers
Reset to default 2To get the selected Text of Id year and trimester
function getVal(clicked_id){
$('#year :selected').text();
$('#trimester :selected').text();
}
To get the selected Value
function getVal(clicked_id){
$('#year').val();
$('#trimester').val();
}
Use jquery val function
function getVal(){
$('#year').val();
$('#trimester').val();
}
If you are using JQuery, you can fetch it like
function getVal(){
var ddlYear= $('#year').val();
var ddlTrimester= $('#trimester').val();
}
See as you are GETTING value You need to return data , its logical thing.Not to just store in variable.
function getValYear(){
return $('#year').val();
}
function getValTrimester(){
return $('#trimester').val();
}
I saw your other question about getting UI elements into table cells before you deleted it. It seemed like an extension of this question, so I figured I'd post it here. I was thinking you may want to consider moving the select boxes and ui elements visually into the table cells.
Here's the jsfiddle I made before you removed your question and figured you may want to see it. Seems somewhat relevant to what you're asking here, if only a few steps further along in development...
$("select").addClass("hidden");
$("#abc-td").on("click focus", function (){
var $offset = $(this).offset();
var $top = $offset.top - 9,
$left = $offset.left - 9,
$height = $(this).outerHeight(),
$width = $(this).outerWidth();
$("#abc").css({
position: "absolute",
top: $top,
left: $left,
height: $height,
width: $width
}).removeClass("hidden").focus();
});