Enable Textbox oncheck checkbox Array - javascript

Ive been figuring out how to enable an array of textbox when their corresponding checkbox is being checked using javascript...
Here is my code:
$line_util3 = "Select id_code,description from WEBLOAN_SERVER.webloan.dbo.mis_group where pid_code='$list_count' and group_no = '0' and child_node = '1' ";
$stmt_line_util3=sqlsrv_query($conn, $line_util3);
if(!$stmt_line_util3) {
die( print_r( sqlsrv_errors(), true));
}
sqlsrv_execute($stmt_line_util3);
while ($imps_row1 = sqlsrv_fetch_array($stmt_line_util3,SQLSRV_FETCH_ASSOC))
{
echo "<tr>";
echo "<td><input type='checkbox' name='op[]'></td>";
echo "<td>" . $imps_row1['id_code'] . " - " . $imps_row1['description'] . "</td>";
echo "<td><input type='text' disabled='disabled' name='txt[]'></td>";
echo "</tr>";
}
Thank You very much for the Help

Try this i hope this will help you. Which uses jQuery.
$(document).on('click', 'input[name="op[]"]', function () {
var checked = $(this).prop('checked');// true or false
if (checked) {
$(this).parents('tr').find('td input[type="text"]').removeAttr('disabled');
}
else {
$(this).parents('tr').find('td input[type="text"]').attr('disabled', 'disabled');
}
});
here is updated the Demo

add an onclick event to call a javascript function to ur checkbox then assign id to the different text box whom u want to disable or enable/disaapear or appear.in the following code i am enabling text box with id 'tpnr' and disabling the other text boxes(id:bs,as)
<script type="text/javacript">
function(a){
document.getElementById("tpnr").style.position = "static";
document.getElementById("tpnr").style.top = "0px";
document.getElementById("bs").style.position = "absolute";
document.getElementById("bs").style.top = "-10000px";
document.getElementById("as").style.position = "absolute";
document.getElementById("as").style.top = "-10000px";
}
</script>

Related

How do I hide the load more button for this jquery code

I am trying to make a website but I am very new to the jquery stuff and I added jquery load more comment into my website
My question is, I have a load more button that works the way I intended it to work however when all the data are loaded or when there is no comment I can't seem to get the load button to turn hidden
//jquery script
<script>
$(document).ready(function() {
var commentCount = 20;
var qidNow = "<?php echo $qid; ?>";
$("button").click(function() {
commentCount = commentCount + 20;
$("#comments").load("includes/load-comments.inc.php", {
commentNewCount: commentCount,
qid: qidNow
});
});
});
//load-comments page
<?PHP
require 'dbh.inc.php';
include 'function.inc.php';
$commentNewCount = $_POST["commentNewCount"];
$qid = $_POST["qid"];
$count = 0;
$sqlComment = "SELECT comment, commentTime, commenterId FROM comments WHERE commentOn = ?
LIMIT ?";
$stmtComment = mysqli_stmt_init($conn);
if (!mysqli_stmt_prepare($stmtComment, $sqlComment)) {
header("Location: ../viewtopic.php?error=sqlerror4");
exit();
} else {
//bind parameter to the placeholder
mysqli_stmt_bind_param($stmtComment, "ii", $qid, $commentNewCount);
//run parameter inside database
mysqli_stmt_execute($stmtComment);
$commentData = mysqli_stmt_get_result($stmtComment);
}
if (mysqli_num_rows($commentData) > 0) {
while ($row = mysqli_fetch_assoc($commentData)) {
$count++;
echo "<div class='individualComment'>";
echo "<div class='commentCount'> คอมเม้นที่" . $count . "</div>";
echo "<div class='actualComment'>" . $row['comment'] . "</div>";
echo "<div class='commentDateBx'>" . dateReformat($row['commentTime']) . "</div>";
echo "<div class='commenterIdBx'>ID :" . $row['commenterId'] . "</div>";
echo "</div>";
}
}else {
echo "There is no comment yet";
}

How to verify only one checkbox is selected from checkbox list

