Woocommerce sorting not work - javascript

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-->

Related

Updating MySQL Row on page load

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.

How to get data to bootstrap 3 modal form using jquery

Im currently working on a project using codeigniter framework and bootstrap 3 sb admin 2 template, I have no experience about JQuery or Ajax before, now I want create an edit form to load and saving data in bootstrap modal just like this http://formvalidation.io/examples/loading-saving-data-modal/ but I keep getting this error on my console view_user:323 Uncaught ReferenceError: $ is not defined and the edit form didn't load at all. Here's and my code :
The CSS I include:
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Home">
<meta name="author" content="MGA">
<title>App | POS</title>
<!--Page Logo-->
<link rel="icon" type="images/ico" href="<?php echo base_url();?>/assets/images/logo.png">
<!-- Bootstrap Core CSS -->
<link href="<?php echo base_url();?>/assets/bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom -->
<link href="<?php echo base_url();?>/assets/bower_components/bootstrap/dist/css/mytheme.css" rel="stylesheet">
<!-- MetisMenu CSS -->
<link href="<?php echo base_url();?>/assets/bower_components/metisMenu/dist/metisMenu.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="<?php echo base_url();?>/assets/dist/css/sb-admin-2.css" rel="stylesheet">
<!-- Custom Fonts -->
<link href="<?php echo base_url();?>/assets/fontawesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<!-- DataTables CSS -->
<link href="<?php echo base_url();?>/assets/bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" rel="stylesheet">
<!-- DataTables Responsive CSS -->
<link href="<?php echo base_url();?>/assets/bower_components/datatables-responsive/css/dataTables.responsive.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js 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/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
The Code Itself :
<div class="row">
<div class="col-lg-12">
<h1 class="page-header">Daftar User</h1>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div class="panel panel-default">
<div class="panel-heading">
<ul class="nav nav-pills">
<li class="active"><a data-toggle="pill" href="#view">Lihat User</a></li>
<li><a data-toggle="pill" href="#add">Tambah Baru</a></li>
</ul>
</div>
<div class="panel-body">
<div class="tab-content">
<div id="view" class="tab-pane fade in active">
<div class="row">
<div class="col-lg-12">
<!-- /.panel-heading -->
<div class="dataTable_wrapper">
<table class="table table-striped table-bordered table-hover" id="dataTables-example">
<thead>
<tr>
<th>No.</th>
<th>ID</th>
<th>Jabatan</th>
<th>Status</th>
<th>Menu</th>
</tr>
</thead>
<tbody>
<?php
$no = 1;
foreach ($session as $row1) {
if($row1->id == "ADMIN" && $row1->jabatan_id == 1){
foreach ($user as $row) {
echo "<tr>
<td><div style='text-align:right;'>".$no.".</div></td>
<td >".$row->id."</td>
<td><div style='text-align:center;'>".$row->namajabatan."</div></td>
<td>".$row->status."</td>
<td>
<div style='text-align:center;'><a class='btn btn-primary btn-circle'><i class='fa fa-info fa-fw'></i></a> <a data-toggle='modal' data-id=".$row->id." class='edit btn btn-warning btn-circle'><i class='fa fa-pencil fa-fw'></i></a></div>
</td>
</tr>";
$no++;
}
}else{
foreach ($user as $row) {
echo "<tr>
<td><div style='text-align:right;'>".$no.".</div></td>
<td>".$row->id."</td>
<td><div style='text-align:center;'>".$row->namajabatan."</div></td>
<td>".$row->status."</td>
<td><div style='text-align:center;'><a class='btn btn-primary btn-circle'><i class='fa fa-info fa-fw'></i></a></div>
</tr>";
$no++;
}
}
}
?>
</tbody>
</table>
<!-- /.table-responsive -->
</div>
</div>
</div>
<!-- /.panel-body -->
</div>
<div id="add" class="tab-pane fade">
<?php include 'addnew.php' ?>
</div>
<?php include 'formedit.php' ?>
</div>
</div>
</div>
<!-- /.panel -->
</div>
<!-- /.col-lg-12 -->
</div>
<!-- /.row -->
</div>
<!-- /#page-wrapper -->
The formedit.php :
<script type="text/javascript">
$(document).on("click", ".open-edit", function () {
var userID = $(this).data('id');
$(".modal-body #userID").val( userID );
});
</script>
<div class="modal hide" id="edit_user">
<div class="modal-header">
<button class="close" data-dismiss="modal">×</button>
<h3>Modal header</h3>
</div>
<div class="modal-body">
<p>some content</p>
<input type="text" name="userID" id="userID" value=""/>
</div>
The Javascripts And JQueries :
<!-- jQuery -->
<script src="<?php echo base_url();?>/assets/bower_components/jquery/dist/jquery.min.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="<?php echo base_url();?>/assets/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<!-- Metis Menu Plugin JavaScript -->
<script src="<?php echo base_url();?>/assets/bower_components/metisMenu/dist/metisMenu.min.js"></script>
<!-- Custom Theme JavaScript -->
<script src="<?php echo base_url();?>/assets/dist/js/sb-admin-2.js"></script>
<!-- DataTables JavaScript -->
<script src="<?php echo base_url();?>/assets/bower_components/datatables/media/js/jquery.dataTables.min.js">
</script>
<script src="<?php echo base_url();?>/assets/bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js"></script>
<!-- Page-Level Demo Scripts - Tables - Use for reference -->
<script type="text/javascript">
$(document).ready(function() {
$('#dataTables-example').DataTable({
responsive: true
});
});
</script>
Sorry for my bad english btw :)
IDs should be unique to the page, so it would probably be cleaner to do $(#userID).val(userID). But that aside...
In terms of error view_user:323 Uncaught ReferenceError: $ is not defined likely your jQuery is not defined. Ensure that your page is loading the jQuery properly (that the file is both there, and has the code in it).
Chrome: Right click -> Inspect -> Sources
Firefox: Right Click -> Inspect Element -> Debugger -> Sources
Internet Explorer: Click -> Inspect Element -> Debugger

Twitter bootstrap tabs suddenly stopped working

It was working fine until a while ago. I did not change anything.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="">
<meta name="author" content="">
<title></title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="css/style.css">
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div class="container-fluid">
<div class="row">
<div class="col-md-12 col-sm-12 col-xs-12">
<header>
<!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active">11:00 AM</li>
<li role="presentation">4:00 PM</li>
<li role="presentation">9:00 PM</li>
</ul>
</header>
<!-- Tab panes -->
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="elevenam">
<div class="row">
<?php include_once 'elevenam.php'; ?>
</div>
</div>
<div role="tabpanel" class="tab-pane" id="fourpm">
<div class="row">
<?php include_once 'fourpm.php'; ?>
</div>
</div>
<div role="tabpanel" class="tab-pane" id="ninepm">
<div class="row">
<?php include_once 'ninepm.php'; ?>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="js/bootstrap.min.js" ></script>
</body>
</html>
Is there something wrong with twitter bootstrap??
my js used to be link
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
from their site but it stopped working so i tried the downloaded one and it still doesn't work.
I notice in their demo, it wasn't working either.
because
`https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css%22%20integri ty=%22sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7`
is no more public. Upload a file on your server and load the css from there.

Responsive joomla menu toggle button won't open

I'm using bootstrap and joomla 3 to build a template (http://lucapadovani.com/tese-beta/) and having some issues with 2 responsive navbars: when I click on the toggle buttons the menus simply do not open. I guess there might be some kind of conflict between joomla "bootstrap.framework" and other js related stuff, but all of this is quite new for me, so I'm not sure how to solve the problem. Any help? Thx.
Index.php
<?php
defined('_JEXEC') or die;
// Add JavaScript Frameworks
JHtml::_('bootstrap.framework');
// Load optional Bootstrap bugfixes
JHtmlBootstrap::loadCss($includeMaincss = true);
// Check homepage
$defaultMenu = JFactory::getApplication()->getMenu()->getDefault()->id;
$currentMenu = JFactory::getApplication()->getMenu()->getActive()->id;
if($defaultMenu == $currentMenu){
$bodyId = 'id="home"';
$homePage = true;
}else{
$bodyId = '';
$homePage = false;
}
// Logo file or site title param
if ($this->params->get('logoFile'))
{
$logo = '<img src="'. JURI::root() . $this->params->get('logoFile') .'" alt=" Tese" />';
}
?>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Include optional regions in the template -->
<?php
$this->_scripts = array();
?>
<jdoc:include type="head" />
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="<?php echo $this->baseurl ?>/media/jui/js/html5.js"></script>
<![endif]-->
<!-- Stylesheets listed below
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/general.css" type="text/css" />-->
<!-- Bootstrap styling -->
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/bootstrap.css" rel="stylesheet" media="screen">
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/custom.css" rel="stylesheet" media="screen">
<?php
// Header color
if ($this->params->get('headerColor'))
{
?>
<style type="text/css">
header{
background:<?php echo $this->params->get('headerColor');?>;
}
</style>
<?php
}
?>
<?php
// Top menu (active-item) color
if ($this->params->get('topColor'))
{
?>
<style type="text/css">
.topheader .navbar-inverse .nav .active>a,
.topheader .navbar-inverse .nav .active>a:hover,
.topheader .navbar-inverse .nav .active>a:focus {
background-color:<?php echo $this->params->get('topColor');?>;
}
</style>
<?php
}
?>
<?php
// Menu color
if ($this->params->get('menuColor'))
{
?>
<style type="text/css">
#mainnav.navbar-inverse .nav .active>a,
#mainnav.navbar-inverse .nav .active>a,
#mainnav.navbar-inverse .nav .active>a {
background-color:<?php echo $this->params->get('menuColor');?>;
}
</style>
<?php
}
?>
<script src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/js/respond.min.js"></script>
</head>
<body>
<div class="container all"><!--Page container-->
<!--===Top===-->
<div class="row topheader">
<div class="col-sm-12">
<nav class="navbar navbar-inverse" role="navigation" id="topnav">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand visible-xs" href="#">Tese</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-ex1-collapse">
<jdoc:include type="modules" name="topmenu" style="html5" />
<ul class="nav navbar-nav navbar-right">
<li><jdoc:include type="modules" name="socialnetworks" style="html5" /></li>
<li><jdoc:include type="modules" name="search" style="html5" /></li>
</ul>
</div>
</nav>
</div>
</div>
<!--===/top===-->
<!--===Header===-->
<header class="row">
<div class="col-sm-3 logo"><?php echo $logo;?></div>
<div class="col-sm-7">
<nav class="navbar navbar-inverse" role="navigation" id="mainnav">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex2-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand visible-xs" href="#">Menu</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-ex2-collapse">
<jdoc:include type="modules" name="menu" style="html5" />
</div><!-- /.navbar-collapse -->
</nav>
</div>
<div class="col-sm-2">
<jdoc:include type="modules" name="join" style="html5" />
</div>
</header>
<!--===/header===-->
<!--===Home-only layout===-->
<?php if($homePage == true): ?>
<div class="row">
<div class="col-sm-12"><jdoc:include type="modules" name="banner" style="html5" /></div>
</div>
<div class="row" id="areas">
<div class="col-sm-12"><jdoc:include type="modules" name="buttons" style="html5" /></div>
</div>
<div class="row" id="intro">
<div class="col-sm-12"><jdoc:include type="modules" name="about" style="html5" /></div>
</div>
<div class="row" id="news">
<div class="col-sm-12"><jdoc:include type="modules" name="content1" style="html5" /></div>
<div class="col-sm-12"><jdoc:include type="component" /></div>
</div>
<div class="row" id="partners">
<div class="col-sm-12"><jdoc:include type="modules" name="partners" style="html5" /></div>
</div>
<? endif; ?>
<!--===/home-only layout===-->
<!--===Page layout===-->
<?php if($homePage == false): ?>
<div class="col-sm-3 pull-right">
<jdoc:include type="modules" name="breadcrumb" style="html5" />
</div>
<!-- W/ module right: 2 columns layout -->
<?php if ($this->countModules('right')): ?>
<div class="row">
<div class="col-sm-9" id="main">
<jdoc:include type="modules" name="content1" style="html5" />
<jdoc:include type="component" />
<jdoc:include type="modules" name="content2" style="html5" />
</div>
<div class="col-sm-3" id="sidebar">
<jdoc:include type="modules" name="right" style="html5" />
</div>
</div>
<!-- Else: 1 column layout -->
<?php else : ?>
<div class="col-sm-9">
<jdoc:include type="modules" name="content1" style="html5" />
<jdoc:include type="component" />
<jdoc:include type="modules" name="content2" style="html5" />
</div>
<? endif; ?>
<? endif; ?>
<!--===/page layout===-->
<!--===Footer===-->
<footer class="row">
<div class="col-sm-9"><jdoc:include type="modules" name="footer1" style="html5" /></div>
<div class="col-sm-3"><jdoc:include type="modules" name="footer2" style="html5" /></div>
</footer>
<!--===/footer===-->
</div><!--/page container-->
<!--<script src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/js/jquery.js"></script>
<script src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/js/bootstrap.js"></script>-->
</body>
</html>
I went through the link provided by you.
There are couple of Javascript errors. That you have needed to fix.
JS Error: window.addEvent - addEvent method is undefined. Here, window.addEvent is mootool Javascript library method. I checked it, in your page, I couldn't able to find the reference of mootool library.
JS Error - autocompleter.js - "Uncaught ReferenceError: Class is not defined". This should be resolved after you will add mootools JS link.
You could find that in "media\system\js\mootools-core.js".
As, working with Jquery and mootools requires jquery-noconflict.js. You also need to take care of "jquery-noconflict.js", which you could find it in "media\jui\js\jquery-noconflict.js".
So, make sure to remove the Javascript errors to make your functionality.

