Hello to all.

I have a table and a button Edit. I bring everything to the screen and each button knows its ID. I need that when I clicked on the Edit button, his ID automatically got into the query written by me.

Here is my PHP code

$(".btn[data-target='#myModal']").click(function() { var columnHeadings = $("thead th").map(function() { return $(this).text(); }).get(); columnHeadings.pop(); var columnValues = $(this).parent().siblings().map(function() { return $(this).text(); }).get(); var modalBody = $('<div id="modalContent"></div>'); var modalForm = $('<form role="form" name="modalForm" action="putYourPHPActionHere.php" method="post"></form>'); $.each(columnHeadings, function(i, columnHeader) { var formGroup = $('<div class="form-group"></div>'); formGroup.append('<label for="' + columnHeader + '">' + columnHeader + '</label>'); formGroup.append('<input class="form-control" name="' + columnHeader + i + '" id="' + columnHeader + i + '" value="' + columnValues[i] + '" />'); modalForm.append(formGroup); }); modalBody.append(modalForm); $('.modal-body').html(modalBody); }); $('.modal-footer .btn-primary').click(function() { $('form[name="modalForm"]').submit(); }); 
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <table class="simple-little-table table" cellspacing='0'> <tr> <th> <p>&#8470;</p> </th> <th> <p>AD, Soyad, Ata adi</p> </th> <th>Shexsi nomre</th> <th>Shirket nomre</th> <th>WhatsApp nomre</th> <th>Tabel nomre</th> <!--<th>Ishe Qabul</th>--> <th>VOEN</th> <th>Sexsiyet</th> <th>Prava</th> <th> <p>Mehkumluq Haqqinda Arayis </p> </th> <th>4 shekil</th> <th>Telimat</th> <th> <p>Xidmet Muqavile </p> </th> <th>Bal</th> <th>nomre</th> </tr> <?php $result =mysql_query("SELECT * FROM `MY_TABLE` WHERE 1 and status=1"); while ($row = mysql_fetch_array($result, MYSQL_NUM)) { $id=$row["0"]; $bal=$row["9"]; $voen=$row["10"]; $sexsiyet=$row["11"]; $prava=$row["12"]; $mahk=$row["13"]; $photo=$row["14"]; $telimat=$row["15"]; $xidmet=$row["16"]; echo '<tr> <td></td> <td><p>'.$row[1].' '.$row[2].' '.$row[3].'</p></td> <td><p>'.$row[4].'</p></td> <td><p>'.$row[5].'</p></td> <td><p>'.$row[6].'</p></td> <td><p>'.$row[7].'</p></td>'; ?> <td> <p> <?php if($voen==1) { echo '<input type="checkbox" checked />'; } else { echo '<input type="checkbox" />'; }?></p> </td> <td> <p> <?php if($sexsiyet==1) { echo '<input type="checkbox" checked />'; } else { echo '<input type="checkbox" />'; }?></p> </td> <td> <p> <?php if($prava==1) { echo '<input type="checkbox" checked />'; } else { echo '<input type="checkbox" />'; }?></p> </td> <td> <p> <?php if($mahk==1) { echo '<input type="checkbox" checked />'; } else { echo '<input type="checkbox" />'; }?></p> </td> <td> <p> <?php if($photo==1) { echo '<input type="checkbox" checked />'; } else { echo '<input type="checkbox" />'; }?></p> </td> <td> <p> <?php if($telimat==1) { echo '<input type="checkbox" checked />'; } else { echo '<input type="checkbox" />'; }?></p> </td> <td> <p> <?php if($xidmet==1) { echo '<input type="checkbox" checked />'; } else { echo '<input type="checkbox" />'; }?></p> </td> <td> <?php echo $row[9]; ?> </td> <td> <?php echo '<button class="btn btn-success" data-toggle="modal" onclick=\'getValue('.$id.');\' data-target="#myModal" contenteditable="false" value=".$id.">'.$id.'</button>';?></td> <?php ?> </tr> <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"></div> </div> <div class="modal-dialog"> <div class="modal-content"></div> </div> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal"> <span aria-hidden="true" class="">? </span><span class="sr-only">Close</span> </button> <?php $s = mysql_query("Select * from MY_TABLE where id = $id"); while($k = mysql_fetch_array($s)) { ?> <h4 class="modal-title" id="myModalLabel"> <?php echo $k."fdfd"; ?> </h4> </div> <div class="modal-body"> <div class="form-group"> <label for="firstname" class="col-sm-2 control-label">AD</label> <div class="col-sm-10"> <input type="text" class="form-control" id="firstname" name="firstname" placeholder="Firstname" required> </div> </div> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> <button type="button" class="btn btn-primary">Save changes</button> </div> </div> </div> </div> <?php }} ?> </table> 

Sample photos

Photo of the table with a button enter image description here

It is necessary not to send VALUE to the modal, but to make the id available for use in the query, so that, depending on the ID, it can display the data. enter image description here

  • Well, add an attribute to the button, and when you click from the event, take event.target.getAttribute('data-myCustomId') . Ps. You need to add a tag with a label data-<ваш текст> - Vasily Barbashev
  • @ Vasily Barbashev event.target.dataset('myCustomId') ? ;-) - Alexey Shimansky
  • @ Vasily Barbashev I am weak in JS, for this I asked for help. How in my case will it be correct to write this and where exactly? PS I need to use this in the query. - Orkhan Bagirov
  • @OrkhanBagirov Duck in your example, when you click on the button for event.target.getAttribute('value') your identifier will be used as you wish) - Vasily Barbashev
  • @ Alexey Shimansky Both options are working;) I rarely use custom data- fields. Did not know about the dataset option for HTMLElement - Vasily Barbashev

0