Here i am retriving data from database and i am doing insert,update and delete of data using checkbox.My problem is when i click more than two checkbox than also i am moving to update.php page but what i actually want is that when i click on update button first it will check that only one checkbox is selected from list if not than alert message should display like select only one checkbox. please help.Thanks in advance
Here i have put my code.
<!DOCTYPE html>
<html>
<head>
<title>Insert Update Delete</title>
</head>
<body>
<form name="dataform" id="data" action="" method="get">
<?php
$connection = mysql_connect("localhost", "root", "");
$db = mysql_select_db("db_new", $connection);
$query=mysql_query("select * from student_info");
echo "<table>";
while($row=mysql_fetch_array($query))
{
echo "<tr>";
echo "<td>"; ?> <input type="checkbox" id="box" name="num[]" class="other" value="<?php echo $row["id"];?>" /> <?php echo "</td>";
echo "<td>"; echo $row["roll_no"]; echo "</td>";
echo "<td>"; echo $row["name"]; echo "</td>";
echo "<td>"; echo $row["division"]; echo "</td>";
echo "<td>"; echo $row["std"]; echo "</td>";
echo "<td>"; echo $row["gender"]; echo "</td>";
echo "<td>"; echo $row["subject"]; echo "</td>";
echo "</tr>";
}
echo "</table>";
?>
<input type="submit" name="insert" value="insert"/>
<input type="submit" name="update" value="update"/>
<input type="submit" name="delete" value="delete"/>
</div>
</form>
<?php
if(isset($_GET["insert"]))
{
$box = $_GET['num'];
$count =count($box);
if ($count == 0){
header('Location:insert.php');
}
elseif($count == 1){
header('Location:data.php');
}
}
?>
<?php
if (isset($_GET['update'])){
$box = $_GET['box'];
$count =count($box);
if($count == 0) {
header('Location:data.php');
}elseif($count == 1){
header('Location:update.php');
}
if(!empty($_GET['num'])) {
foreach($_GET['num'] as $id) {
echo $id;
header("location:update.php?id=".$id);
}
}
}
?>
<?php
if (isset($_GET['delete'])) {
$box = $_GET['num'];
$count = count($box);
if($count == 0) {
header('Location:data.php');
}elseif($count == 1){
header('Location:data.php');
}
if(!empty($_GET['num'])) {
foreach($_GET['num'] as $id) {
mysql_query("delete from student_info where id = $id");
}
}
}
?>
</body>
</html>
You could use a radio button for this instead of a checkbox.
see sample here
Use Radio Instead of CheckBox
Or if you must use a checkbox do this:
$('input.example').on('change', function() {
$('input.example').not(this).prop('checked', false);
});
I would use a radio button, however I don't know your situation so here's a solution using jQuery. You want to select all of the checkboxes that are checked then see if the length of that array is greater than one. Here's the javascript code you'll need and a jsbin if you want to look at it.
http://jsbin.com/qakuzajaza/edit?js,output
$("#submitbutton").click(function() {
var count = $("input[type=checkbox]:checked").length;
if (count > 1) {
alert("Only 1 can be selected");
} else {
// submit data
}
});
1. Try this, it will not allow you to check only one checkbox at a time.
$(document).ready(function () {
$('input[type=checkbox]').click(function () {
var chks = document.getElementById('#ckeckboxlistId').getElementsByTagName('INPUT');
for (i = 0; i < chks.length; i++) {
chks[i].checked = false;
}
if (chks.length > 1)
$(this)[0].checked = true;
});
});
The approaches are more or less similar. Try this:
submitForm(); //according to an event you prefer (click some button or anchor , no button over $ .ajaks.
function submitForm(){
var tag = document.getElementById("tdForm");
var chkbx = $(tag).find("input[type='checkbox']:checked").length;
if (chkbx !== 0) {
if (chkbx > 1) {
alert("more then 1");
}else{
alert("form submited"); //$(tag).submit();
}
}else{
if (chkbx === 0) {
alert("nothing cecked");
}
}
};
Tested works for me. Hope it helps!
While I think the radio buttons or previous validation, and interception of errors on the rules for completing the form, are much more affordable.

Give row color after onClick row and make request other page and stay color changed

