<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Little Things</title>
<?php echo link_tag('resources/css/style.css'); ?>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script type="text/javascript" src="<?php echo base_url('resources/js/script.js');?>" ></script>
<script type="text/javascript">var $rows = $('#table tr');
$('#search').keyup(function() {
var val = $.trim($(this).val()).replace(/ +/g, ' ').toLowerCase();
$rows.show().filter(function() {
var text = $(this).text().replace(/\s+/g, ' ').toLowerCase();
return !~text.indexOf(val);
}).hide();
});
</script>
</head>
<body>
<div id="container">
<div id="top">
<img id="logo" src="<?php echo base_url('resources/images/logo.jpg'); ?>" alt="litLogo"/>
</div>
<div id="main">
<div id='cssmenu'>
<ul>
<li class='active'><span>Home</span></li>
<li class="element"><a href='#'><span>Shopping Cart</span></a></li>
<li class="element"><a href='#'><span>Wish List</span></a></li>
<li class="element"><a href='#'><span>Contact</span></a></li>
<li id="name">
<?php
if($this->session->userdata('email'))
{
echo "<a href='#'><span>Welcome ".$user."!</span></a>";
}
else
{
echo "<a href='#'><span>Welcome Guest!</span></a>";
}
?>
<?php
if($this->session->userdata('email'))
{
echo '<li class="element"><span>Logout</span></li>';
}
else
{
echo '<li class="element"><span>Login</span></li>';
}
?>
</li>
<li class="element"><span>Sign Up</span></li>
</ul>
</div>
<div class="tables" id="tables">
<input type="text" class="search" placeholder="Type to search">
<?php
$imgDir="../../resources/images/thumbs/";
echo "<table id='table'>";
echo "<tbody class='list'>";
echo "<tr bgcolor='#E60000'>";
echo "<th>Name</th><th>Product Line</th><th>Product Scale</th><th>Product Description</th><th>Price</th><th>Image</th>";
echo "</tr>";
$i=0;
foreach($Products as $key => $value)
{
$i++;
if($i%2==0)
{
echo "<tr bgcolor='#EE4D4D' width='100%'>";
//echo '<td>'.$value["ID"].'</td>';
echo "<td class='pName'>".$value["productName"]."</td>";
echo "<td class='pLine'>".$value["productLine"]."</td>";
echo "<td class='pScale'>".$value["productScale"]."</td>";
echo "<td class='pDes'>".$value["productDescription"]."</td>";
echo "<td class='buyPrice'>".$value["buyPrice"]."</td>";
//echo '<td>'.$value["QtySold"].'</td>';
echo "<td class='image'><img src='".$imgDir.$value['image']."' height='100' width='100'/></td>";
//echo '<td>'.$value["ABV"].'</td>';
echo "</tr>";
}
else
{
echo "<tr bgcolor='#F28080' width='100%'>";
//echo '<td>'.$value["ID"].'</td>';
echo "<td class='pName'>".$value["productName"]."</td>";
echo "<td class='pLine'>".$value["productLine"]."</td>";
echo "<td class='pScale'>".$value["productScale"]."</td>";
echo "<td class='pDes'>".$value["productDescription"]."</td>";
echo "<td class='buyPrice'>".$value["buyPrice"]."</td>";
//echo '<td>'.$value["QtySold"].'</td>';
echo "<td class='image'><img src='".$imgDir.$value['image']."' height='100' width='100'/></td>";
//echo '<td>'.$value["ABV"].'</td>';
echo "</tr>";
}
}
echo "</tbody>";
echo "</table>";
?>
</div>
<script type="text/javascript">
var options = {
valueNames: [ 'pName', 'pLine', 'pScale', 'pDes', 'buyPrice','image' ]
};
var userList = new List('tables', options);</script>
</div>
</div>
</body>
</html>
So this is my code. I am trying to filter the table as I am typing into the text box. Any help appreciated.
I've tried following the tutorials but they do not seem to work at all... any ideas?
I find it difficult to understand and apply to my own website, the code I have for filtering is taken from the internet is well.
As I see you're using jQuery so why not use contains selector? You could use it after keyUp event on select tag:
$("#search").keyup(function(){
var search = this.value;
$('#table tr, #table th').show();
$('#table td:contains('+search+')').each(function(){
$(this).parent().hide();
});
});
This code will hide any cell parent (tr, th...) which have a child td containing input value . You can use this code and make it fits better your needs.
Fiddle example: http://jsfiddle.net/uby9quLo/2/
Hope it helps!
Related
I'm trying to get this infinite scroll to work. I am not good with php, or javascript which isn't helping me.
It'll load the first 20 posts but for whatever reason I keep getting an error stating "No more posts available" when I go to scroll down to load more posts.
Here is:
index.php
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Home Page</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap#5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap#5.0.0-beta1/dist/js/bootstrap.bundle.min.js" integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW" crossorigin="anonymous"></script>
<link href="css/main.css" rel="stylesheet" type="text/css" media="all">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<div class="container-fluid no-gutter">
<nav class="navbar navbar-dark bg-dark">
<div class="container">
<h1 class="navbar-brand">Posts</h1>
</div>
</nav>
<div class="container padding">
<div class="row">
<div class="col-3">
</div>
<div class="main col-9" id="post-list">
<input type="hidden" name="total_count" id="total_count" value="<?php echo $total; ?>" />
<?php
include ("config/config.php");
try {
$conn = new PDO("mysql:host=$dbh;dbname=$dbn", $dbu, $dbp);
$sql = "SELECT address, FROM_UNIXTIME(date/1000,'%M %D, %Y %h:%i:%s') as date, body FROM table_name";
$total = $conn->query($sql)->rowCount();
$sql = "SELECT row, address, FROM_UNIXTIME(date/1000, '%M %D, %Y %h:%i %p')as date, body FROM table_name LIMIT 20";
foreach($conn->query($sql) as $row) {
echo '<div class= "home">';
echo '<div class= "address">' . $row["address"] . '</div>';
echo '<div class= "body">' . $row["body"] . '</div>';
echo '<div class= "date">' . $row["date"] . '</div>';
echo '</div>';
}
}
catch(PDOException $e) {
echo "Error: " . $e->getMessage();
}
$conn = null;
?>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function(){
windowOnScroll();
$("div.address:contains(Var)").parent().removeClass("home");
$("div.address:contains(Var)").parent().addClass("away");
});
function windowOnScroll() {
$(window).on("scroll", function(e){
if ($(window).scrollTop() == $(document).height() - $(window).height()){
console.log('Scrolling')
if($(".home").length < $("#total_count").val()) {
var lastId = $(".home:last").attr("id");
getMoreData(lastId);
}
else{
console.log('No More posts aviliable')
}
}
});
}
function getMoreData(lastId) {
$(window).off("scroll");
$.ajax({
url: 'getMoreData.php?lastId=' + lastId,
type: "get",
beforeSend: function ()
{
$('.ajax-loader').show();
},
success: function (data) {
setTimeout(function() {
$('.ajax-loader').hide();
$("#post-list").append(data);
windowOnScroll();
}, 10);
}
});
}
</script>
</body>
</html>
getMoreData.php
<?php
include ("config/config.php");
$conn = new PDO("mysql:host=$dbh;dbname=$dbn", $dbu, $dbp);
$lastId = $_GET['lastId'];
$sql = "SELECT row, address, FROM_UNIXTIME(date/1000, '%M %D, %Y %h:%i %p')as date, body FROM table_name WHERE `row` < '" .$lastId . "' LIMIT 20";
foreach($conn->query($sql) as $row) {
echo '<div class="home">';
echo '<div class= "address">' . $row["address"] . '</div>';
echo '<div class= "body">' . $row["body"] . '</div>';
echo '<div class= "date">' . $row["date"] . '</div>';
echo '</div>';
}
?>
I've spent a couple days trying to get this to work with various results.
Please help! lol...
Try placing <input type="hidden" id="total_count" value="<?php echo $total?>"> after the PHP code. Because $total is not initialized yet.
I'm trying to make a shopping page. I've kept checkboxes for selection and a number type field for quantity. As checkboxes are array I took the quantity field also an array... I know that we can check the checkbox state with checked method, now what I'm trying to achieve is to fetch corresponding quantity value and store it in a session varaible.
<?php
session_start();
if(isset($_POST['sub'])){
$_SESSION['cbb']=$_POST['cb'];
if(isset($_POST['qnty'])){
$_SESSION['qtty']=$_POST['qnty'];
header("location:userlogin.php");
}
}
?>
<html>
<head>
</head>
<body topmargin="20">
<font color='#7FFF00'>
<h1 align='center'>ONLINE SHOPPING</h1>
</font>
<form name="onshop" align="right" action="<?=$_SERVER["PHP_SELF"]?>"
method="post" onsubmit="return validate()">
<input type="submit" value="Add to cart" name="sub" style="background-
color:#7FFF00" />
<input type="reset" value="Reset" style="background-color:#7FFF00"/>
<?php
$db=mysqli_connect("localhost","root","","onlineshop");
if(!$db){
echo "Connection failure.";
}
$sql="SELECT * FROM stock";
$result=mysqli_query($db,$sql)or die("Invalid query ".mysqli_error($db));
echo "<TABLE width=50% height=70% align='center'>";
echo "<TR><TH>ITEM NAME</TH><TH>PRICE</TH><TH>IMAGE</TH><TH>Do you like?
</TH><TH>QUANTITY</TH></TR>";
while($myrow=mysqli_fetch_array($result))
{
echo "<TR><TD align='center'>";
echo $myrow["item"];
echo "</TD>";
echo "<TD align='center'>";
echo $myrow["price"];
echo "</TD>";
echo "<TD align='center'>";
$image=$myrow["image"];
echo '<img height="100" width="100" src="data:image/jpeg;base64,'.base64_encode( $image ).'"/>';
echo "</TD>";
echo "<TD align='center'>";
$itm_id=$myrow["id"];
echo "<input type='checkbox' name='cb[]' value='$itm_id'>";
echo "</TD>";
echo "<TD align='center'>";
echo "<input type='number' name='qnty[]' value='1' max='50'
min='1'>";
echo "</TD>";
echo "</TR>";
}
echo "</TABLE>";
mysqli_close($db);
?>
</form>
<script type="text/JavaScript">
function validate(){
var count=0;
var i;
var cbelements = document.getElementsByName("cb[]");
if(count==0){
for(i=0;i<cbelements.length;i++){
if(cbelements[i].checked){
count++;
}
}
if(count<1){
alert("Select atleast 1 item.");
return false;
}
}
}
</script>
</body>
</html>
Can the onchange event be useful in anyway? or the associative array ?
I have a for I=1 to 5 loop with sleep for 5 seconds.
How can I make a menu selection and continue to another page before the while loop is done.
Now when I chose the menu item the selection will take place when the while loop is done. Its about 30 seconds.
I have tried to put the while loop in an Iframe, and load it from another page, but it still first load next page when while loop is done.
From index page
<link rel="icon" href= (./image/favicon.ico)/>
<link rel="stylesheet" href="./db/abcss.css" type="text/css"/>
<script type="text/javascript" src="./db/CSSnav.js"></script>
</HEAD>
<body>
<div id="wrapper">
<?php
include("top.php");
include("IndexMenu.php");
?>
<div id="content75">
<div id="h4"> <br/><b><center>Velkommen til t</center></b>
</div>
<div id="h3"><br/><center> text here. </center><br/><br/>
<iframe src="./eventrul.php" name = "content_iframe"></iframe>
<?php
include("Bund.php")
?>
</body>
</html>
From while loop page
if ($info = mysql_fetch_array($data)){
echo "<div id=\"event\">";
while ($info = mysql_fetch_array($data) and $i < 5){
echo "<script>";
echo "document.getElementById('event').innerHTML = \"\"";
echo "</script>";
echo "<div id=\"event_indhold\">";
if ($info['type']==='Andet'){
$info['type'] = $info['typeandet'];
}
if ($info['emne']==='Andet'){
$info['emne'] = $info['emneandet'];
}
echo "<table><tr><td width = 30% > "." <B>Event nummer: </B>"."</td>"
. "<td colspan = 10>".$info['arrnr'].", Overskrift: ". $info['type']."</td></tr><br/>";
if ($info['arrangoer']!= ""){
echo "<tr><td colspan =10>"." ".$info['arrangoer']."</td> </tr>";
}
ob_flush();
flush();
sleep(4);
$i++;
echo "</div>";
}
echo "<script>";
echo "document.getElementById('event').innerHTML = \"\"";
echo "</script>";
echo "<div id=\"event_indhold\">";
echo '<font size="5px">Klikke her for at se eventlisten ';
echo "</div>";
echo "</div>";
}
You could put a break; when you know you want to exit the loop. It will simply break it.
Hello guys i have a quiz system and i want that quiz will auto submit after the time is over this is my code but its not working.
<script type="text/javascript">
function countDown(secs, elem)
{
var element = document.getElementById(elem);
element.innerHTML = "<h2>You have <b>"+secs+"</b> seconds to answer the questions</h2>";
if(secs < 1) {
document.quiz.submit();
}
else
{
secs--;
setTimeout('countDown('+secs+',"'+elem+'")',1500);
}
}
function validate() {
return true;
}
</script>
<div id="status"></div>
<script type="text/javascript">countDown(4,"status");</script>
<title>Questionnaire</title>
<style type="text/css">
span {
color: #FF00CC;
}
</style>
<body>
<br />
<div class="col-sm-8">
<div class="panel panel-black">
<?php
include("db_conn.php");
$query="select * from question";
$rs=mysql_query("select * from question where test_id=$tid",$cn) or die(mysql_error());
if(!isset($_SESSION[qn]))
{
$_SESSION[qn]=0;
mysql_query("delete from useranswer where sess_id='" . session_id() ."'") or die(mysql_error());
$_SESSION[trueans]=0;
}
else
{
if($submit=='Next Question' && isset($ans))
{
mysql_data_seek($rs,$_SESSION[qn]);
$row= mysql_fetch_row($rs);
mysql_query("insert into useranswer(sess_id, test_id, que_des, ans1,ans2,ans3,ans4,true_ans,your_ans) values ('".session_id()."', $tid,'$row[2]','$row[3]','$row[4]','$row[5]', '$row[6]','$row[7]','$ans')") or die(mysql_error());
if($ans==$row[7])
{
$_SESSION[trueans]=$_SESSION[trueans]+1;
}
$_SESSION[qn]=$_SESSION[qn]+1;
}
else if($submit=='Get Result' && isset($ans))
{
mysql_data_seek($rs,$_SESSION[qn]);
$row= mysql_fetch_row($rs);
mysql_query("insert into useranswer(sess_id, test_id, que_des, ans1,ans2,ans3,ans4,true_ans,your_ans) values ('".session_id()."', $tid,'$row[2]','$row[3]','$row[4]','$row[5]', '$row[6]','$row[7]','$ans')") or die(mysql_error());
if($ans==$row[7])
{
$_SESSION[trueans]=$_SESSION[trueans]+1;
}
echo "<h1 class=head1> Result</h1>";
$_SESSION[qn]=$_SESSION[qn]+1;
echo "<Table align=center><tr class=tot><td>Total Question<td> $_SESSION[qn]";
echo "<tr class=tans><td>True Answer<td>".$_SESSION[trueans];
$w=$_SESSION[qn]-$_SESSION[trueans];
echo "<tr class=fans><td>Wrong Answer<td> ". $w;
echo "</table>";
mysql_query("insert into result(login,test_id,test_date,score) values('$login',$tid,'".date("d/m/Y")."',$_SESSION[trueans])") or die(mysql_error());
unset($_SESSION[qn]);
unset($_SESSION[sid]);
unset($_SESSION[tid]);
unset($_SESSION[trueans]);
exit;
}
}
$rs=mysql_query("select * from question where test_id=$tid",$cn) or die(mysql_error());
if($_SESSION[qn]>mysql_num_rows($rs)-1)
{
unset($_SESSION[qn]);
echo "<h1 class=head1>Some Error Occured</h1>";
session_destroy();
echo "Please <a href=test.php> Start Again</a>";
exit;
}
mysql_data_seek($rs,$_SESSION[qn]);
$row= mysql_fetch_row($rs);
echo "<form name=quiz method=post action=quiz.php onsubmit=return validate()>";
echo "<table width=100%> <tr> <td width=30> <td> <table border=0>";
$n=$_SESSION[qn]+1;
echo "<tR><td><span class=style2>Que ". $n .": $row[2]</style>";
echo "<tr><td class=style8><input type=radio name=ans value=1>$row[3]";
echo "<tr><td class=style8> <input type=radio name=ans value=2>$row[4]";
echo "<tr><td class=style8><input type=radio name=ans value=3>$row[5]";
echo "<tr><td class=style8><input type=radio name=ans value=4>$row[6]";
if($_SESSION[qn]<mysql_num_rows($rs)-1)
echo "<tr><td><input type=submit name=submit class='btn btn-lg btn-black' value='Next Question'></form>";
else
echo "<tr><td><input type=submit name=submit class='btn btn-lg btn-black' value='Get Result'></form>";
echo "</table></table>";
?>
</div>
</div>
This code i am using guys but problem is that the auto timer not submitting the quiz after over
Use setInterval instead of setTimeout. Because if you use setTimeout your countDown function will fire just one time.
setInterval(function() {
countDown(secs, elem)
},1500);
<?php
$i=1;
//echo '<form id="form1" name="form1" method="post" action="<?PHP $_SERVER ['PHP_SELF' ]
echo '<form>';
echo "<select name='dropdown' id=$i onchange='myFunction()'><option>Select one...</option>";
echo '<option value="horse">horse</option>';
echo '<option value="hor">hor</option>';
echo '</select>';
echo '</form>';
$i++;
echo '<form>';
echo "<select name='dropdown' id=$i onchange='myFunction()'><option>Select one...</option>";
echo '<option value="por">por</option>';
echo '<option value="voi">voi</option>';
echo '</select>';
echo '</form>';
echo '<p id="demo"></p>
<script type ="text/javascript">
function myFunction()
{
var k=2;
var x=document.getElementById(k);
var y=x.options[x.selectedIndex];
if(y){
document.cookie=\'name=\'+y.value;
alert(y.value);
}
}
</script>';
$var=$_COOKIE["name"];
echo $var;
?>