<div class="row" style="padding:0 0;">
<!-- left button -->
<div class="col-xs-3" style="margin:0;padding:0 0;">
<a href="#" style="float:right;" class="btn btn-success"
data-toggle="modal"
data-target="#classModal">New-<span class='glyphicon glyphicon-chevron-right' ></span></a>
</div>
<!-- class popup -->
<div class="col-xs-6" >
<form >
<select style="position:relative;horizontal-align:left;width:100%;border:1px solid Green;" class="form-control" id="sel1" name="classid" ONCHANGE="location = this.options[this.selectedIndex].value;">
<option value="">Select Class</option>
<@rows>
<option value="<@appfile>?_function=newstudent&_FUNCTIONfour=yes&rowid=<@COLUMN 'phdtools_classperiods.classperiods_rowid'>"
<@if "<@ARG rowid> = <@COLUMN 'phdtools_classperiods.classperiods_rowid'> ">selected </@if> >
<@comment></@comment>
<@COLUMN 'phdtools_classperiods.classperiods_name'></option>
</@rows>
</select>
</form>
</div>
<!-- right button -->
<div class="col-xs-3" style="left:-15px;">
<a href="#" id="classeditbutton" class="btn btn-success disabled"
data-toggle="modal"
data-target="#editclassModal"><span class='glyphicon glyphicon-chevron-left'>-Edit</span></a>
</div>
Here is the use of Jquery that doesn't work:
<script>
$(function() {
$('#sel1').change(function() {
$("#classeditbutton").toggleClass('disabled');
});
});
</script>
I've also tried prop. I think it was like this:
$("#classeditbutton").prop('disabled', false); This doesn't work either.
You will notice in the code directly above that the anchor button #classeditbutton is set to disabled. But I am not sure that this is even the right way either. Do you have any ideas about how to make this happen? Specifically, how to make a selection from a select and then as a result of the selection make a button clickable (enabled)?
Thanks for your help.