Checking radios in pagination - javascript

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
});

Related

Can i pass array to an HTML? Creating a dynamic html table with php/javascript

I have created a table with 3 columns and rows with the size of an array pulled from the database. I have got the value but I want to create a button inside the cells with the name from pname and when you click that button it will take you to the value of plink. I tried using <input type="button" value=" " onclick="window.open( )", but it doesn't seem to pass the arrays. I am sure there is an easier/ better way to do it with JavaScript, but I am not familiar with JavaScript. Please help me out. Here is my code.
I want the format 3 columns and infinite rows(based on the data).
<!DOCTYPE html>
$pname = array();
$plink = array();
$results = $wpdb->get_results("SELECT name, link FROM `wptable`);
if(!empty($results)) {
foreach($results as $row){
$pname[] = $row->name;
$plink[] = $row->link;
}
}
$num = 0;
echo "<table class='table'>";
echo "<tbody>";
echo "<br><br>";
$quant_row = count($pname)/3;
$quant_col = 3;
for ($count_row = 0; $count_row < $quant_row; $count_row++)
{
echo "<tr>";
for ($count_col = 0; $count_col < $quant_col; $count_col++)
{
echo "<td>";
echo $plink[$num];
echo "</td>";
$num++;
}
echo "</tr>";
}
echo "</tbody>";
echo "</table>";
?>
You just need to echo a button inside an anchor:
echo '<button type="button">' . $pname[$num] . '</button>';
try this.
echo "<td>";
echo "<button onclick=\"Document.getElementById('link$num').display=state$num? 'none' :'block';state$num=!state$num; \">". $pname[$num] ."</button><div id='link$num'>". $plink[$num]."<div>";
echo "";
when you click on $pname , you show the $plink. reclick and hide the content

How to get value of checkbox from PHP and DOM

i need to know how on earth to get my checkbox value from PHP that is in a loop and also might be in DOM. I have to put that checkbox inside the loop to make it being shown on each row of databases. I tried to call it back using different method but none success. The last part is javascript but i don't have any clue how to do that.
My code for javascript index.php.
function ajaxSearchUpdater(p){
$("#result").show();
var x = $("#search").val();
var y = $("#edulevel").val();
var pagelim = $("#pagefpe").val();
var pagenumber = p;
var checkb = $(".sBorrow").val()
$.ajax({
type:'POST',
url:'userres.php',
data:'q='+x+'&e='+y+'&pagelim='+pagelim+'&pageno='+pagenumber+'&checkb='+checkb,
cache:false,
success:function(data){
$("#result").html(data)
}
});
}
$(document).ready(function(e) {
ajaxSearchUpdater(1); // fires on document.ready
$("#search").keyup(function() {
ajaxSearchUpdater(1); // your function call
});
$("#edulevel").click(function() {
ajaxSearchUpdater(1); // your function call
});
$("#pagefpe").click(function() {
ajaxSearchUpdater(1); // your function call
});
$('.sBorrow').on('change', function(){
var checkBorrow = $(event.target);
var isChecked = $(checkBorrow).is(':checked');
alert("test");
alert(isChecked);
alert('checkbox'+checkborrow.attr('id')+'is checked:'+isChecked);
});
});
$(document).ready(function() {
$('.sBorrow').on('change', function(event) {
var checkbox = $(event.target);
var isChecked = $(checkbox).is(':checked');
alert('checkbox ' + checkbox.attr('id') + ' is checked: ' + isChecked);
});
});
My code for the checkbox in PHP userres.php
if($stmt->rowCount() > 0){
$r=$stmt->fetchAll();
echo "<table class='tablesorter-blackice' id='myTable' style='width:97%; table-border: 1'>";
echo "<thead>";
echo "<tr>";
echo "<th>No.</th>";
echo "<th>No.Matric</th>";
echo "<th>Name</th>";
echo "<th>Programme</th>";
echo "<th>Title</th>";
echo "<th>Thesis Level</th>";
echo "<th>Serial Number</th>";
echo "<th>Availability</th>";
echo "<th>Select book (Max 3)</th>";
echo "</tr>";
echo "</thead>";
echo "<tbody>";
foreach($r as $row){
$sBorrow = $_SESSION['sBorrow'];
echo "<tr align='center'><td>". ($startrow+1) ."</td><td>". $row['matricno'] ."</td><td>". $row['studentname'] ."</td><td>". $row['programme'] ."</td><td>". $row['title'] ."</td><td>". $row['thesis_level'] ."</td><td>". $row['serialno'] ."</td><td>". $row['bavailable'] ."</td><td>
<form method='post'>
<input type='checkbox' name='sBorrow' id='sBorrow' class='sBorrow' value='". $row['serialno'] ."'>
</form></td></tr>";
$startrow++;
//echo $row['education_level'];
}
echo "</tbody>";
echo "</table>";
I don't know what to do since i'm calling that page from ajax and uhh how should i explain this.
You know index.php -> userres.php -> index.php using ajax.
for javascript on the bottom part is what i have done and i dont think its right. I tried to create one other document ready for this checkbox but still even alert not showing up. I'm confused. please help T_T

Oop check if database table is empty

I have a selector wich gets information from the database. But when my database table is empty, the selector still shows up like this:
However, when my database is empty. I don't want to show the selector. but a message that says something like: Database is empty! Add something.
My code for the selector:
$results = $database->Selector();
echo "<form name='form' method='POST' id='selector'>";
echo "<select name='train_name' id='train_name' multiple='multiple'>";
// Loop trough the results and make an option of every train_name
foreach($results as $res){
echo "<option value=" . $res['train_name'] . ">" . $res['train_name'] . "</option>";
}
echo "</select>";
echo "<br />" . "<td>" . "<input type='submit' name='Add' value='Add to list'/>" . "</td>";
echo "</form>";
The function:
function selector() {
$sql = "SELECT train_name, train_id FROM train_information ORDER BY train_name";
$sth = $this->pdo->prepare($sql);
$sth->execute();
return $sth->fetchAll();
}
EDIT:
Got this now:
$results = $database->Selector();
if(count($results) > 0) {
//Form etc here//
}else echo "nope";
It is working now! :D

Keeping checkboxes checked with fetch array

Here is the code which I have on the site, it retrieves each season and then numbers of home wins, win percentage and win lsp which is all fine and it creates a new line in the table for each season.
I then have two columns which filter out the data (Min & Max) which are radio buttons and these work fine, they stay checked after I submit and the values work fine.
The one that I am having problems with is the 'Checkbox' which I need to keep checked after the form is submitted, it only keeps one of the checkboxes checked after I submit it.
<form action='' method='post'>
<?php
echo "<table id='stats' width='100%' border='1' cellspacing='1' cellpadding='1'>
while($row = mysql_fetch_array($resultsseason, MYSQL_ASSOC)) {
echo "<tr bgcolor='#FFFFCC'>";
echo "<td align='center'><input type='radio' class ='radio-button' name='seasonmin' value='".$row['season']."'" . ((#$_POST['seasonmin'] == $row['season'])?'checked="checked"':"") . "/></td>";
echo "<td align='center'><input type='radio' class ='radio-button' name='seasonmax' value='".$row['season']."'" . ((#$_POST['seasonmax'] == $row['season'])?'checked="checked"':"") . "/></td>";
**echo "<td align='center'><input type='checkbox' name='seasonexc' value='".$row['season']."'/></td>";**
echo "<td align='center'>" . $row['season'] . "</td>";
echo "<td align='center'>" . $row['countp'] . "</td>";
echo "<td align='center'>$profitwb1<font color='$profitw'>" . $row['counth'] . "</font>$profitwb2</td>";
echo "<td align='center'>$profitwb1<font color='$profitw'>" . $row['WinPer'] . "%</font>$profitwb2</td>";
echo "<td align='center'>$profitwb1<font color='$profitw'>" . $row['WinLSP'] . "</font>$profitwb2</td>";
echo "</tr>";
}
echo "</table>";
?>
<hr><br>
<input type="submit" value="Update" >
<script type="text/javascript">
var allRadios = document.getElementsByName('seasonmin');
var booRadio;
var x = 0;
for(x = 0; x < allRadios.length; x++){
allRadios[x].onclick = function() {
if(booRadio == this){
this.checked = false;
booRadio = null;
}else{
booRadio = this;
}
};
}
</script>
<script type="text/javascript">
var allRadios = document.getElementsByName('seasonmax');
var booRadio;
var x = 0;
for(x = 0; x < allRadios.length; x++){
allRadios[x].onclick = function() {
if(booRadio == this){
this.checked = false;
booRadio = null;
}else{
booRadio = this;
}
};
}
</script>
I have searched and read plenty of posts on keeping them checked but I cannot seem to figure it out! The line which I need help with is..
echo "<td align='center'><input type='checkbox' name='seasonexc' value='".$row['season']."'/></td>";
and how to keep ALL which are checked, checked after I hit submit!
Thank You in advance!
Checkboxes differ from radio buttons in that they're not grouped. Whereas with radio buttons you can only have one of those sharing the name attribute checked, with checkboxes you must use different names.
In your case you're printing a bunch of checkboxes with the same name, which results in just one of them being submitted. A good convention is to use an array-type name, which in your case would be seasonexc[]. If you're keeping track of indices, change that to seasonexc[".$index."].
Also, I noticed that with your problematic line the checked attribute was missing altogether, thus preventing any of them being checked.
I have found that a simple...
if (isset($_POST['seasonexc']) && is_array($_POST['seasonexc']) && in_array($row['season'], $_POST['seasonexc'])) { $checked = "checked='checked'"; } else { $checked = ""; }
and then calling $checked has solved the problem! Always the way of trying to overthink it!

JavaScript dropdown menu does not work in IE8

I'm using an on change for a drop down menu to display information once a choice is chosen from the dropdown. This works fine in Firefox and Chrome but I have been hoodwinked into having to use ie8 and this on change does not seem to fire. Any help would be much appreciated. Its a mix of php and html the lower part is js which outputs info when chosen.
echo "<p><h2> To View a Route: </h2><br> Pick a routes name from the list and all its information can be viewed below the selection box.</p>";
echo "<p><FORM METHOD=\"post\" ACTION=\"controller.php\">";
echo "<select class=\"toggle-data\" name='selectallrouteinfo'>";
echo "<option value=\"\">Choose a Route </option>";
for ($i = 0; $i < sizeof($list1); $i++) { //going through each element of array and outputting route
if (is_string($list1)) {
echo "<option value=\"\" data-toggle = \"$id1\" >$list1</option>";
} else {
$space = " ";
$id = $list4[$i];
$id1 = "#" . $list4[$i];
echo "<option data-toggle = \"$id1\" value=\"$id\">" . $list1[$i] . $space . $id . "</option>";
$idHolder[$i] = $id; //array for holding ids so that it passing the correct id to my loops below
}
}
echo "</select></form></p>";
for ($k = 0; $k < sizeof($idHolder); $k++) { //my outer loop is going through the ids, fitting correct id to the div and dbm obj
echo "<div id=\"$idHolder[$k]\" style=\"display: none;\">
";
$allRouteInfo = $DBM1->getAllRouteData($idHolder[$k]);
for ($j = 0; $j < sizeof($allRouteInfo); $j++) { // my inner loop is going through each element of array and outpting all route info
if (is_string($allRouteInfo)) {
echo $allRouteInfo; //if theres no info, there is no array, it has returned a string
} else {
echo $allRouteInfo[$j]; //if there is arry, happy days
}
}
echo "</div>";
//below is a js/jquery script for outputting my choice in the select of route info
echo " <script>$('.toggle-data').on('change', function() { //jquery for printing my valuable info on change
var toggle = this.options[this.selectedIndex].getAttribute('data-toggle'),
toggle_class = 'unique_classname';
$('.'+toggle_class+', '+toggle).toggle().removeClass(toggle_class);
$(toggle).addClass(toggle_class);
}); </script>";
echo " </div>";

Categories