Updating MySQL Row on page load - javascript

so I know this is a basic question, and I've tried to search around, but everything I've found isn't really working.
Anyways, I have a system where somebody can only view a page once per day. Now, I currently have a button that can be pressed, that already updates the MySQL Row.. but obviously, they can just keep refreshing the page, and they'll have unlimited access to it.
The way it would work is, when the page is loading.. the database row will be updated, as the same it would with the button.
This is one of my first projects, so I greatly appreciate any help that is given. Below is something I already tried, but it doesn't seem to work..
Update.php
<?php
include '../view.php'
mysqli_query($con, "UPDATE `users` SET `viewedtd`=`viewedtd`+1 WHERE `username` = '$username'") or die("Please contact us.");
JS Part
<script>
$(document).ready(function(){
$.ajax({
type: "GET",
url: "inc/update.php"
success: function(data) {
//blah
}
});
});
</script>
View.php
<?php
session_start();
include 'inc/config.php';
if (!isset($_SESSION['userSession'])) {
header("Location: login.php?access=denied");
}
$query = $con->query("SELECT * FROM users WHERE uid=" . $_SESSION['userSession']);
$userRow = $query->fetch_array();
include 'inc/global-checks.php';
if (isset($_GET['reported']) && $_GET['reported'] == 'true') {
$message = '<div class="alert alert-success"><span>Thanks! Our team will review it.</span></div>';
}
$ip = mysqli_real_escape_string($con, htmlspecialchars($_SERVER['REMOTE_ADDR']));
date_default_timezone_set('America/New_York');
$date = date('Y-m-d H:i:s');
if ($userRow['viewedtd'] >= $userRow['viewlimit']) {
header("Location: membership.php?lr=true");
}
$accounts = $con->query('SELECT epc FROM gen ORDER BY RAND() LIMIT 1;');
$result = $accounts->fetch_assoc();
if (isset($_POST['generate'])) {
$username = $userRow['username'];
$generated = strip_tags($_POST['generated']);
$generated = $con->real_escape_string($generated);
if ($userRow['viewedtd'] >= $userRow['viewlimit']) {
header("Location: membership.php?lr=true");
}
$insert = mysqli_query($con, "UPDATE `users` SET `viewedtd`=`viewedtd`+1 WHERE `username` = '$username'") or die("Please contact us.");
$insert2 = mysqli_query($con, "UPDATE `users` SET `waitperiod`= '$date' WHERE `username` = '$username'") or die("Please contact us.");
}
if (isset($_POST['rba'])) {
$generated = strip_tags($_POST['generated']);
$generated = $con->real_escape_string($generated);
$insert = mysqli_query($con, "UPDATE `gen` SET `working`= 'No' WHERE `epc` = '$generated'") or die("Please contact us.");
header("Location: generator.php?reported=true");
}
?>
<!DOCTYPE html>
<html class="no-focus" lang="en">
<head>
<meta charset="utf-8">
<title>Generator - <?php echo $site_name; ?></title>
<meta name="description" content="<?php echo $description; ?>">
<meta name="author" content="<?php echo $author; ?>">
<meta name="robots" content="noindex, nofollow">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<link rel="shortcut icon" href="assets/img/favicons/favicon.png">
<link rel="icon" type="image/png" href="assets/img/favicons/favicon-16x16.png" sizes="16x16">
<link rel="icon" type="image/png" href="assets/img/favicons/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="assets/img/favicons/favicon-96x96.png" sizes="96x96">
<link rel="icon" type="image/png" href="assets/img/favicons/favicon-160x160.png" sizes="160x160">
<link rel="icon" type="image/png" href="assets/img/favicons/favicon-192x192.png" sizes="192x192">
<link rel="apple-touch-icon" sizes="57x57" href="assets/img/favicons/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="assets/img/favicons/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="assets/img/favicons/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="assets/img/favicons/apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="assets/img/favicons/apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="assets/img/favicons/apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="assets/img/favicons/apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="assets/img/favicons/apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="assets/img/favicons/apple-touch-icon-180x180.png">
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400italic,600,700%7COpen+Sans:300,400,400italic,600,700">
<link rel="stylesheet" href="assets/js/plugins/slick/slick.min.css">
<link rel="stylesheet" href="assets/js/plugins/slick/slick-theme.min.css">
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
<link rel="stylesheet" id="css-main" href="assets/css/oneui.css">
</head>
<body>
<div id="page-container" class="sidebar-l sidebar-o side-scroll header-navbar-fixed">
<nav id="sidebar">
<div id="sidebar-scroll">
<div class="sidebar-content">
<div class="side-header side-content bg-white-op">
<button class="btn btn-link text-gray pull-right hidden-md hidden-lg" type="button" data-toggle="layout" data-action="sidebar_close">
<i class="fa fa-times"></i>
</button>
<a class="h5 text-white" href="index.php">
<span class="h4 font-w600 sidebar-mini-hide"><?php echo $site_name; ?></span>
</a>
</div>
<div class="side-content">
<ul class="nav-main">
<li>
<a class="" href="index.php"><i class="si si-home"></i><span class="sidebar-mini-hide">Home</span></a>
</li>
<li>
<a class="" href="membership.php"><i class="si si-credit-card"></i><span class="sidebar-mini-hide">Membership</span></a>
</li>
<li>
<a class="active" href="generator.php"><i class="si si-refresh"></i><span class="sidebar-mini-hide">Generator</span></a>
</li>
</ul>
</div>
</div>
</div>
</nav>
<header id="header-navbar" class="content-mini content-mini-full">
<ul class="nav-header pull-right">
<li>
<div class="btn-group">
<button class="btn btn-default btn-image dropdown-toggle" data-toggle="dropdown" type="button">
<img src="assets/img/avatars/avatar10.jpg" alt="Avatar">
<span class="caret"></span>
</button>
<ul class="dropdown-menu dropdown-menu-right">
<li class="dropdown-header">Profile</li>
<li>
<a tabindex="-1" href="settings.php">
<i class="si si-settings pull-right"></i>Settings
</a>
</li>
<li class="divider"></li>
<li class="dropdown-header">Actions</li>
<li>
<a tabindex="-1" href="logout.php">
<i class="si si-logout pull-right"></i>Log out
</a>
</li>
</ul>
</div>
</li>
</ul>
</header>
<main id="main-container">
<div class="content">
<div class="row">
<div class="col-lg-4">
<div class="block block-themed">
<div class="block-header bg-danger">
<h3 class="block-title">Generator</h3>
</div>
<div class="block-content">
<div class="text-center push-10-t push-30">
<img class="img-avatar img-avatar96" src="assets/img/photos/p1.png" alt="">
</div>
<form class="form-horizontal" action="generator.php" method="post">
<div class="form-group">
<label class="col-xs-12" for="lock1-password">Random Info Below</label>
<div class="col-xs-12">
<input class="form-control" type="text" id="generated" name="generated" readonly="" value="<?php echo $result['epc'] ?>" placeholder="Click 'Generate'">
</div>
</div>
<div class="form-group">
<div class="col-xs-4">
<button class="btn btn-sm btn-danger" name="generate" type="submit"><i class="fa fa-refresh push-5-r"></i> Generate</button>
</div>
<div class="col-xs-4">
<button class="btn btn-sm btn-danger" name="rba" type="submit"><i class="si si-ban push-5-r"></i> Report Broken Account</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</main>
<?php include 'inc/footer2.php'; ?>
</div>
<script src="assets/js/core/jquery.min.js"></script>
<script src="assets/js/core/bootstrap.min.js"></script>
<script src="assets/js/core/jquery.slimscroll.min.js"></script>
<script src="assets/js/core/jquery.scrollLock.min.js"></script>
<script src="assets/js/core/jquery.appear.min.js"></script>
<script src="assets/js/core/jquery.countTo.min.js"></script>
<script src="assets/js/core/jquery.placeholder.min.js"></script>
<script src="assets/js/core/js.cookie.min.js"></script>
<script src="assets/js/app.js"></script>
<script src="assets/js/plugins/slick/slick.min.js"></script>
<script src="assets/js/plugins/chartjs/Chart.min.js"></script>
<script>
jQuery(function () {
App.initHelpers('slick');
});
</script>
<script>
$(document).ready(function(){
$.ajax({
type: "GET",
url: "inc/update.php"
success: function(data) {
alert("Page is loaded");
}
});
});
</script>
</body>
</html>
(Note; I also have include 'inc/update.php'; in my initial PHP statement on the regular page, I'm not sure if it's needed.
Update: This is the error I get when going to update.php
Parse error: syntax error, unexpected 'mysqli_query' (T_STRING) in C:\xampp\htdocs\gen\inc\update.php on line 3

There is a very basic mistake you have committed in your query.
UPDATE `users` SET `viewedtd`=+1 WHERE `username` = '$username';
should be
UPDATE `users` SET `viewedtd`=viewedtd+1 WHERE `username` = '$username'
You are constantly assigning "+1" integer to your column 'viewedtd', instead of incrementing it.

Related

Textarea returns empty value

I have a form which takes three values Roomname, Experience and Rating. This data is then submitted to a database. The issue I'm facing is through my Roomname and Rating is getting submitted perfectly, the data I enter in textarea is giving me empty result in database. I have tried every way but I'm not able to solve this issue. Only this is the issue, other code is working fine.
Please help!!!
Here is the code:
<?php
include 'db.php';
session_start();
error_reporting(0);
?>
<!DOCTYPE html>
<html>
<head>
<title>Welcome</title>
<!--Bootstrap-->
<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>
<!--User's CSS-->
<link rel="stylesheet" type="text/css" href="../css/feedback.css">
<link rel="stylesheet" type="text/css" href="../css/style.css">
<!--Fonts-->
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght#100;300&display=swap" rel="stylesheet">
<!--Font Awesome JS-->
<script src="https://use.fontawesome.com/1033686ccb.js"></script>
<!--JQuery-->
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
</head>
<body>
<header>
<?php include 'inner-navbar.php';
error_reporting(0);
?>
</header>
<div class="container">
<div id="feedback">
<h3 class="mb-5">Your Feedback</h3>
<form method="post" id="feedback-form">
<div class="row mb-3">
<label class="col-sm-6 col-form-label">Room Name: </label>
<div class="col-sm-6">
<select name="selectedRoomName" id="selectedRoomName" class="form-control">
<?php
$selectQuery="SELECT*FROM bookings where firstname='".$_SESSION['firstname']."';";
$selectQueryResult=mysqli_query($conn,$selectQuery);
if($selectQueryResult){
while($row=mysqli_fetch_assoc($selectQueryResult)){
echo '<option value="'.$row["roomName"].'">'.$row["roomName"].'</option>';
}
}
?>
</select>
</div>
</div>
<div class="row mb-4">
<label class="col-sm-6 col-form-label">Your Experience: </label>
<div class="col-sm-6">
<textarea class="form-control" placeholder="Your Experience" name="experience" id="experience"></textarea>
</div>
</div>
<div class="row mb-5">
<label class="col-sm-6 col-form-label">Your Rating: </label>
<div class="col-sm-6">
<i class="fa fa-star fa-2x" aria-hidden="true" data-index="0"></i>
<i class="fa fa-star fa-2x" aria-hidden="true" data-index="1"></i>
<i class="fa fa-star fa-2x" aria-hidden="true" data-index="2"></i>
<i class="fa fa-star fa-2x" aria-hidden="true" data-index="3"></i>
<i class="fa fa-star fa-2x" aria-hidden="true" data-index="4"></i>
</div>
</div>
<button type="submit" class="btn btn-outline-dark submit" name="submit" id="submit">Submit Feedback</button>
<?php
if(isset($_POST['rating'])){
$roomName=$_POST['selectedRoomName'];
$experience=$_POST['experience'];
$rating=$_POST['rating'];
$submitQuery="INSERT INTO feedback(roomName,experience,rating) VALUES('$roomName','$experience','$rating');";
$submitQueryRes=mysqli_query($conn,$submitQuery);
if($submitQueryRes){
echo '<script>alert("Your Feedback has been Successfully Submitted!");</script>';
}else{
echo '<script>alert("Error: '.$rating.'");</script>';
}
}
?>
</form>
</div>
</div>
</body>
<script type="text/javascript">
var selectedRoomName=$("#selectedRoomName").val();
var experience=$("#experience").val();
var rating=-1;
$(document).ready(function(){
$('.fa-star').click(function(){
rating=parseInt($(this).data('index'));
});
$('.fa-star').mouseover(function(){
resetStarColors();
var value=parseInt($(this).data('index'));
for(var i=0;i<=value;i++){
$('.fa-star:eq('+i+')').css('color','#eb9e34');
}
});
$('.fa-star').mouseleave(function(){
resetStarColors();
if(rating!=-1){
for(var i=0;i<=rating;i++){
$('.fa-star:eq('+i+')').css('color','#eb9e34');
}
}
});
function resetStarColors(){
$('.fa-star').css('color','black');
}
$("#submit").click(function(){
$.ajax({
url:'feedback.php',
method:'POST',
data:{
selectedRoomName: selectedRoomName,
experience: experience,
rating: rating
},
success: function(){
alert(experience);
}
});
});
});
</script>
</html>
Move
var selectedRoomName=$("#selectedRoomName").val();
var experience=$("#experience").val();
inside your .click() method.

jquery autocomplete suggestions come at the bottom of the page

I got a registration form where the user has to pick up one of the possible options or register his own university. For that, I thought It would be a great idea to be using jquery autocomplete functionality because it seemed pretty straight forward but here we go again.
This is the code that I'm using just for testing it out
$(document).ready(function(){
$("#name").autocomplete({
source: [
"Apple",
"Orange",
"bananna"
],
select: function(event, selectedData){
console.log(selectedData);
}
})
})
And here's the one that I am using for the actual page.
The problem that I occur is that the suggestions come at the bottom of the page instead of being weather above or below the actual input. How could I possibly display them as a dropdown below the actual input?
$(document).ready(function(){
$("#name").autocomplete({
source: [
"Apple",
"Orange",
"bananna"
],
select: function(event, selectedData){
console.log(selectedData);
}
})
})
<!--
=========================================================
* Now UI Kit - v1.3.0
=========================================================
* Product Page: https://www.creative-tim.com/product/now-ui-kit
* Copyright 2019 Creative Tim (http://www.creative-tim.com)
* Licensed under MIT (https://github.com/creativetimofficial/now-ui-kit/blob/master/LICENSE.md)
* Designed by www.invisionapp.com Coded by www.creative-tim.com
=========================================================
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="apple-touch-icon" sizes="76x76" href="http://bedford-computing.co.uk/hackathon//assets/img/apple-icon.png">
<link rel="icon" type="image/png" href="http://bedford-computing.co.uk/hackathon//assets/img/favicon.png">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title>
IUSCH | Register university
</title>
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no' name='viewport' />
<!-- Fonts and icons -->
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700,200" rel="stylesheet" />
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<!-- CSS Files -->
<link href="http://bedford-computing.co.uk/hackathon//assets/css/bootstrap.min.css" rel="stylesheet" />
<link href="http://bedford-computing.co.uk/hackathon//assets/css/now-ui-kit.css?v=1.3.0" rel="stylesheet" />
<link href="http://bedford-computing.co.uk/hackathon/assets/css/animate.css" rel="stylesheet" />
<!-- CSS Just for demo purpose, don't include it in your project -->
<link href="http://bedford-computing.co.uk/hackathon//assets/demo/demo.css" rel="stylesheet" />
</head>
<body class="login-page sidebar-collapse">
<!-- Navbar -->
<nav class="navbar navbar-expand-lg bg-primary fixed-top navbar-transparent " color-on-scroll="400">
<div class="container">
<div class="navbar-translate">
<a class="navbar-brand" href="<?php echo base_url() . 'welcome'?>">
HOME
</a>
<a class="navbar-brand" href="<?php echo base_url() . 'scenarious'?>">
SCENARIOS
</a>
<a class="navbar-brand" href="<?php echo base_url() . 'user/contact_us'?>">
CONTACT US
</a>
<button class="navbar-toggler navbar-toggler" type="button" data-toggle="collapse" data-target="#navigation" aria-controls="navigation-index" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-bar top-bar"></span>
<span class="navbar-toggler-bar middle-bar"></span>
<span class="navbar-toggler-bar bottom-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse justify-content-end" id="navigation" data-nav-image="<?php echo base_url(); ?>assets/img/blurred-image-1.jpg">
<?php if ($this->session->userdata('email') != ''): ?>
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="<?php echo base_url() . 'user/my_account'?>">My profile</a>
</li>
<li class="nav-item">
<a class="nav-link" href="<?php echo base_url() . 'user/logout'?>">Logout</a>
</li>
</ul>
<?php else: ?>
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="<?php echo base_url() . 'user'; ?>">Login</a>
</li>
<li class="nav-item">
<div class="dropdown">
<a class="nav-link" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Register
</a>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" href="<?php echo base_url() . 'register_user'?>">Student</a>
<a class="dropdown-item" href="<?php echo base_url() . 'register_uni'?>">University</a>
</div>
</div>
</li>
</ul>
<?php endif; ?>
</div>
</div>
</nav>
<!-- End Navbar -->
<div class="page-header clear-filter" >
<div class="page-header-image" style="background-image:url(http://bedford-computing.co.uk/hackathon/assets/img/uni/UoB_JimStephenson-23-WebRes.jpg)"></div>
<div class="content">
<div class="container">
<div class="col-md-4 ml-auto mr-auto">
<div class="card card-signup animated shake" data-background-color="orange" style="margin-top:10%">
<form class="form" method="post" action="<?php echo base_url(); ?>register_uni/validation">
<div class="card-header text-center">
<h3 class="card-title title-up">Register University</h3>
<div class="logo-container">
</div>
</div>
<div class="card-body">
<span class="text-danger">
<?php echo form_error('name');?>
<?php echo form_error('contact_first_name');?>
<?php echo form_error('contact_last_name');?>
<?php echo form_error('university_id');?>
</span>
<div class="input-group no-border input-lg">
<input type="text" name="name" id="name" class="form-control" placeholder="University name">
</div>
<div class="input-group no-border input-lg">
<div class="input-group-prepend">
<span class="input-group-text">
<i class="now-ui-icons users_circle-08"></i>
</span>
</div>
<input type="text" name="contact_first_name" placeholder="Contact first name" class="form-control" />
</div>
<div class="input-group no-border input-lg">
<div class="input-group-prepend">
<span class="input-group-text">
<i class="now-ui-icons users_circle-08"></i>
</span>
</div>
<input type="text" name="contact_last_name" placeholder="Contact last name" class="form-control" />
</div>
<div class="input-group no-border input-lg">
<div class="input-group-prepend">
<span class="input-group-text">
<i class="now-ui-icons users_circle-08"></i>
</span>
</div>
<input type="text" name="contact_email" placeholder="Contact email" class="form-control" />
</div>
</div>
<div class="card-footer text-center">
<input type="submit" name='register_uni' class="btn btn-neutral btn-round btn-lg">
</form>
</div>
</div>
</div>
</div>
</div>
<!-- Core JS Files -->
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> type="text/javascript"></script>
<script src="http://bedford-computing.co.uk/hackathon/assets/js/core/popper.min.js" type="text/javascript"></script>
<script src="http://bedford-computing.co.uk/hackathon/assets/js/core/bootstrap.min.js" type="text/javascript"></script>
<!-- Plugin for Switches, full documentation here: http://www.jque.re/plugins/version3/bootstrap.switch/ -->
<script src="http://bedford-computing.co.uk/hackathon/assets/js/plugins/bootstrap-switch.js"></script>
<!-- Plugin for the Sliders, full documentation here: http://refreshless.com/nouislider/ -->
<script src="http://bedford-computing.co.uk/hackathon/assets/js/plugins/nouislider.min.js" type="text/javascript"></script>
<!-- Plugin for the DatePicker, full documentation here: https://github.com/uxsolutions/bootstrap-datepicker -->
<script src="http://bedford-computing.co.uk/hackathon/assets/js/plugins/bootstrap-datepicker.js" type="text/javascript"></script>
<!-- Control Center for Now Ui Kit: parallax effects, scripts for the example pages etc -->
<script src="http://bedford-computing.co.uk/hackathon/assets/js/now-ui-kit.js?v=1.3.0" type="text/javascript"></script>
</body>
</html>
UPDATE: I've found this after a couple of hours https://bugs.jqueryui.com/ticket/8391
If you have a div with "position:fixed" and an input tag inside, the
autocomplete menu will scroll with the rest of the page. Instead, it
should stay with the input tag.
That answered my question. Admins might close it, cheers.
I've found this after a couple of hours https://bugs.jqueryui.com/ticket/8391
If you have a div with "position:fixed" and an input tag inside, the
autocomplete menu will scroll with the rest of the page. Instead, it
should stay with the input tag.

Bootstrap navigation with prettyPhoto doesn't work?

have a problem and I hope somebody helps me.
Have website 3gtrans.sk in bootstrap. It works fine but mobile navigation doesn't work on 2 pages
https://www.3gtrans.sk/nase-trasy
https://www.3gtrans.sk/galeria
As you can see on that pages are some photos (prettyPhoto). Can anybody show me what is bad please? Thank you so much.
i.e. galeria.php
<?php include "xxx.php"; ?>
<!DOCTYPE html>
<html lang="sk">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content="Galéria | 3G Trans Slovakia" />
<meta name="author" content="RoyalWEB.sk" />
<link rel="icon" href="favicon.png">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="assets/css/style.css?<?php echo date('h:i:s'); ?>">
<link rel="stylesheet" href="assets/css/font-awesome.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato%7CRaleway">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="assets/css/prettyPhoto.css" type="text/css" media="screen" title="prettyPhoto main stylesheet"/>
<script src="assets/js/jquery.prettyPhoto.js" type="text/javascript"></script>
<title>Galéria | 3G Trans Slovakia</title>
<script type="text/javascript">
$(document).ready(function(){
$("a[rel^='prettyPhoto']").prettyPhoto({
show_title: false,
social_tools: false
});
});
</script>
</head>
<body>
<header>
<nav class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse mynavbar" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav ">
<li>o nás</li>
<li>naše trasy</li>
<li>referencie</li>
<li>objednať prepravu</li>
<li><a class="active" href="galeria">galéria</a></li>
<li>kontakt</li>
</ul>
</div>
</div>
</nav>
</header>
<div class="container wrapper">
<div class="row">
<div class="col-md-12">
<h1>Galéria</h1>
<p>
<img class="img-responsive" src="images/gallery/thumb_peugeot01.jpg" alt="Peugeot Travel" /> <a href="images/gallery/peugeot02.jpg" rel="prettyPhoto[pp_gal]"><img class="img-responsive" src="images/gallery/thumb_peugeot02.jpg" alt="Peugeot Travel" />
</p>
</div>
</div>
</div>
<footer>
<div class="container copyright">
<div class="row">
<div class="col-md-12">
Copyright © <?php echo date("Y"); ?> | 3G Trans Slovakia<br />Vytvorila firma RoyalWEB.sk
</div>
</div>
</div>
</footer>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-101095120-1', 'auto');
ga('send', 'pageview');
</script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/1.0.9/cookieconsent.min.js" type="text/javascript"></script>
<script type="text/javascript">
window.cookieconsent_options = {"message":"Táto stránka využíva súbory cookies, ktoré pomáhajú k jeho správnemu fungovaniu. Využívaním našich služieb s ich používaním súhlasíte.","dismiss":"Rozumiem","learnMore":"Viac informácií","link":"https://sk.wikipedia.org/wiki/HTTP_cookie","theme":"light-bottom"};
</script>
</body>
</html>
fixed with replacing prettyphoto for another plugin.

Woocommerce sorting not work

I have installed last woocommerce plugin on my child theme.
When i change "Sort By" items on dropdown on shop page, nothing happend.
In Console view there is no any event.
JQuery works i check now,
jquery is loaded manually from footer.php like this:
<script type="text/javascript" src="/assets/plugins/jquery/jquery.min.js"></script>
and also i add this in functions.php:
function my_js() {
wp_enqueue_script( 'jquery' );
}
add_action('init', 'my_js');
Is there maybe sort with button and classic refresh?
EDIT:
this is footer.php where are scripts included:
<!-- JS Global Compulsory -->
<script type="text/javascript" src="/assets/plugins/jquery/jquery.min.js"></script>
<script type="text/javascript" src="/assets/plugins/jquery/jquery-migrate.min.js"></script>
<script type="text/javascript" src="/assets/plugins/bootstrap/js/bootstrap.min.js"></script>
<!-- JS Implementing Plugins -->
<script type="text/javascript" src="/assets/plugins/back-to-top.js"></script>
<script type="text/javascript" src="/assets/plugins/smoothScroll.js"></script>
<!-- JS Customization -->
<script type="text/javascript" src="/assets/js/custom.js"></script>
<!-- JS Page Level -->
<script type="text/javascript" src="/assets/js/app.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
App.init();
});
</script>
<!--[if lt IE 9]>
<script src="/assets/plugins/respond.js"></script>
<script src="/assets/plugins/html5shiv.js"></script>
<script src="/assets/plugins/placeholder-IE-fixes.js"></script>
<![endif]-->
header.php
<?php
global $current_user;
get_currentuserinfo();
$BASE = $_SERVER["DOCUMENT_ROOT"];
?>
<?php $base = 'https://www.example.co'; ?>
<?php
/**
* The header for our theme.
*
* Displays all of the <head> section and everything up till <div id="content">
*
* #package parallax-one
*/
?><!DOCTYPE html>
<?php parallax_hook_html_before(); ?>
<html <?php language_attributes(); ?> class="no-js">
<head>
<!--<title>Example.co - Betting system builder</title>-->
<?php parallax_hook_head_top(); ?>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="profile" href="http://gmpg.org/xfn/11">
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">
<?php parallax_hook_head_bottom(); ?>
<?php wp_head(); ?>
<!-- Favicon -->
<link rel="shortcut icon" href="favicon.ico">
<!-- Web Fonts -->
<link rel='stylesheet' type='text/css' href='//fonts.googleapis.com/css?family=Open+Sans:400,300,600&subset=cyrillic,latin'>
<!-- CSS Global Compulsory -->
<link rel="stylesheet" href="<?php echo $base ?>/assets/plugins/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="<?php echo $base ?>/assets/css/style.css">
<!-- CSS Theme -->
<link rel="stylesheet" href="<?php echo $base ?>/assets/css/theme-colors/blue.css"/>
<!-- CSS Header and Footer -->
<link rel="stylesheet" href="<?php echo $base ?>/assets/css/headers/header-default.css">
<link rel="stylesheet" href="<?php echo $base ?>/assets/css/footers/footer-v1.css">
<script src="<?php echo $base ?>/assets/plugins/jquery/jquery.min.js"></script>
<!-- CSS Implementing Plugins -->
<link rel="stylesheet" href="<?php echo $base ?>/assets/plugins/animate.css">
<link rel="stylesheet" href="<?php echo $base ?>/assets/plugins/line-icons/line-icons.css">
<link rel="stylesheet" href="<?php echo $base ?>/assets/plugins/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="<?php echo $base ?>/assets/plugins/parallax-slider/css/parallax-slider.css">
<link rel="stylesheet" href="<?php echo $base ?>/assets/plugins/owl-carousel/owl-carousel/owl.carousel.css">
<!-- CSS Page Style -->
<link rel="stylesheet" href="<?php echo $base ?>/assets/css/pages/pricing/pricing_v6.css">
<link rel="stylesheet" href="<?php echo $base ?>/assets/css/pages/pricing/pricing_v7.css">
<link rel="stylesheet" href="<?php echo $base ?>/assets/css/pages/pricing/pricing_v8.css">
<!-- CSS Customization -->
<!-- CSS Customization -->
<link rel="stylesheet" href="<?php echo $base ?>/assets/css/custom.css">
<link rel="stylesheet" href="<?php echo $base ?>/assets/css/pages/page_invoice.css">
</head>
<body itemscope itemtype="http://schema.org/WebPage" <?php body_class(); ?>
dir="<?php if (is_rtl()) echo "rtl"; else echo "ltr"; ?>">
<div class="header">
<div class="container">
<!-- Logo -->
<a class="logo" href="https://www.predictology.co">
<img src="<?php $BASE ?>/assets/img/logo1-default.png" alt="Logo">
</a>
<!-- End Logo -->
<!-- Topbar -->
<div class="topbar">
<ul class="loginbar pull-right">
<li>Join Now</li>
<li class="topbar-devider"></li>
<li>Why Predictology?</li>
<li class="topbar-devider"></li>
<li>Features</li>
<li class="topbar-devider"></li>
<li>Videos</li>
<li class="topbar-devider"></li>
<li>User Guide</li>
<li class="topbar-devider"></li>
<li>Support</li>
<li class="topbar-devider"></li>
<?php if($current_user->ID) { ?>
<li><?php echo $current_user->user_nicename; ?></li>
<li class="topbar-devider"></li>
<li>Logout</li>
<?php } else {?>
<li>Login</li>
<?php } ?>
</ul>
</div>
<!-- End Topbar -->
<!-- Toggle get grouped for better mobile display -->
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="fa fa-bars"></span>
</button>
<!-- End Toggle -->
</div><!--/end container-->
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse mega-menu navbar-responsive-collapse">
<div class="container">
<ul class="nav navbar-nav">
<!-- Shortcodes -->
<li>
<a href="/predictions">
Predictions
</a>
</li>
<!-- End Shortcodes -->
<!-- Misc Pages -->
<li>
<a href="/eloratings">
Elo Ratings
</a>
</li>
<li>
<a href="/streaks">
Streaks
</a>
</li>
<!-- Pages -->
<li>
<a href="/stats">
Statististics
</a>
</li>
<!-- End Pages -->
<!-- Pages -->
<li>
<a href="/bettrack">
Bet Tracker
</a>
</li>
<!-- End Pages -->
<li>
<i class="fa fa-unlock"></i> Join Now
</li>
<!-- End Misc Pages -->
<?php //wp_nav_menu( array( 'theme_location' => 'predictology-menu' ) ); ?>
</ul>
</div><!--/end container-->
</div><!--/navbar-collapse-->

ajax not working onclick in shopping cart

I am working with free downloaded "Ustora" template (html theme for eCommerce). In the same I am working with "Add to cart" button in the single-product page. After click it should launch a ajax function that will be insert product data into my cart table in database. But this one is not working.
I am working with this to learn make eCommerce website. Please help as earliest here is my code below.
Single-product-page.php
<?php
$row = mysql_fetch_row(mysql_query("SELECT * FROM `products` where pid='".$_GET['proid']."' "));
echo '<div class="row">
<div class="col-sm-6">
<div class="product-images">
<div class="product-main-img">
<img src="'.$row[5].'" alt="'.$row[2].'">
</div>
<div class="product-gallery">
<img src="'.$row[5].'" alt="'.$row[2].'">
<img src="'.$row[5].'" alt="'.$row[2].'">
<img src="'.$row[5].'" alt="'.$row[2].'">
</div>
</div>
</div>
<div class="col-sm-6">
<div class="product-inner">
<h2 class="product-name">'.$row[2].'</h2>
<div class="product-inner-price">
<ins>'.$row[3].'/- INR</ins> <del>'.$row[3].'/- INR</del>
</div>
<form method="post">
<div class="quantity">
<input type="number" size="4" class="input-text qty text" title="Qty" value="1" name="quantity" id="qty" min="1" step="1" max='.$row[6].'>
</div>
<button class="add_to_cart_button" onclick="addtocart('.$row[1].','.$row[2].','.$row[3].','.$buid.');">
Add to cart
</button>
</form>
<div class="product-inner-category">
<p>Category: Summer. Tags: awesome, best, sale, shoes. </p>
</div>
<div role="tabpanel">
<ul class="product-tab" role="tablist">
<li role="presentation" class="active">Description</li>
<li role="presentation">Reviews</li>
</ul>
<div class="tab-content">
<div role="tabpanel" class="tab-pane fade in active" id="home">
<h2>Product Description</h2>
'.$row[4].'
</div>
<div role="tabpanel" class="tab-pane fade" id="profile">
<h2>Reviews</h2>
<div class="submit-review">
<p><label for="name">Name</label> <input name="name" type="text"></p>
<p><label for="email">Email</label> <input name="email" type="email"></p>
<div class="rating-chooser">
<p>Your rating</p>
<div class="rating-wrap-post">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
</div>
</div>
<p><label for="review">Your review</label> <textarea name="review" id="" cols="30" rows="10"></textarea></p>
<p><input type="submit" value="Submit"></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>';
?>
Header.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Product Page - Ustora Demo</title>
<!-- Google Fonts -->
<link href='http://fonts.googleapis.com/css?family=Titillium+Web:400,200,300,700,600' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Roboto+Condensed:400,700,300' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Raleway:400,100' rel='stylesheet' type='text/css'>
<script src="jquery.js"></script>
<script type="text/javascript">
function addtocart(pid,name,price,buid)
{
alert("addToCart function working");
var pid = pid;
var pname = name;
var pprice = price;
var pqty = document.getElementById("qty").value; //$(#qty).val();
var buid = buid;
//var cstid = $(#).val();
$.ajax({
type:"POST",
url:"http://localhost/phpsales/insert-cart.php",
data:{pid,pname,pprice,pqty,buid},
cache:false,
success:alert("Product Added Successfully")
//error:function fail(){alert("Some technical error occured dufine product add to cart. Please try after some time.");}
});
}
</script>
<!-- Bootstrap -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<!-- Font Awesome -->
<link rel="stylesheet" href="css/font-awesome.min.css">
<!-- Custom CSS -->
<link rel="stylesheet" href="css/owl.carousel.css">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="css/responsive.css">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
I just want to launch addtocart() function on "Add to cart" button click and after want to insert data in shopping cart.
Thanks in advance
i think the problem is in data where you are sending data to new page
function addtocart(pid,name,price,buid)
{
alert("addToCart function working");
var pid = pid;
var pname = name;
var pprice = price;
var pqty = document.getElementById("qty").value; //$(#qty).val();
var buid = buid;
//var cstid = $(#).val();
$.ajax({
type:"POST",
url:"http://localhost/phpsales/insert-cart.php",
data:{pid,pname,pprice,pqty,buid},//here is the problem
data:{pid:pid,pname:pname,pprice:pprice,pqty:pqty,buid:build},//this must be like this
cache:false,
success:alert("Product Added Successfully")
//error:function fail(){alert("Some technical error occured dufine product add to cart. Please try after some time.");}
});
}
I think you need to put quotes around your arguments calling the addToCard() function like so:
onclick="addtocart(/''.$row[1].'/',/''.$row[2]./'',/''.$row[3].'/',/''.$buid.'/');"

Categories

Resources