I want rest the value in the text box when the rest button click in dynamical created table .how do i do it?
$table .='<tbody><tr>';
$table .='<td>' . $row["emp_id"] . '</td>';
$table .='<td>' . $row["emp_name"] . '</td>';
$table .='<td>' . $row["date"] . '</td>';
$table .='<td><input type="text" name="firstname" class="form-control" value="'.$row["ot_hour"] .'" size="4"></td>';
$table .='<td><button type="button" name="ot_approval_rset" class="btn btn-primary btn-sm ot_approval_rset" " id="'.$row["emp_id"].'">Reset</button></td>';
$currentMonth= date('Y-m');
$query01 ="SELECT SEC_TO_TIME( SUM( TIME_TO_SEC( `ot_hour` ) ) ) AS timeSum
FROM otresquest
WHERE emp_id ='".$row["emp_id"]."' AND date LIKE '$currentMonth%' AND overtime_status=6";
$statement = $connect->prepare($query01);
if($statement->execute())
{
$result = $statement->fetchAll();
foreach($result as $row){
$table .='<td>' . $row["timeSum"] . '</td>';
}
}
$table .='</tr></tbody>';
java script code
$(document).on('click', '.ot_approval_rset', function() {
emp_id = $(this).attr('id');
//i need write code here to reset (00:00:00) value of ot_approval_rset input box
});
when click the reset button particular row ot hours should 00:00:00 .
Let try this code
$(document).on('click', '.ot_approval_rset', function() {
var otherInput = $(this).closest('tr').find('input').val('00:00:00');
});
It may be help to you
Related
I have some radio buttons generated dynamically and are already paginated. Am checking to see if all are checked but this works only for the first page of pagination but fails to work for the next pages.
When i disable the pagination this works so it only checks for the radio buttons in the first page of the pagination but not all checkboxes how do i imlplement to check for all checkboxes regardless of which page they are in pagination
This is my code which works for first page of pagination
$("input:radio").change(function() {
var all_answered = true;
$("input:radio").each(function(){
var name = $(this).attr("name");
if($("input:radio[name="+name+"]:checked").length == 0)
{
all_answered = false;
}
});
if(all_answered==true ){
alert("all checked");
}else {
alert("not all checked");
}
});
This is my php code that generates the radios:
<?php
$n=1;
foreach ($checks as $m => $check) {
$radioyes ="";
$radiono ="";
$item ="";
$radioyes .= '<input type="radio" name="'. $m.'" class="selected one" value="'.$m.'" >';
$radiono .= '<input type="radio" name="'. $m .'" class="not_selected one" value="'.$m.'">';
echo "<tr id='" . $m . "'>";
echo "<td>" . $n . "</td>";
echo "<td>" . $item . "</td>";
echo "<td>".$radioyes."</td>";
echo "<td>".$radiono."</td>";
echo "<td>".$textinbox."</td>";
echo "</tr>";
$n++;
}
?>
I hve checked on This link but doesnt work.
You have to use '.on('change'...) for dynamically generated inputs
E.g :
$(document).on('change', 'input:radio', function() {
// Does some stuff
});
I'm trying to change an input value using jQuery mouse over.
Scenario: I got 5 div having different colors and user names. When mouseover a div the input text change (and for color input the background color) data according to database values, when change div the text displays new data.
using PHP I echo the part of the script to handle the mouseover function
<?php
$myId = '1';
$uname = 'user1';
$ucolor = 'FFFFFF';
echo "<script>
$('$myId').mouseover( function () {
$('#uname').val('" . $uname . "'),
$('#ucolor').val('" . $ucolor ."'),
$('#ucolor').css('background-color', '" . $ucolor . "')
})
</script>";
This work if i change mouseover() to hover(), but display only the first element, if i do a mouse over the second element data doesn't change.
Try this:
Put your script after body tag:
<body>
<div class="hh" id="1"></div>
<input type="text" id="uname" />
<input type="text" id="ucolor" />
<div class="hh" id="2"></div>
</body>
<?php
$myId = '1';
$uname = 'user1';
$ucolor = 'FFFFFF';
echo "<script>
$('#$myId').mouseover( function () { // add # here
$('#uname').val('" . $uname . "'),
$('#ucolor').val('" . $ucolor ."'),
$('#ucolor').css('background-color', '" . $ucolor . "')
})
</script>";
$myId = '2';
$uname = 'user2';
$ucolor = 'FFF555';
echo "<script>
$('#$myId').mouseover( function () { console.log('fdgfdg')
$('#uname').val('" . $uname . "'),
$('#ucolor').val('" . $ucolor ."'),
$('#ucolor').css('background-color', '" . $ucolor . "')
})
</script>";
?>
In general the div or any DOM must have a unique ID value. Try using class selector(.) instead of ID selector(#).
I have a checkbox where the values are dynamically populated from the data on my database. I would like to perform further queries based on the clicked checkbox, however I cant seem to retrieve the ID whenever I click on any of the checkboxes. I do not want to use a submit button. How can this be achieved??
My code.
function getDBlist() {
global $link;
$qry = ("SHOW DATABASES");
$res = mysqli_query ( $link, $qry );
while ( $row = mysqli_fetch_assoc ( $res ) ) {
echo '<input type="checkbox" name="db" id="' . $row ['Database'] . '" value="' . $row ['Database'] . '" />';
echo $row ['Database'];
}
}
getDBlist ();
My Script
$(document).on("change","checkbox", function() {
var val = $(this).val();
var id = this.id;
alert(val, id);
});
When I click on any of the checkboxes I don't get an alert with either the value or the ID. What am I doing wrong here? Could it be because of my dynamically generated ID?
To bind change event to the dynamically generated checkboxes you need to delegate change event like below
$(document).on("change",".checkbox", function() {
var val = $(this).val();
var id = this.id;
alert(val, id);
});
Above code will work for both existing and dynamically created checkboxes. Here document object will delgate change event to checkboxes with class="checkbox"
Also as mentioned by #Ghost, you need to add class to dynamically generated checkboxes like below
echo '<input type="checkbox"
name="db" id="' . $row ['Database'] . '"
value="' . $row ['Database'] . '"
class="checkbox"/>';
More Information for .on()
Looking at your echo statement rendering the markup, you haven't designated class="checkbox" at all:
echo '<input type="checkbox" name="db" id="' . $row ['Database'] . '" value="' . $row ['Database'] . '" />';
Since you haven't added it, pointing to $(".checkbox") won't work. You need to add them in the echo.
Your jquery selector is looking for an element with the css class `checkbox', either add this class to your html:
echo '<input type="checkbox" class="checkbox"...';
Or remove the period in the selector, to target all checkbox elements:
$("checkbox").on("change", function() {
var val = $(this).val();
var id = this.id;
alert(val, id);
});
Try this
$("body").on("change",".checkbox", function() {
var val = $(this).val();
var id = $(this).attr("id");
alert(val, id);
});
I am have this issue:
<fieldset>
<?php
echo form_open('rssFeedReader/addSource');
echo '<h2><small>(*) Select in which category you want to add a new Rss Source </small><h2>';
echo '<div class="form-group">';
echo '<select class="form-control input-lg" name="category" id="category">';
foreach( $categories as $row )
{
// here i have some values from my database
echo '<option value="'.$row->id.'">' . $row->category_name . '</option>';
}
echo '</select>';
echo '</div>';
// NOW, HERE I WANT TO PUT ANOTHER <SELECT>
echo '<div class="form-group">';
echo '<select class="form-control input-lg" name="anotherID" id="anotherID">';
foreach( $array as $r)
{
// here i have some values from my database
echo '<option value="'.$r->something.'">' . $r->something_else. '</option>';
}
echo '</select>';
echo '</div>';
echo '<div class="form-group">';
echo form_submit(array('class' => 'btn btn-primary btn-lg btn-block', 'id' => 'remove_source', 'name' => 'remove_source', 'value' => 'Remove Source'));
echo '</div>';
?>
<?php echo validation_errors('<p class="error">'); ?>
Now, what I want to do.
The second select list is empty initially.
I want to fill it with values depending of what is chose in first select list.
How can I do that? To fill the second select list only if something is selected in first select list.
MrCode has a nice example for you.
Using Ajax To Populate A Select Box
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
$('#category').on('change', function (){
$.getJSON('select.php', function(data){
var options = '';
for (var x = 0; x < data.length; x++) {
options += '<option value="' + data[x]['id'] + '">' + data[x]['name'] + '</option>';
}
$('#anotherID').html(options);
});
});
});
</script>
Your select.php should json_encode() the data which you want to fill your select with
The best way to handle this would be to populate the list after you made a change on the first list. For example.
$("#category").on("change", function(){
var selectedValue = $(this).val();
$.get("some.php?value=" + selectedValue, function(response){
var options = "";
for(var i = 0; i < response.length;i++){
var val = response[i];
options += "<option value='" + response[i].id + "'>" + response[i].name + "</option>";
}
$("#anotherID").empty().append(options);
});
}
I had to make several assumptions. for example your some.php will take a value parameter. The return is json array [{id:1, name:"option 1"}, {id:2, name:"option 2"}]. Please keep this in mind.
I have a table which I populate with data from server using php. Next, I add a cell for each row of data and put a radio button in that cell. I do it with the following code:
<script>
var table=document.getElementById("dataTables-1");
table.createTHead()
var cell;
var row;
for(var i=1;i<table.rows.length-1;i++){
row=table.rows[i];
cell=row.insertCell(0);
cell.innerHTML="<?php echo '<input type=' . "'radio'" . ' name=' . "'radio'" . '>' ?>"
}
</script>
What I need to do is add value property to the radio button node, that would equal the innerHTML of cell in that table, in the same row.
My aim is to create a table in which user selects a table row (using radio button) and then presses the button below the table which has action="some_other_page.php" and keep the $_POST["radio"] (value taken from one of the columns, in the row selected by user) to process it further.
Change this line :
cell.innerHTML="<?php echo '<input type=' . "'radio'" . ' name=' . "'radio'" . '>' ?>"
to this :
cell.innerHTML="<?php echo '<input type=' . "'radio'" . ' name=' . "'radio'" . 'value=' . "$valueOfInnerHTMLOfTable" . '>' ?>"
Where $valueOfInnerHTMLOfTable is the value you want to set.