I was using the wysihtml5-bootstrap3 editor, but the image upload and link insertion parts were stripped. So I googled and found the wysihtml5-image-upload plugin which completes the wysihtml5-bootstrap3 editor, but I don't know how should I change the front-end and serverside codes to make it work on my project.
my main page is "index.php". I have also "imagelist.php" and "upload.php" files to work with. " the image upload and link insertion parts apear in UI but when I click them the background of my page gets dark but the modal doesn't show up!"
what Should I do?? :(
And I also don't know how and where to give the right image upload path to the plugin!
Thanks for your help...
my index.php page:
<?php
//connecting to database
require_once ('db_connect.php');
$obj = new database();
?>
<!doctype html>
<html>
<head>
<title>Admin Panel</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="bootstrap3-editable/js/bootstrap-editable.js"></script>
<script src="bootstrap3-editable/js/bootstrap-editable.min.js"></script>
<script src="wysihtml5/wysihtml5.js"></script>
<script src="wysihtml5/bootstrap-wysihtml5-0.0.2/bootstrap-wysihtml5-0.0.2.min.js"></script>
<script src="wysihtml5/bootstrap-wysihtml5-0.0.2/bootstrap-wysihtml5-0.0.2.js"></script>
<script src="wysihtml5/bootstrap-wysihtml5-0.0.2/wysihtml5-0.3.0.js"></script>
<script src="wysihtml5/bootstrap-wysihtml5-0.0.2/wysihtml5-0.3.0.min.js"></script>
<script src="wysihtml5/masterBranch/bootstrap-wysihtml5.js"></script>
<link rel="stylesheet" href="wysihtml5/bootstrap-wysihtml5-0.0.2/bootstrap-wysihtml5-0.0.2.css" />
<link rel="stylesheet" href="wysihtml5/bootstrap-wysihtml5-0.0.2/wysiwyg-color.css" />
<link rel="stylesheet" href="wysihtml5/masterBranch/bootstrap-wysihtml5.css" />
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="bootstrap3-editable/css/bootstrap-editable.css" />
//image upload needed css reference => (bootstrap-combined.min.css)
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/css/bootstrap-combined.min.css" rel="stylesheet">
<link rel="stylesheet" href="css/bootstrap.min.css" />
<link rel="stylesheet" href="css/bootstrap.rtl.min.css" />
</head>
<body>
<!--header--><!--header--><!--header--><!--header--><!--header--><!--header--><!--header--><!--header--><!--header-->
<nav id="nav" class="navbar navbar" data-spy="affix" data-offset-top="60">
<ul class="nav navbar-nav navbar-right">
<?php
//****************************************************************************************************************
//***** I have a navigation menu here *****
//****************************************************************************************************************
$query="select * from tblmenu ORDER BY id DESC";
$arr_res=$obj->select($query);
foreach ($arr_res as $res){
$id=$res['id'];
$title=$res['title'];
$href=$res['href'];
//****************************************************************************************************************
//***** I use x-editable-bs3 to edit my menu elements on click *****
//****************************************************************************************************************
echo ' <li><a class="element_menu" data-url="post_menu.php" href="'.$href.'" data-type="text" data-pk="'.$id.'" data-title="نام مورد نظر را وارد کنید :" data-placement="left"> '.$title.' </a></li>';
}//fooreach
?>
<li class="active">home</li>
</ul>
</nav>
<!--header--><!--header--><!--header--><!--header--><!--header--><!--header--><!--header--><!--header--><!--header-->
<?php
$query="select * from tblsection";
$res_arr=$obj->select($query);
foreach ($res_arr as $res){
$id=$res['id'];
$heading=$res['heading'];
$text=$res['text'];
//***********************************************************************************************************
/* ***** Here I use x-editable-bs3 wysihtml5 to edit my <section> tag on click, everything works fine but the
image upload and link insert parts don't work! ***** */
//***********************************************************************************************************
echo '<h2 style="display:inline-block" class="element_heading" data-url="post_heading.php" data-type="text"
data-pk="'.$id.'" data-title="تیتر مورد نظر را وارد کنید :" data-placement="left">'.$heading.'</h2>
<section class="element_section" data-type="wysihtml5" data-pk="'.$id.'" data-placement="bottom">
<span>'.$text.'</span>
</section><hr/>';
}//foreach
?>
</body>
</html>
//***********************************************************************************************************
//here is the js code of x-editable
//***********************************************************************************************************
<script>
$(document).ready(function() {
$('.element_menu').editable('option', 'validate', function(v) {
if(!v) return 'باید مقدار دهی شود!';
});
$('.element_menu').editable();
$('.element_heading').editable();
$('.element_section').editable({
url: 'post_section.php',
title: 'متن مورد نظر را وارد کنید :'
});
});//document ready
</script>
//image upload needed js references
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.2/underscore-min.js"> </script>
<script src="wysihtml5/wysihtml5_img_upload/custom_image_and_upload_wysihtml5.js"></script>
<script src="wysihtml5/wysihtml5_img_upload/jqueryupload.js"></script>
my imagelist.php page :
<?
header('Content-type: application/json');
echo '[
{"file":"/files/images/green.jpg","caption":"This image is 50x50 and uses colors #B9E4FB and #260b50","foreground":"B9E4FB","background":"260b50"},
{"file":"/files/images/img-2.jpg"","caption":"This image is 70x70 and uses colors #6ECC43 and #00374a","foreground":"6ECC43","background":"00374a"}]';
my upload.php page :
<?
/* geneate random success or failure on file upload for demo proposal
*
*/
if (rand(0,3)>0) {
//save your file here from _FILES['file1']
$filename = basename($_FILES['file1']['name']);
move_uploaded_file($_FILES['file1']['tmp_name'], '/files/images/' . $filename);
$data = array('status' => 1,
'file'=>'/files/images/green.jpg',
'caption'=>'This image is 50x50 and uses colors #B9E4FB and #260b50',
'foreground'=>'B9E4FB',
'background'=>'260b50');
}
else {
$data = array('status' => 0);
}
header('Content-type: text/html');
echo json_encode($data);
here is an image showing what I said :
Related
I have an "uploads" folder that according to the database with php and mysql shows some videos, the problem is that in localhost it works, but when I insert the files in the file manager of the host (000webhost), the host cannot recognize the path "uploads", this is full code, the problem is in the video src at the end of the code.
<?php
require_once("config.php");
$result=' ';
$cerca=$_POST["cerca"];
$sql = "SELECT * FROM artisti WHERE nome like '%".$cerca."%'";
$result = $conn->query($sql);
if ($result->num_rows > 0)
{
//echo "<h1>Artisti trovato</h1>";
while ($row = $result->fetch_assoc()) {
$ID=$row["ID"];
$nome=$row["nome"];
$link=$row["link"];
$album=$row["album"];
//echo "<h2>ID: "."$ID"."</h2>";
//echo "nome: "."$nome"."<br>";
}
}
else {
echo "nessun artista trovato";
$conn->close();
exit;
}
?>
<!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.0">
<title>Utopia-Playlist</title>
<!--Reset css per ogni broswer-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css" integrity="sha512-NmLkDIU1C/C88wi324HBc+S2kLhi08PN5GDeUVVVC/BVt/9Izdsc9SVeVfA1UZbY3sHUlDSyRXhCzHfr6hmPPw==" crossorigin="anonymous" />
<!--Script scroll-->
<script src="https://unpkg.com/scrollreveal#4.0.0/dist/scrollreveal.min.js"></script>
<!--Icone-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" integrity="sha512-iBBXm8fW90+nuLcSKlbmrPcLa0OT92xO1BIsZ+ywDWZCvqsWgccV3gFoRBv0z+8dLJgyAHIhR35VZc2oM/gI1w==" crossorigin="anonymous" />
<!--Icona tab di google-->
<link rel="icon" href="Fulmine viola bianco.png">
<link rel="stylesheet" href="hero.css">
<link rel="stylesheet" href="nav.css">
<link rel="stylesheet" href="playlist1.css">
<style>
#import url('https://fonts.googleapis.com/css2?family=Overpass&display=swap');
</style>
</head>
<body>
<!--NavBar-->
<header class="he">
<h1 class="developers">Utopia Playlist</h1>
<nav>
<div class="listanav">
<li class="icon">Home</li>
<li>Playlist <i class="fas fa-caret-down"></i>
<ul class="submenu">
<li>Consigli</li>
<li>
Consigli-DV
</li>
<li> Top 50</li>
</ul>
</li>
<li>Contattaci</li>
</div>
</div>
</nav>
<button type="button" class="accedi">Accedi</button>
</header>
<!--Hero--> <!-- class="btn" -->
<div class="hero">
<div class="hero-cn scroll">
<p class="intro-text">ASCOLTA I NOSTRI CONSIGLI!</p>
<?php echo "<h1 class=grande-text>"."$nome"."</h1>"?>
<?php echo "<a class=btn href=$album>Scopri di più</a>" ?>
</div>
<video autoplay muted loop class="vd">
<source src="uploads/<?php echo $link?>" type="video/mp4" >
</video>
</div>
maybe there are some that you should check again:
The $link variable hasn't gotten the value it got
Placement of folders is not the same right
Check the connection whether it is connected to the hosting database or not
I am currently creating my first website and i have some trouble, i want to include a page between a navbar and a vertical bar, and i want to change to page to include when a click on a button of my vertical bar. Here is a screen :
Screen of my Website
And here is my code :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Memeable | The 1# world meme generator</title>
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="js/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<link href="css/bootstrap-social.css" rel="stylesheet">
</head>
<body>
<div >
<?php
include("head.php");
?>
</div>
</body>
Here is my head.php :
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">Memeable</a>
</div>
</div>
</nav>
<div class="vertical-menu">
Premier
Deuxième
Troisième
Quatrième
</div>
I'm sure that the solution is easy but i don't see how to do.
Thank you for your help !
To show your content in your "content area" use include. You provide the file name you want to load as an argument. Use an array to specify all the valid files you want to use, then use a $_GET parameter to select the correct sub page to load.
<?php
$files = array();
$files['home'] = 'home.php';
$files['contact'] = 'contact.php';
$files['whatever'] = 'you_want.php';
?>
Then later at the location where you want the content to be displayed use the following code:
<?php
if (isset($_GET['nav'], $files[$_GET['nav']])) {
include $files[$_GET['nav']];
} else {
include $files['home']; // default page
}
?>
To "call" the right sub page add the ?nav=... query parameter to your URLs like
<ul>
<li>Home</li>
<li>Contact</li>
</ul>
This is error showing page.i cant find any clues why showing these errors. The image file is not copying the images folder.
Notice: Undefined index: image in C:\xampp\htdocs\Project\Manpower.php on line 36
Notice: Undefined index: image in C:\xampp\htdocs\Project\Manpower.php on line 38
Warning: copy(): Filename cannot be empty in C:\xampp\htdocs\Project\Manpower.php on line 38
<?php
include_once'db_connect.php';
session_start();
$mysqli = new mysqli("localhost", "root", "", "travelagent");
if(isset($_POST['status']))
{
if (!isset($_SESSION["username"]))
{
$message = "please login!!";
echo "<script type='text/javascript'>alert('$message');</script>";
}
else
{
$id = mysqli_real_escape_string($mysqli, $_POST['id']);
$username=$_SESSION["username"];
$_SESSION['id']=$id;
$sql = "UPDATE product SET status='1' WHERE id='$id' " ;
if(mysqli_query($mysqli,$sql)==true)
{
$image_path= mysqli_real_escape_string( $mysqli ,'images/'.$_FILES['image']['name']);
if(copy($_FILES['image']['tmp_name'],$image_path))
{
$_SESSION['image']=$image_path;
$image=$_SESSION['image'];
$sql="INSERT INTO cart (user_name, product_id,image) VALUES ('$username','$id','$image')";
$result=$mysqli->query($sql);
$message = "added to cart!! ";
echo "<script type='text/javascript'>alert('$message');</script>";
session_destroy();
}
}
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Polyworld Services</title>
<meta name="Description" content="Polyworld">
<meta name="viewport" content="width:device-width" initial-scale="1">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script
src="https://code.jquery.com/jquery-2.2.4.js"
integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI="
crossorigin="anonymous"></script>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="css/full-slider.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body data-spy="scroll" data-target="#my-navbar">
<?php
include'header.php';
?>
<h1 style="text-align:center;">Welcome to Manpower page</h1>
<div class="row" id="content">
<?php
$result=$mysqli->query("SELECT * FROM product WHERE category_id='1' AND sub_category_id='1' AND status='0'" );
while($row=$result->fetch_array())
{
?>
<div class="col-md-3">
<ul>
<li>picture : <?php echo "<img src='admin/".$row['image']. "' height='200' width='200'>"; ?> </li>
<li>Name: <?php echo $row['name']; ?></li>
<li>Description :<?php echo $row['description']; ?></li>
<li >Details</li>
<form action="" method="post">
<input type="text" name="id" value="<?php echo $row['id']; ?>">
<input type="hidden" name="image" value="<?php echo $row['image']; ?>">
<li><input type="submit" name="status" value="add to cart"></li></br>
</form>
</ul>
</div>
<?php
}
?>
</div>
<?php include'footer.php'; ?>
<script type="text/javascript">
</script>
</script>
<script type="text/javascript" src="js/custom.js">
</script>
<script src="js/jquery.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</body>
</html>
Try this code to upload file
$dir="image/";//name of the folder where the file need to be copied
$file=$dir . basename($_FILES["photo"]["name"]);// where 'photo' is the field name of file input
$filetype=pathinfo($file,PATHINFO_EXTENSION);
if(move_uploaded_file($_FILES["photo"]["tmp_name"], $file)) {
echo "upload success";
}
Hey i don't understand my website doesn't work i have don't do anything so i will explain
I got a 0 in top on my page now!
Google Chrome Explorator:Screenshot
https://validator.w3.org/nu/?doc=http%3A%2F%2Fwww.wisementrade.com%2F
View/header.php: https://pastebin.com/7GqFYR75
View/homepage.php: https://pastebin.com/3htmFSmw
View/footer.php: https://pastebin.com/b3X9KScg
Controller/View.php: https://pastebin.com/cxCdcdEQ
Chrome viewer code: https://pastebin.com/Q8VYja5u
I have check the encode UTF-8 and i have re encode UTF-8 with my sublime text but nothing change ... please need help
EDIT: FIXED
I guess unclosed HTML tag cause this problerm. I found a few unclosed HTML tag in your View/header.php. Close it. try this.
<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>
<!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"/>
<!--o-->
<?php
//Session
$customer_id = $this->session->userdata('customer_id');
$user_type = $this->session->userdata('user_type');
$statement = $this->session->userdata('timezone');
?>
<!--o-->
<link rel="icon" type="image/png" href="<?php echo base_url('images/favicon.png'); ?>" />
<meta name="author" content="Wise Men Trade" />
<meta name="copyright" content="Copyright Notice ©2015 WisemenTrade Limited and licensors. All rights reserved." />
<meta name="robots" content="all" />
<!--o-->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script language="JavaScript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<!-- Bootstrap CSS -->
<link href="<?php echo base_url("css/bootstrap.min.css"); ?>" rel="stylesheet"/>
<!-- Basic CSS -->
<link href="<?php echo base_url("css/style.css"); ?>" rel="stylesheet"/>
<!-- Responsive CSS -->
<link href="<?php echo base_url("css/responsive.css"); ?>" rel="stylesheet"/>
<!-- Important Owl stylesheet -->
<link rel="stylesheet" href="<?php echo base_url("css/owl-carousel/owl.carousel.css"); ?>"/>
<!-- Default Theme -->
<link rel="stylesheet" href="<?php echo base_url("css/owl-carousel/owl.theme.css"); ?>"/>
<!-- MS DROP DOWN -->
<link rel="stylesheet" href="<?php echo base_url('css/msdropdown/flags.css'); ?>"/>
<link rel="stylesheet" href="<?php echo base_url('css/msdropdown/dd.css'); ?>"/>
<!-- Google Analytics -->
<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','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-62333409-1', 'auto');
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->
</head>
<body>
<!--top-header-->
<header>
<div class="header_block">
<!-- left -->
<div class="block_left">
<a href="<?php echo base_url(); ?>">
<img src="<?php echo base_url("images/log_wmt.png"); ?>" class="logo" width="130" height="130" alt="Logo Wise Men Trade" />
</a>
</div>
</div>
</header>
also in your Controller/View.php have a few unclosed div (<div id="container"> and <div class="block_content">). check it and close it.
the last, make sure at the end of your Controller/View.php have a :
</body> <!-- end of body -->
</html> <!-- end of html -->
According to the documentation (https://www.codeigniter.com/user_guide/general/views.html), you could load multiple views in your controller, I think it doesn't work if you load it in the view, so you should have something like this:
<?php
class Page extends CI_Controller {
public function index()
{
$data['page_title'] = 'Your title';
$this->load->view('header');
$this->load->view('menu');
$this->load->view('content', $data);
$this->load->view('footer');
}
}
I am trying to create a collapsible div (using the jQuery Mobile feature) using the data from a MYSQL database. The collapsible styles are not being applied and i cant figure out what the problem is?
possible the php script?
here's what i have
page.html
<html>
<head>
<title>My App</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="mobile-web-app-capable" content="yes">
<!-- css files -->
<!--BoilerPlate-->
<link href="css/normalize.css" rel="stylesheet" type="text/css" />
<!--<link href="css/main.css" rel="stylesheet" type="text/css" />-->
<!--end boilerplate styles-->
<!--my custom css-->
<link href="css/mainstyles.css" rel="stylesheet" type="text/css" />
<link href="css/buttons.css" rel="stylesheet" type="text/css" />
<!-- jQuery mobile js/css -->
<script src="js/jquery-3.1.1.js" type="text/javascript"></script>
<link href="js/jquery.mobile-1.4.5.css" rel="stylesheet" type="text/css" />
<!-- end of custom styles -->
<!-- END css declaration -->
</head>
<body>
<div id="canvasArea"></div>
<canvas id="cnvChart"></canvas>
<!-- JAVASCRIPT Libraries -->
<script src="chart.js/Chart.js" type="text/javascript"></script>
<script src="js/lineGraph.js" type="text/javascript"></script>
<script src="js/jquery-3.1.1.js" type="text/javascript"></script>
<script src="js/jquery.mobile-1.4.5.js" type="text/javascript"></script>
<script>
// Listen for orientation changes
window.addEventListener("orientationchange", function () {
location.reload(true);
// Announce the new orientation number
}, false);
var canvasAreaDiv = document.getElementById(
'canvasArea');
if(window.innerHeight > window.innerWidth) {
//portrait mode, so show the php script!
$(canvasAreaDiv).load("php/reflective-notes.php");
}
else {
//show the graph
showGraph();
}
</script>
</body>
script.php
$username = $_SESSION['username'];
$reflectiveMessageQuery = "SELECT date, notes FROM table WHERE
userName = '$username'";
$result = mysqli_query($conn, $reflectiveMessageQuery) or die(mysqli_error());
$count = mysqli_num_rows($result);
$rowCount = 0;
while ($row = mysqli_fetch_array($result)) {
$date = $row['date'];
$note = $row['notes'];
if($note === NULL){
$note = "no notes...";
}
echo'<div data-role="collapsible"><h1>'. $date . '</h1> <p>'.$note.'</p>'
.'</div>';
}
?>