I need Give row color after onClick row and make request other page and stay color changed
Notes: Currentaly change row color and disable color changed after refres page
<script type="text/javascript">
var id = $row['id'];
function myPopup(id) {
if (id) {
location.href = "address.php?id="+id;
}
}
</script>
<script>
$(document).ready(function () {
$('#imagetable tr').click(function () {
$(this).css('background-color', 'Green');
});
});
</script>
<?php
$resualt=mssql_query("SELECT * FROM Address ") ;
echo "<table border='1' class='imagetable'
id='imagetable' width='50%'>\n";
echo '<tr>';
echo '<th>ID</th>'.'<th>User ID</th>'.'<th>Street</th>'.'<th>Quarter</th>'.'<th>Mobile Number</th>'.'<th>Email</th>'.'<th>From</th>'.'<th>To</th>'.'<th>Notes</th>';
echo '</tr>';
while ($row = mssql_fetch_assoc($resualt)) {
echo "<tr onClick='myPopup($row[id])'>\n"."<td >{$row['id']}</td>\n"."<td> {$row['user_id']}</td>\n"."<td>{$row['street']}</td>\n"."<td>{$row['quarter']}</td>\n"."<td>{$row['Phone_number']}</td>\n"."<td> {$row['email']}</td>\n"."<td>{$row['from_date']}</td>\n"."<td>{$row['to_date']}</td>\n"."<td>{$row['other_info']}</td>\n".'</tr>'."\n";
}
echo "</table>\n";
?>
Any help?
In your PHP check if the given ID matches the ID in the while loop. When that matches, add a style parameter or a CSS class depending on your situation.
Examples:
// Your code leading up to the while loop is here ...
while ($row = mssql_fetch_assoc($resualt)) {
echo "<tr onClick='myPopup($row[id])" . ($_GET['id'] == $row[id] ? "style='background-color: green'":"") . "'>\n".
"<td >{$row['id']}</td>\n".
// The rest of the code in your loop continues here ...
It is not the most beautiful or safe code, but it suits the code you already have i think.

Fancybox issue, need a hand

I made a gallery with images fetched from DB and using Fancybox for displaying it. I have some articles that are the same, just diferent color and I display just one and underneath color boxes for changing the color.
The problem is that when I click on the button to change the color, picture changes, Fancybox on click displays first picture, not the Current one
Part of the code:
JS:
function changeImage(element,id){
var img=document.getElementById(id).src=element;
return false;
}
PHP:
while($row = mysql_fetch_array($sql)){
$prikaz =$row['prikaz'];
$id = $row['id'];
$ime = $row['ime'];
$thumb = $row['thumbs'];
$boja = $row['boja_id'];
$slicka = $row['slika'];
$spec = $row['tekst'];
if ($prikaz == 1){
echo "<table style ='display: inline' align='center'>";
echo "<tr>";
echo "<td><a class='fancybox-effects-a' href='$slicka' ><img id='$id' src='$thumb' alt='' /></a></td>";
echo "</tr>";
echo "<tr><td>";
echo "Boja: ";
$bsql = mysql_query ("SELECT muski.tekst, muski.id,muski.thumbs,boja.bslika FROM boja INNER JOIN muski ON muski.boja_id = boja.id WHERE muski.ime = '$ime' " );
while($res = mysql_fetch_array($bsql)){
$slicica = $res['thumbs'];
$muid = $res['id'];
$kockica = $res['bslika'];
echo "<button id = 'boja' onclick =changeImage('$slicica','$id')><img src= $kockica ></button>";
}
echo "</br>";
echo nl2br($spec);
}
echo "</td>";
echo "</tr>";
echo "</table>";
I found the solution.... I modified js script to change the parent href of img... It works...
function changeImage(element,id,staza) {
var img = document.getElementById(id);
img.src= element;
img.parentNode.href=staza;
return false;
}
Firebug your Fancy Box pop-up and inside the you have to change back ground image as well

How to let user hide rows from a html table

I have a table which gets dynamically populated by the results of a search query:
echo '<table class="table">';
if ($num==0) echo "<tr><td>Sorry, no items found.</td></tr>";
else {
echo '<tr> <th>Nr.</th> <th>Name</th>';
echo '<th>Description</th> <th>Image</th>';
$lf = 1;
while ($dsatz = mysql_fetch_assoc($res))
{
echo '<tr>';
echo "<td>$lf</td>";
echo '<td>' . $dsatz["name"] . '</td>';
echo '<td>' . $dsatz["description"] . '</td>';
echo '<td><img src="' . $dsatz['image'] . '" style="height:100px; width:auto" /></td>';
echo '</tr>';
$lf = $lf + 1;
}
}
echo '</table>';
The result is a table of items. Now what I would like to do is give the user the possibility to hide any row by a single click or, if not possible, by checking boxes and hiting a second Hide(delete) button at the and of the table. The rows must not be deleted from the database only hidden from view.
Any ideas how I could do this?
Thx
Seb
///////////////////////////// EDIT ////////////////////////////////////////////
Thx for the Input!
Here is what worked for me:
In table:
echo "<td><input type='checkbox' name='hide_cand' style='float:right' id='hide_cand' onclick=' return hideRow(this)'/></td>";
script:
function hideRow(checkbox)
{
if(confirm('This action can not be undone, are you sure you want to delete this item from the list?'))
{
checkbox.parentNode.parentNode.style.display = "none";
return true;
}
return false;
}
Thx for your help!
Basically, you want something like this:
$('.table').on('click','tr',function(){
$(this).hide();
});
If you wish to add checkbox inside each row:
$('.table').on('change','tr :checkbox',function(){
$(this).closest('tr').hide(); //no need here to check for checkbox state
});
Think the far most easy would be :
$('.table tr').click(function() {
$(this).hide();
});
Try something like this
$("#tableID").delegate("td", "click", function() {
$(this).closest("tr").hide();
});

Categories

Resources