我想用特定的行和列编辑表格中的数据（例如：第1行第2列）。 单击该特定数据后，我想显示我的模态弹出窗口，其中显示了一些按钮。如果用户单击该按钮之一，则该值将保存在该特定行上。
例：
用户单击特定单元格（示例单元格A2）后，将显示包含按钮的模态（按钮示例：M6）。如果用户点击“M6”按钮，该值将显示在表＆amp;保存在数据库中（M6将保存在单元格A2中）。知道了吗？
以下是代码：
<section class="content container-fluid">
<!-- TABLE: LATEST ORDERS -->
<div class="box box-info">
<div class="box-header with-border">
<select onChange="document.location.href=this.options[this.selectedIndex].value;">
<option selected disabled>-- Pilih Bulan --</option>
<option value="<?php echo site_url('hrdpublicarea/edit_absen/jadwal_januari');?>">Januari</option>
<option value="<?php echo site_url('hrdpublicarea/edit_absen/jadwal_februari');?>">Februari</option>
</select>
<h3 style="text-align: center; margin-top: -25px;"><?php echo $this->uri->segment('3');;?></h3>
</div>
<!-- /.box-header -->
<div class="box-body">
<div class="table-responsive">
<table class="tabel" border="1" style="text-align: center; cursor: pointer;">
<thead>
<tr>
<td width="40px">No</td>
<td width="100px">Nama</td>
<td width="120px">Section</td>
<td width="40px">1</td>
<td width="40px">2</td>
<td width="40px">3</td>
<td width="40px">4</td>
<td width="40px">5</td>
<td width="40px">6</td>
<td width="40px">7</td>
<td width="40px">8</td>
<td width="40px">9</td>
<td width="40px">10</td>
<td width="40px">11</td>
<td width="40px">12</td>
<td width="40px">13</td>
<td width="40px">14</td>
<td width="40px">15</td>
<td width="40px">16</td>
<td width="40px">17</td>
<td width="40px">18</td>
<td width="40px">19</td>
<td width="40px">20</td>
<td width="40px">21</td>
<td width="40px">22</td>
<td width="40px">23</td>
<td width="40px">24</td>
<td width="40px">25</td>
<td width="40px">26</td>
<td width="40px">27</td>
<td width="40px">28</td>
<td width="40px">29</td>
<td width="40px">30</td>
<td width="40px">31</td>
</tr>
</thead>
<?php $no=0; foreach($absen as $row):$no++?>
<tr>
<td ><?php echo $no ?></td>
<td><?php echo $row['nama']; ?></td>
<td><?php echo $row['section']; ?></td>
<?php
if ($this->uri->segment('3')=='jadwal_januari' OR $this->uri->segment('3')=='jadwal_maret'
OR $this->uri->segment('3')=='jadwal_mei' OR $this->uri->segment('3')=='jadwal_agustus'
OR $this->uri->segment('3')=='jadwal_juli' OR $this->uri->segment('3')=='jadwal_oktober'
OR $this->uri->segment('3')=='jadwal_desember') {
$bu = 32;
} elseif ($this->uri->segment('3')=='jadwal_februari'){
$bu = 29;
} else {
$bu = 31;
}
for ($a=1; $a<$bu; $a++) {
if ($row[$a]=='') {
echo"<td style='background-color: white;'>".$row[$a]."</td>";
} else if ($row[$a]=='M6' OR $row[$a]=='M7' OR $row[$a]=='M8' OR $row[$a]=='M9'
OR $row[$a]=='M10'OR $row[$a]=='M11'OR $row[$a]=='M12'OR $row[$a]=='M'
OR $row[$a]=='MD'){
echo"<td class='printarea' style='background-color: #a7ea9a;'>".$row[$a]."</td>";
} else if ($row[$a]=='A13'OR $row[$a]=='A14'OR $row[$a]=='A15'OR $row[$a]=='A16'
OR $row[$a]=='A'){
echo"<td style='background-color: #f7e565;'>".$row[$a]."</td>";
} else if ($row[$a]=='N22'OR $row[$a]=='N23'OR $row[$a]=='N24'OR $row[$a]=='N'){
echo"<td style='background-color: #ff9287;'>".$row[$a]."</td>";
} else if ($row[$a]=='SM' OR $row[$a]=='SM1'OR $row[$a]=='SM2'OR $row[$a]=='SM3'
OR $row[$a]=='SM4'OR $row[$a]=='SN' OR $row[$a]=='SE1'OR $row[$a]=='SE2'
OR $row[$a]=='SE3'OR $row[$a]=='S'){
echo"<td style='background-color: #96c5ff;'>".$row[$a]."</td>";
} else if ($row[$a]=='#'OR $row[$a]=='DP'OR $row[$a]=='PH' OR $row[$a]=='O'
OR $row[$a]=='C'){
echo"<td style='background-color: #878787;'>".$row[$a]."</td>";
}
}
?>
</tr>
<?php endforeach;?>
</table>
<div id='out'></div>
<div class="modal fade" id="myModal">
<div class="modal-dialog" style="margin-left: 10px; width: 210px; margin-top: 60px;">
<div class="modal-content">
<div class="modal-header" style="height: 50px; background-color: #3a3a3a">
<button type="button" class="close" data-dismiss="modal" aria-label="Close" style="color: white;"><span aria-hidden="true">×</span></button>
<h4 style="margin-top: 0px; text-align: center; margin-bottom: 20px; color: white;" class="modal-title"> Here is The Modal :</h4>
</div>
<div class="modal-body">
<p>Nama Karyawan : <input readonly type="text" class="form-control" id="txtfname"/></p>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#a7ea9a; color : black;
padding-right : 15px;"
>M6</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#a7ea9a; color : black;
padding-right : 15px;"
>M7</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#a7ea9a; color : black;
padding-right : 15px;"
>M8</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#a7ea9a; color : black;
padding-right : 15px;"
>M9</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#a7ea9a; color : black;
padding-right : 15px;"
>M10</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#a7ea9a; color : black;
padding-right : 15px;"
>M11</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color : #a7ea9a; color : black;
padding-right : 15px;"
>M12</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#f7e565; color : black;
padding-right : 15px;"
>A13</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#f7e565; color : black;
padding-right : 15px;"
>A14</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#f7e565; color : black;
padding-right : 15px;"
>A15</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#f7e565; color : black;
padding-right : 15px;"
>A16</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#ff9287; color : black;
padding-right : 15px;"
>N22</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#ff9287; color : black;
padding-right : 15px;"
>N23</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#ff9287; color : black;
padding-right : 15px;"
>N24</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#96c5ff; color : black;
padding-right : 15px;"
>S</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#878787; color : black;
padding-right : 15px;"
>OFF</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#878787; color : black;
padding-right : 15px;"
>DP</button>
<button class="btn"
style="margin-top: 5px; width: 85px; height:35px;
background-color :#878787; color : black;
padding-right : 15px;"
>C</button>
</div>
<!-- <div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Batal</button>
<button type="button" class="btn btn-primary">Selesai</button>
</div> -->
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</section>
Javascript：
<script type="text/javascript"> $('table tbody tr td').on('click',function(){
$("#myModal").modal("show");
$("#txtfname").val($(this).closest('tr').children()[1].textContent);
</script>