Wordpress .innerHtml image

I created a wordpress theme, that is using javascript .innerHTML to insert content into certain divs. It is inserting text fine, but is not inserting images.
document.getElementById("title").innerHTML='<img src="images/header.gif"/>'
My knowledge on php is terrible but I also tried this
document.getElementById("title").innerHTML='<img src="<?php bloginfo('template_directory'); ?>/images/mainimage.jpg" title="" alt="" />';
here is index.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head profile="http://gmpg.org/xfn/11">
<title><?php bloginfo('name'); ?><?php wp_title(); ?></title>
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> <!-- leave this for stats please -->
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="alternate" type="text/xml" title="RSS .92" href="<?php bloginfo('rss_url'); ?>" />
<link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="<?php bloginfo('atom_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/javascript.js"></script>
<?php wp_get_archives('type=monthly&format=link'); ?>
<?php //comments_popup_script(); // off by default ?>
<?php wp_head(); ?>
</head>
<body onload="formatPage();">
<div id="container">
<div id="logo"></div>
<div id="title"></div>
<div id="nav"></div>
<div id="content"></div>
<div id="footer"></div>
</div>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.js"></script>
</body>
</html>
Here is javascript.js
function formatPage(){
document.getElementById("title").innerHTML='<img src="<?php bloginfo('template_directory'); ?>/images/header.gif" title="" alt="" />';
}
I understand my doctype is outdated and there may be some unneeded php in the header.
Confirm that the image path is correct. You must include that js file is in head section. That's why the pic is not getting loaded.And also move the head portion to header.php if its now in index.php.

Categories

Resources