This question already has answers here:
Delete multiple rows by selecting checkboxes using PHP
(6 answers)
Closed 8 years ago.
I have the following html code of datatable rows which are dynamically generated using php
<tr>
<td><input type='checkbox' name='post[]' value="1"></td>
<td>21-Apr-2014</td>
<td>TEST</td>
<td>merchant.inloc8.com</td>
<td>coupon</td>
<td>mmmq.com/id/rt7WLskQq2lLlO2kTN</td>
<td>abc.com/response.php (default)</td>
<!--<td align='center' width='30'><a data-toggle='modal' href='#' ><i class='icon-remove text-danger'></i></a></td> -->
</tr>
<tr>
<td><input type='checkbox' name='post[]' value="2"></td>
<td>21-Apr-2014</td>
<td>say nw</td>
<td>abcdefg.com</td>
<td>abc</td>
<td>mmmq.com/id/lbruxjFl6PitP25vTN</td>
<td>abc.com/response.php (default)</td>
<!--<td align='center' width='30'><a data-toggle='modal' href='#' ><i class='icon-remove text-danger'></i></a></td> -->
</tr>
When a checkbox is selected,I wanted to identify the row and delete that row in the backend.I think this can be done using ajax.But no idea.please help
See this example
Checkboxes.
<input type="checkbox" value="1" name="letter[]" />
<input type="checkbox" value="2" name="letter[]" />
<input type="checkbox" value="3" name="letter[]" />
<input type="button" id="btn_" value="submit" />
When the button is clicked you can get the values of the selected checkboxes as an array and pass it to the ajax call,
$("#btn_").on('click', function () {
arr=[];
var arr = $("input[name='letter[]']:checked").map(function() {
return this.value;
}).get();
$.ajax({
type: "POST",
data: {arr:arr},
url: "action.php",
success: function(msg){
alert("success");
}
});
});
You will get the values in action.php and delete the rows there. You can change the alert("success");to the callback you want to get.
serialize form data , pass to controller , delete entries.
full outline here
Look, I'm giving you the logic only. If I give the code, you will not learn anything.
Well, set the checkbox value to the $id of the Table, and once you click submit, check all $ids which are checked, and run a loop to delete the $ids with a query.
Related
I want to get the values of a dynamic created table but I couldn't figure out what is wrong.
the table created in a php file or it creates in server side by calling it in jquery.
for making it clear : in my html page I run a jquery method to load this table.
then I need this table values to be able to edit them. but what I get instead of the element value is undefined. (when I alert the value)
this is the jquery code :
//<!-- ajax Post Request -->
$(function() {
$('#edit_test_show').hide();
$('#save_edit').hide();
var vop_id = localStorage.getItem('op_id');
$.post("Requests/OPS.php", //Required URL of the page on server
{ // Data Sending With Request To Server
read_OPS: true,
op_id: vop_id
},
function(response) { // Required Callback Function
if (response) {
$("#result_table").html(response);
}
});
//====================
$('#enable_edit').on('click', function() {
$('#edit_test_show').show();
$('#enable_edit').hide();
$('#save_edit').show();
});
$('#save_edit').on('click', function() {
$('#edit_test_show').hide();
$('#enable_edit').show();
$('#save_edit').hide();
var vop_id = localStorage.getItem('op_id');
var vop_title = $('#result_table').find('#op_title').val();
var vop_descrip = $('#result_table').find('#op_descrip').val();
alert(vop_title);
});
});
html part which the table loads in :
<form method='post' class="form-inline">
<div class="form-group">
<div id="result_table">
<!-- dynamic op load -->
</div>
</div>
</form>
<button type='button' id="enable_edit" class='btn btn-default'>edit</button>
<button type='button' id="save_edit" class='btn btn-default'>save</button>
and this is the php code which generate the table :
if($row=mysqli_fetch_assoc($read_op)) {
echo "
<table class='styled-table' cellspacing='0' width='360' border='1' >
<tr>
<td>
<label for='mail_num' style='margin-right:10px;color:#595959;float: right;'>شماره فرآیند : </label>
</td>
<td>
<input name='op_id' style='width:240px;height: 25px;margin:0 3px 0 3px;'
value='".$row['id']."'/>
</td>
</tr>
<tr>
<td>
<label for='op_title' style='margin-right:10px;color:#595959;float: right;'>عنوان فرآیند : </label>
</td>
<td>
<input name='op_title' style='width:240px;height: 25px;margin:0 3px 0 3px;'
value='".$row['op_title']."'/>
</td>
</tr>
<tr>
<td>
<label for='op_descrip' style='margin-right:10px;color:#595959;float: right;'>شرح فرآیند : </label>
</td>
<td>
<textarea name='op_descrip' class='textarea_2' rows='0' cols='0' >".$row['op_descrip']."</textarea>
</td>
</tr>
</table>
<div class='cleaner h20'></div>";
}
You are using ID Selector (“#id”) but not defined ID in HTMl thus you are not able to find element
Define the IDs as
<input id='op_id' value='".$row['id']."'/>
OR, Use Attribute Equals Selector [name=”value”]
Selects elements that have the specified attribute with a value exactly equal to a certain value.
var vop_title = $('#result_table').find('[name=op_title]').val();
var vop_descrip = $('#result_table').find('[name=op_descrip]').val();
First I create a table with n number of rows and each one of them contains two radio buttons. I need to get all the id from the table row selected and the option selected. I mean if the user selected yes or no.
<table border='1' style='width:100%'>
<tr>
<th>Date</th>
<th>Time</th>
<th>Confirm Order?</th>
</tr>
<tr id='56'>
<td>".$date." </td>
<td>".time." </td>
<td>".$prog." </td>
<td>
<input type='radio' name='prog1' />NO
<input type='radio' name='prog1' />SI</td>
</tr>
</table>
Now what I got so far is getting the ids from the rows checked. Like this:
var idss = [];
$(':radio:checked').each(function(index) {
var closestTr = $(this).closest('tr').attr('id');
idss.push($(this).closest('tr').attr('id'));
});
$(function test() {
$.ajax({
type: 'POST',
url: 'test.php',
data: {
idss: idss
}
});
How can I get an array with all ids where 'no' was selected, and one array with all the ids where 'yes' was selected.
I made a fiddle here: https://jsfiddle.net/7w2df640/
This is the js:
function getArray(){
ar = {};
$(".datarow").each(function(i,o){
ar[$(o).attr("id")] = $(o).find("input[type='radio']:checked").val()
});
console.log(ar);
}
For the html, you have to add a class to the rows:
<tr class="datarow" id='56'>
and also add a value to the radio:
<input type='radio' name='prog1' checked value="no" />
In the end you will get an array exactly as you wanted:
Object {56: "si", 57: "no"}
Does that make sense?
I have created a form in php/html for student attendance now what I want is that when I enter student reg.id in "std_id" text box his class in which he is studying should be fetched from the table of database and appear it in "class" text box.
The name of the table is ("student_attendance") in the database. I don't know how to do this. So please help me doing it.
`
Student Reg. ID:
<td> Class: </td>
<td> <input type="text" name="class"/> </td>
</tr>
<tr>
<td> Section: </td>
<td> <input type="text" name="section"/> </td>
<td> Session: </td>
<td> <input type="text" name="session"/> </td>
</tr>
<tr>
<td> Date: </td>
<td> <input type="date" name="date"/> </td>
</tr>
<tr>
<td> Present Status: </td>
<td> <input type="text" name="pstatus"/> </td>
</tr>
</table>
<input type="submit" name="SAVE"/> //is used to save the form data in db
</form>`
Thanks
You can use following code :
$(document).ready(function (){
$("input[name=std_id]").blur(function (){
var reg_id=$("input[name=std_id']").val();
// now make ajax call for fething class data from table :
$.ajax({
type:'get',
url: 'test.php',
data:{regid:reg_id}
}).done(function(result){
//store response in class textbox:
$("input[name=class']").val(result);
});
});
Dont forget add jquery and ajax plugin.
You can use OnChange() attribute in javascript to trigger your database from background.
Or you can use Ajax.
Simply you need to do an ajax call to get data from backend.
Ajax is a technology to perform requests from browser without refreshing the page.
It does a request and gets response (usually returned in json format) based on which you decide in frond end what to do (maybe display your desired data from response somewhere).
Here is a tutorial on general ajax: http://www.w3schools.com/ajax/
Also it is nice to attach jQuery lib and use it's $.ajax() method with its success and fail handlers: http://api.jquery.com/jquery.ajax/
You should have a php file where you will get the class by student id. Something like this:
<?php
$id = $_GET('std_id');
//connect to mysql
//select * from student_attendance where std_id = $id;
//get result
echo array('class'=>$result['class']);
?>
And in frontend on reg.id blur or change:
$.ajax({
url: "test.php",
type: 'POST'
}).done(function(response) {
$('input[name=class]').val(response.class);
});
I have an html table built from a database query which loops through and creates a button for each camera name found and puts them in a table:
<?php
for($i=0;$i<$num_rows;$i++)
{
?>
<tr>
<td>
<input type="submit" class="play" data-hash="<?php echo $result_cameras[$i]["camera_hash"]; ?>" value="<?php echo $result_cameras[$i]["camera_name"]; ?>">
</td>
</tr>
<?php
}
?>
This resolves to something like this:
<tr>
<td>
<input type="submit" class="play" data-hash="0d3d0ac6e54a640c73f1149d4d0bbc38e99d10f5" value="Office Window">
</td>
</tr>
<tr>
<td>
<input type="submit" class="play" data-hash="b824cba374c3d5ab7806ad8260c939323c03147b" value="aaa">
</td>
</tr>
<tr>
<td>
<input type="submit" class="play" data-hash="ec9658f0c1855e2e2ac09ae284f5e6990dbf445d" value="laptop">
</td>
</tr>
Notice the data hash attribute is different for each button. I want to process this button with my jquery code:
$(".play").click(function(){
var camerahash = $('input').data('hash');
console.log($('input').data('hash'));
});
No matter which button I click I will always get the hash from the first button I click: 0d3d0ac6e54a640c73f1149d4d0bbc38e99d10f5. Any help is appreciated.
$('input').data('hash') gives you the data attribute of the first input in the selection use $(this).data('hash') to get the data attribute of the currently clicked input
You need to specify which input element to read.
Try something like:
$(".play").click(function(){
$this = $(this);
var camerahash = $this.data('hash');
console.log($this.data('hash'));
});
You are always calling the first object of .play. This would be a correct way:
$('.play').on('click', function(){
var camerahash = $(this).data('hash');
});
You could always grab them by using the .attr(data-hash) html5 attribute.
Try:
$('.play').on('click', function() {
var _hash = $(this).attr('data-hash');
console.log(_hash);
});
Your selector will return the first one that it comes to. Use this instead
<script>
$("input.play").click(function() {
alert($(this).data('hash'));
});
</script>
i retrieved data from mysql table into html page i.e
$query="select * from student";
$result=mysql_query($query)or die(mysql_error());
while($rs=mysql_fetch_array($result))
{
?>
<tr>
<td align="center"><?php echo $rs['st_id']; ?></td>
<td align="center"><?php echo $rs['name']"; ?></td>
<td align="center"><input type="checkbox" name="checked[]" <?php if($rs['checked']==1){echo "checked"; } ?> /></td>
<td align="center"><img src="images/delete_icon.png" alt="Delete" /></td>
<td align="center"><img src="images/update.png" alt="Update" /></td>
this is gives me the output
assume that checkbox of id 1 is checked and retrieved from mysql table.
Now what i want to do is that when i checked the remaing two checkbox into this table and a function is called to ajax which goes to php page and update the value of checked field according to the given id (i.e 2 and 3 in this case). Not refreshing the whole page nor updating the whole record just the value of check box. i am new to ajax so
any help would be greatly appreciated.
Yes, exploring jqGrid isn't a waste of time at all. However, since you want to update only on change of checkbox value. Here's what you can do..
<input type="checkbox" name="check1" />
And..
$().ready(function(){
var st_id = <?php echo $rs['st_id']; ?>;
//Or you could use a hidden field in the form
$(':checkbox').click(function(){
var chkName = $(this).attr('name');
var checkVal = $(':checkbox[name='+chkName+']').attr('checked');//true or false
$.ajax({
url: 'MyApp/update.php?checboxName=' + checkVal,//Do update on server-side
success: function(data) {
alert('Updated successful.');
}
});
});
});
Also, you can do a $('formID').serialize() wihch returns name=value pairs of all form elements that can then be appended in the call to your php script.