im trying to show a modal that will show textboxes with values from the table i displayed. im using this code to trigger the modal: $('#updatemodal').modal('show'); but it's not working.
this is the script for transferring the table contents to the modal and displaying the modal as well:
<script>
$(document).on('click','.edit_data',function(){
var awardee_id = $(this).attr("uawardeeid");
$.ajax({
url:"fetchawardees.php",
method:"POST",
data:{awardee_id:awardee_id},
dataType:"json",
success:function(data){
$('#updatemodal').modal('show');
$('#uawardeeid').val(data.awardee_id);
$('#uawardeename').val(data.awardee_name);
$('#uawardeeaddress').val(data.awardee_address);
$('#uawardeecontact').val(data.awardee_contact_info);
$('#uaward').val(data.award_id);
$('#ucategory').val(data.category_id);
$('#uregion').val(data.region_id);
$('#uprovince').val(data.province_id);
$('#uimage').val(data.awardee_img);
}
});
});
this is the code for the modal contents:
<form class="form-horizontal" id="updateform" name="updateform" action="phpawardee.php" method="POST" enctype="multipart/form-data">
<div class="modal fade in" tabindex="" role="dialog" aria-hidden="false" name="updatemodal" id="updatemodal">
<div class="modal-dialog modal-lg" >
<div class="modal-content" >
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Edit Awardee</h4>
</div>
<div class="modal-body">
<div class="panel-body">
<input id="uawardeeid" name="uawardeeid" type="text" class="form-control">
<fieldset>
<!-- Name input-->
<div class="form-group">
<label class="col-md-3 control-label" for="name">Awardee Name</label>
<div class="col-md-9">
<input id="uawardeename" name="uawardeename" type="text" placeholder="" class="form-control"></div>
</div>
<!-- Address body -->
<div class="form-group">
<label class="col-md-3 control-label" for="message">Address</label>
<div class="col-md-9">
<textarea class="form-control resize_vertical" id="uawardeeaddress" name="uawardeeaddress" placeholder="" rows="4"></textarea>
</div>
</div>
<!-- Contact info input-->
<div class="form-group">
<label class="col-md-3 control-label" for="name">Contact Info.</label>
<div class="col-md-9">
<input id="uawardeecontact" name="uawardeecontact" type="number" placeholder="" class="form-control" ></div>
</div>
<!-- Level of Award input-->
<div class="form-group">
<label class="col-md-3 control-label" for="email">Level of Award</label>
<div class="col-md-9">
<select id="uaward" name="uaward" class="form-control">
<option>Select</option>
<?php
$res=mysqli_query($db, "select * from tbl_award_level");
while($row=mysqli_fetch_array($res))
{
?>
<option value="<?php echo $row["award_id"]?>"><?php echo $row["award_name"]; ?></option>
<?php
}
?>
</select></div>
</div>
<!-- Store Category-->
<div class="form-group">
<label class="col-md-3 control-label" for="email">Store Category</label>
<div class="col-md-9">
<select id="ucategory" name="ucategory" class="form-control">
<option>Select</option>
<?php
$res=mysqli_query($db, "select * from tbl_store_category");
while($row=mysqli_fetch_array($res))
{
?>
<option value="<?php echo $row["category_id"]?>">
<?php echo $row["category_name"]; ?></option>
<?php
}
?>
</select></div>
</div>
<!--Region-->
<div class="form-group">
<label class="col-md-3 control-label">Region</label>
<div class="col-md-9">
<select id="uregion" name="uregion" class="form-control" onChange="change_region2()">
<option>Select</option>
<?php
$res=mysqli_query($db, "select * from tbl_region");
while($row=mysqli_fetch_array($res))
{
?>
<option value="<?php echo $row["region_id"]?>">
<?php echo $row["region_name"]; ?></option>
<?php
}
?>
</select></div>
</div>
<!-- Province-->
<div class="form-group">
<label class="col-md-3 control-label">Province</label>
<div class="col-md-9">
<select id="uprovince" name="uprovince" class="form-control">
<option>Select</option>
<option></option>
</select></div>
</div>
<!--File Upload-->
<div class="form-group">
<label class="col-md-3 control-label" for="name">Choose Photo</label>
<div class="col-md-9">
<div class="fileinput fileinput-new input-group" data-provides="fileinput">
<div class="form-control" data-trigger="fileinput" >
<i class="glyphicon glyphicon-file fileinput-exists"></i>
<span class="fileinput-filename"></span>
</div>
<span class="input-group-addon btn btn-default btn-file">
<span class="fileinput-new">Select file</span>
<span class="fileinput-exists">Change</span>
<input type="file" name="uimage" ></span>
<a href="#" class="input-group-addon btn btn-default fileinput-exists" data-dismiss="fileinput">Remove</a>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" data-dismiss="modal" class="btn btn-default">Close</button>
<button type="submit" class="btn btn-primary" id="updatebutton" name="updatebutton">Update</button>
</div>
<!-- Form actions -->
</fieldset>
</div>
</div>
</div>
</div>
</div>
</form>
and here is the code of the button i should click to show the modal:
<a name="edit" value="Edit" data-toggle="modal" id="<?php echo $awardee["awardee_id"]; ?>" class="btn btn-md btn-primary edit_data" >Edit</a>
