So as you can read in my title, I am trying to Clear my Textarea after I submitted my Chat Message to my DB. I tried it several ways, like setting the value to null (""), which just lead to another problem, the Textarea gets cleared before PHP can insert the Value of the Textarea into the DB.
Here's my code:
<?php
include_once("../workspace/dbFunction.php");
//make an array for anime
$last_added = mysqli_query($mysqli,'SELECT * FROM anime ORDER BY `anime`.`created_at` DESC LIMIT 8');
$last_add = array();
while($row = mysqli_fetch_assoc($last_added)){
$last_add[] = $row;
}
//make array for anime
$data_arr = mysqli_query($mysqli,'SELECT * FROM anime');
$latestAnime = array();
while($row = mysqli_fetch_assoc($data_arr)){
$latestAnime[] = $row;
}
// Make lates episodes arr
$lat_ep = mysqli_query($mysqli,'SELECT * FROM episodes ORDER BY `created_at` DESC');
$latestEpisode = array();
while($row = mysqli_fetch_assoc($lat_ep)){
$latestEpisode[] = $row;
}
$random = $mysqli->query('SELECT * FROM anime ORDER BY RAND() LIMIT 1');
$count = 1;
?>
<?php include_once "../includes/header.inc.php"; ?>
<link rel="stylesheet" href="../css/owl.carousel.min.css">
<link rel="stylesheet" href="../css/owl.theme.default.min.css">
<link rel="stylesheet" type="text/css" href="includes/utils/chat/css/main.css">
<script >
function ajax(){
var req = new XMLHttpRequest();
req.onreadystatechange = function() {
if(req.readyState == 4 && req.status == 200){
document.getElementById('chat').innerHTML = req.responseText;
}
}
req.open('GET','includes/utils/chat/chat.php',true);
req.send();
}
setInterval(function() {ajax()}, 1000);
</script>
<style>
/* Carousel */
.owl-carousel .carousel-item-o {
background: #fff;
border: 1px solid #D9D7DA;
text-align: center;
}
.owl-carousel .carousel-item-text {
padding: 12px;
}
.owl-carousel .carousel-item-o .item-kicker {
color: #9A5053;
display: block;
font-size: .8em;
font-weight: 600;
height: 30px;
margin-bottom: 16px;
overflow: hidden;
text-transform: uppercase;
}
.owl-carousel .carousel-item-o .item-title {
color: #646464;
font-size: 1em;
font-weight: 600;
height: 38px;
margin: 0;
overflow: hidden;
}
.owl-dots {
margin-top: 40px;
text-align: center;
width: 100%;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
}
.owl-dot {
border-radius: 50px;
height: 10px;
width: 10px;
display: inline-block;
background: rgba(127, 127, 127, 0.5);
margin-left: 5px;
margin-right: 5px;
}
.owl-dot.active {
background: rgba(127, 127, 127, 1);
}
</style>
<?php include_once "../includes/nav.inc.php"; ?>
<?php include_once($_SERVER['DOCUMENT_ROOT'] . "/includes/parallax.inc.php"); ?>
<body class="elegant-color" onload="ajax();">
<div class="container-fluid" style="width:80%;">
<div class="row">
<div class="col-md-9">
<div class="col-md-12">
<div id="new_releases">
<p class="h2 text-white">Neuste Folgen</p>
<div class="row">
<?php foreach($latestEpisode as $lat_ep){ ?>
<?php foreach($latestAnime as $row) { ?>
<?php if( $lat_ep['anime_id'] == $row['id'] && $row['calender_id'] != 0){ ?>
<?php $count++; ?>
<div class="col-md-3 mb-3">
<!--Card-->
<div class="card">
<!--Card image-->
<div class="view" style="height:100%;">
<img src="<?php echo $row['img']; ?>" class="card-img-top" alt="photo">
<a href="#">
<div class="mask rgba-white-slight"></div>
</a>
</div>
<!--Card content-->
<div class="card-body">
<!--Title-->
<h4 class="card-title"><?= $lat_ep['name'] ?></h4>
<p class="text-muted m-0">Folge <?= $lat_ep['nr'] ?></p>
<span class="h6"><?= $row['name'] ?></span>
</div>
</div>
<!--/.Card-->
</div>
<?php } ?>
<?php if($count == 1){ ?>
<?php break; ?>
<?php } ?>
<?php }?>
<?php } ?>
</div>
</div>
</div>
<div class="col-md-12">
<div id="new_releases">
<p class="h2 text-white">Zuletzt Hinzugefügt</p>
<div class="row">
<?php foreach($last_add as $row) { ?>
<div class="col-md-3 mb-3">
<!--Card-->
<div class="card">
<!--Card image-->
<div class="view" style="height:100%;">
<img src="<?php echo $row['img']; ?>" class="card-img-top" alt="photo">
<a href="#">
<div class="mask rgba-white-slight"></div>
</a>
</div>
<!--Card content-->
<div class="card-body">
<!--Title-->
<h4 class="card-title"><?php if($row['su'] == 'sub'){echo $row['name'] . " Ger Sub";} elseif($row['su'] == 'dub'){ echo $row['name'] . " Ger Dub";} ?></h4>
<!--Text-->
<p class="card-text"><?php if (strlen($row['description']) > 79){ echo $str = substr($row['description'], 0, 80) . '...';}else{echo $row['description'];}; ?></p>
</div>
</div>
<!--/.Card-->
</div>
<?php } ?>
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="ibox-content elegant-color mt-2">
<div class="row elegant-color">
<div style="margin: 0 auto;" class=" col-md-12 elegant-color">
<div class="chat-discussion elegant-color">
<div class="chat-message left">
<div id="chat"></div>
</div>
</div>
</div>
</div>
</div>
<div class="row elegant-color" style="margin: 0 auto;">
<div style="margin: 0 auto;" class="col-md-12">
<iframe name="votar" style="display:none;"></iframe>
<form method="POST" id="form" target="votar">
<?php
if(isset($_SESSION['username']) && !empty($_SESSION['username'])){
echo '<textarea name="message" class="area" id="area" placeholder="Enter your message" required="" value=""></textarea>';
echo '<button type="submit" style="margin: 0 auto;" style="color: white;" class="btn btn-block btn-success w-50" name="submitbtn">Send It</button>';
} else {
echo '<center><h5 class="white-text" style="margin: 0 auto;">Please login to send messages!</h5></center>';
}
?>
</form>
</div>
</div>
<hr>
<?php include_once "../includes/sidebar.inc.php"; ?>
</div>
</div>
</div>
<?php include_once "../includes/footer.inc.php"; ?>
<?php
if(isset($_POST['submitbtn'])){
$typeOfClear = "";
$name = $_SESSION['username'];
$message = $_POST['message'];
$query = "INSERT INTO chat (name, message) VALUES ('$name','$message')";
$run = $mysqli->query($query);
if($run){
echo "<audio src='includes/utils/chat/sounds/notification.mp3' hidden='true' autoplay='true' volume='0.5'/>";
echo "<script>document.getElementById('area').value = '';</script>";
}
}
?>
<?php include_once "../js/general.script.php"; ?>
Everything works, except that the Textarea won't clear itself, and no... I don't want to redirect anywhere nor do I want to refresh the page.
Thanks to everyone that can and will help me! :)
I'm not expert in PHP, but I think setting the textarea to null after passing the value to DB should works.
Or you shouldn't add the required="" inside the textarea tag?
Related
hello i have a list of posts and i use javascript to download a post as pdf
but i have a problem because the download button works just on the first post and not in the others and when i inspect the button in the browser i can see the description below but the button not working
this is a part of my code if some one could help :
ps: the download button is : Imprimer l'offre
<li style=" border: 1px solid black; padding: 20px; margin-bottom: 30px;" <?php job_listing_class(); ?> data-longitude="<?php echo esc_attr($post->geolocation_long); ?>" data-latitude="<?php echo esc_attr($post->geolocation_lat); ?>">
<!-- <a href="<?php the_job_permalink(); ?>">
-->
<!-- <?php the_company_logo(); ?> -->
<div class="work-section">
<h3><?php wpjm_the_job_title(); ?> <?php echo "Job ID: " . $post->ID ?> </h3>
<!-- <div class="company">
<?php the_company_name('<strong>', '</strong> '); ?>
<?php the_company_tagline('<span class="tagline">', '</span>'); ?>
</div> -->
</div>
<!-- <div class="location">
<?php the_job_location(false); ?>
</div> -->
<div id="tblCustomers">
<div id="collapseExample<?php echo $post->ID ?>" class=" collapse job_description">
<?php wpjm_the_job_description(); ?>
</div>
<div id="print-btn"></div>
</div>
<center>
<div class="vc_btn3-container red-btn vc_btn3-inline" style="margin-top: 20px">
<button id="pdfview" data-target="<?php echo $post->ID ?>" style="text-align: center;">
Imprimer l’offre
</button>
<div id="pdfdiv" style="display: none;">
<?php wpjm_the_job_description(); ?>
</div>
<div id="editor"></div>
<script type="text/javascript">
var $ = jQuery.noConflict();
$(window).on('load', function() {
var doc = new jsPDF();
var specialElementHandlers = {
'#editor': function(element, renderer) {
return true;
}
};
$('#pdfview').click(function() {
doc.fromHTML($('#pdfdiv').html(), 15, 15, {
'width': 700,
'elementHandlers': specialElementHandlers
});
doc.save('file.pdf');
});
});
</script>
</div>
I want to implement this feature, the card element will turn grey color when the product_stock == 0. I tried to implement this feature using javascript but it does not work. I do not know what is wrong with my codes. Can anyone of you help me with this issue? It would be appreciated if you guys can show me examples of codes on how to solve this issue. Any help will be appreciated. Thanks!
This is my PHP codes
<?php
$sql = "SELECT * FROM (( SELECT * FROM products) as YW1
LEFT JOIN
(SELECT product_id, SUM(quantity) totalquantity FROM ordered_items GROUP BY product_id) AS YW2 ON YW1.id = YW2.product_id) ORDER BY totalquantity DESC ";
$query = $conn->query($sql);
if (!mysqli_num_rows($query)) {
echo '
<div class="col-12">
<div class="badge badge-danger">No Products Found</div>
</div>
';
} else {
while ($row = $query->fetch_assoc()) {
$product_stock = $row['product_stock'];
?>
<div class="col-lg-3 col-md-4 col-6 form-group" style="padding: 0 8px 0 8px;" >
<div class="product-wrapper" id="productlist">
<img class="product-img" loading="lazy" src="images/product-main/<?php echo $row['product_photo']; ?>" alt="">
<div class="card-body" >
<h5 class="product-title" style="min-height: 39px; text-decoration: none; width:150px; display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical; overflow: hidden; text-align: left !important;"><?php echo $row['product_title']; ?></h5>
<p class="product-price">RM<?php echo $row['product_price']; ?>/KG</p>
<p style="font-size: 10px; margin-top:-10px; margin-bottom:-2px;" ><span class="text-danger" > <?php echo $sum = $row['totalquantity'] ?? 0;?> SOLD </span></p>
<p style="font-size: 10px;" ><span class="text-success"><?php echo $row['product_stock']; ?> IN STOCK </span></p>
View More
</div>
</div>
</div>
<?php
}
}
?>
This is the javascript that i used to make the card into grey colour when the product_stock = 0
UPDATED JAVASCRIPT CODE
<script>
getfocus();
function getfocus() {
document.getElementById("productlist").focus();
var product_stock = "<?php echo $product_stock; ?>";
if(product_stock == 0) {
$(product_stock).focus();
$(product_stock).css({'border' : '1px solid red'});
$(product_stock).css("background-color", "#d0d0d0");
}
}
</script>
it's because the product_stock variable is undefined when you call it on the script.
instead of using javascript code, just add the style directly to the PHP code.
while ($row = $query->fetch_assoc()) {
$product_stock = $row['product_stock'];
?>
<div class="col-lg-3 col-md-4 col-6 form-group" style="padding: 0 8px 0 8px;" >
<div class="product-wrapper" id="productlist" style='<?php echo $product_stock == 0 ? "background-color:#d0d0d0; border:1px solid red;" : ""; ?>'>
<img class="product-img" loading="lazy" src="images/product-main/<?php echo $row['product_photo']; ?>" alt="">
<div class="card-body" >
<h5 class="product-title" style="min-height: 39px; text-decoration: none; width:150px; display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical; overflow: hidden; text-align: left !important;"><?php echo $row['product_title']; ?></h5>
<p class="product-price">RM<?php echo $row['product_price']; ?>/KG</p>
<p style="font-size: 10px; margin-top:-10px; margin-bottom:-2px;" ><span class="text-danger" > <?php echo $sum = $row['totalquantity'] ?? 0;?> SOLD </span></p>
<p style="font-size: 10px;" ><span class="text-success"><?php echo $row['product_stock']; ?> IN STOCK </span></p>
View More
</div>
</div>
</div>
<?php
}
I have below code for fetching data using Jquery/ajax from mysql database.
I have load more button in it which is working without any issue.
But i want to add Show less button also how can i add?
( Suppose displaying 12 records on each Load more click. When i click on Load more it will be 24 and it should show Show Less button also.
When a user will click on Show Less remained will be 12 and Show Less button should be hidden. and if user clicked show More button several time and show less button will work accordingly it will be hidden only when only left records are equal to 12.)
Can somebody help to add Show Less button within my code or a better code.
PHP
<div id="alldata">
<?php
$serial = 1;
$query = mysqli_query($dba, "SELECT * FROM mybooklibrary WHERE status = 1 limit 12");
while ($get_info = mysqli_fetch_array($query)) {
$eid = $get_info['id'];
$ename = $get_info['ename'];
$enames = $get_info['enames'];
$aname = $get_info['aname'];
$filename = $get_info['filename'];
//remove brackets or whatever from name of current product
$aReplace = array('(', ')', '.');
$ename_replaces = str_replace($aReplace , '', $ename);
//////////////////////////////////////////////////////////
$url_ename6 = url_making($ename_replaces);
?>
<div class="moreData" id="<?php echo $eid;?>">
<div class="sidebar">
<div class="widget widget-shop">
<div class="product">
<div class="product-image" style="width: 112px;">
<a href="author/<?php echo $url_ename6; ?>">
<img style="box-shadow: 3px 3px 3px #ccc; border-radius: 3%;" alt="" src="<?php echo $filename; ?>">
</a>
<!--<span class="product-new">NEW</span>-->
</div>
<div class="product-description">
<!--<div class="product-category">Man - <?php echo $art_id; ?></div>-->
<div class="product-titlex">
<a href="bookDetails/<?php echo $url_ename6; ?>" style="font-weight: bold; text-shadow: 3px 3px 3px #ccc;">
<?php echo $ename; ?>
</a>
<div style="width: 200%;">
<a href="bookDetails/<?php echo $url_ename6; ?>" style="color: gray;" style="">
<?php echo $enames; ?>
</a>
</div>
<hr style="min-width: 500%;">
<div>
<a href="bookDetails/<?php echo $url_ename6; ?>" class="ur1" style="font-weight: bold; float: right;">
<?php echo $aname; ?></a>
</div>
</div>
</div><hr style="border: 1px solid black; min-width: 300%;">
</div>
<!-- end: Sidebar-->
</div>
</div>
</div>
<?php $serial++; } ?>
</div>
<div id="load<?php echo $eid; ?>">
<a class="load btn btn-block" id="<?php echo $eid; ?>" >Load more</a>
</div>
get_moredata.php
<div id="alldata">
<?php
include ("includeme/db.php");
if(isset($_POST['lastid'])) {
$lastid = mysql_real_escape_string($_POST['lastid']);
$serial = 1;
$query = mysqli_query($dba, "SELECT * FROM mybooklibrary WHERE id > '".$lastid."' limit 12");
while ($get_info = mysqli_fetch_array($query)) {
$eid = $get_info['id'];
$ename = $get_info['ename'];
$enames = $get_info['enames'];
$aname = $get_info['aname'];
$filename = $get_info['filename'];
//remove brackets or whatever from name of current product
$aReplace = array('(', ')', '.');
$ename_replaces = str_replace($aReplace , '', $ename);
//////////////////////////////////////////////////////////
$url_ename6 = url_making($ename_replaces);
?>
<div class="moreData" id="<?php echo $eid;?>">
<div class="sidebar">
<div class="widget widget-shop">
<div class="product">
<div class="product-image" style="width: 112px;">
<a href="author/<?php echo $url_ename6; ?>">
<img style="box-shadow: 3px 3px 3px #ccc; border-radius: 3%;" alt="" src="<?php echo $filename; ?>">
</a>
</div>
<div class="product-description">
<div class="product-titlex">
<a href="bookDetails/<?php echo $url_ename6; ?>" style="font-weight: bold; text-shadow: 3px 3px 3px #ccc;">
<?php echo $ename; ?>
</a>
<div style="width: 200%;">
<a href="bookDetails/<?php echo $url_ename6; ?>" style="color: gray;" style="">
<?php echo $enames; ?>
</a>
</div>
<hr style="min-width: 500%;">
<div>
<a href="bookDetails/<?php echo $url_ename6; ?>" class="ur1" style="font-weight: bold; float: right;">
<?php echo $aname; ?></a>
</div>
</div>
</div><hr style="border: 1px solid black; min-width: 300%;">
</div>
</div>
</div>
</div>
<?php $serial++; } ?>
<?php } ?>
<div id="load<?php echo $eid; ?>" class="sidebar">
<hr>
<a class="load btn btn-block" id="<?php echo $eid; ?>" >Load More</a>
</div>
</div>
JQuery / Ajax
$(document).ready(function(){
$(document).on("click",".load",function(){
//var ids= $('.moreData:last').attr("id");
var ids= $(this).attr("id");
//$(".load").html('<img src="ajax-loader.gif"/>');
$.ajax({
type: 'POST',
url: 'get_moredata.php',
cache:false,
data: {'lastid':ids},
success: function(response){
//appending the result get_moredata page result with div id alldata
$('#alldata').append(response);
//remove old load more button
$('#load'+ids).remove();
if(!response) {
$('.moreData').text('No more record to load');
}
}
});
});
});
Well solved it as below:
What i did is i have made two scripts One for Load More Records and one for Load Less Records, but the get_moredata.php is the same.
And in get_moredata.php i have made 2 queries as follows:
if(isset($_POST['lastids'])) { //this id is for View Less
$lastid_less = mysql_real_escape_string($_POST['lastids']); //this id is for View Less
$query = mysqli_query($dba, "SELECT * FROM mybooklibrary WHERE id <= '".$lastid_less."'-12");
}else if(isset($_POST['lastid'])) { //this id is for View More
$lastid_more = mysql_real_escape_string($_POST['lastid']); //this id is for View More
$query = mysqli_query($dba, "SELECT * FROM mybooklibrary WHERE id > '".$lastid_more."' limit 12");
}
So it run the scripts as of the button clicked.
PHP
<div id="alldata">
<?php
$serial = 1;
$query = mysqli_query($dba, "SELECT * FROM mybooklibrary WHERE status = 1 limit 12");
while ($get_info = mysqli_fetch_array($query)) {
$eid = $get_info['id'];
$ename = $get_info['ename'];
$enames = $get_info['enames'];
$aname = $get_info['aname'];
$filename = $get_info['filename'];
//remove brackets or whatever from name of current product
$aReplace = array('(', ')', '.');
$ename_replaces = str_replace($aReplace , '', $ename);
//////////////////////////////////////////////////////////
$url_ename6 = url_making($ename_replaces);
?>
<div class="moreData" id="<?php echo $eid;?>">
<div class="sidebar">
<div class="widget widget-shop">
<div class="product">
<div class="product-image" style="width: 112px;">
<a href="author/<?php echo $url_ename6; ?>">
<img style="box-shadow: 3px 3px 3px #ccc; border-radius: 3%;" alt="" src="<?php echo $filename; ?>">
</a>
<!--<span class="product-new">NEW</span>-->
</div>
<div class="product-description">
<!--<div class="product-category">Man - <?php echo $art_id; ?></div>-->
<div class="product-titlex">
<a href="bookDetails/<?php echo $url_ename6; ?>" style="font-weight: bold; text-shadow: 3px 3px 3px #ccc;">
<?php echo $ename; ?>
</a>
<div style="width: 200%;">
<a href="bookDetails/<?php echo $url_ename6; ?>" style="color: gray;" style="">
<?php echo $enames; ?>
</a>
</div>
<hr style="min-width: 500%;">
<div>
<a href="bookDetails/<?php echo $url_ename6; ?>" class="ur1" style="font-weight: bold; float: right;">
<?php echo $aname; ?></a>
</div>
</div>
</div><hr style="border: 1px solid black; min-width: 300%;">
</div>
<!-- end: Sidebar-->
</div>
</div>
</div>
<?php $serial++; } ?>
</div>
<div id="load<?php echo $eid; ?>">
<a class="load btn btn-block" id="<?php echo $eid; ?>" >Load more</a>
</div>
get_moredata.php
<div class="alldata">
<?php
include ("inc/db.php");
include ("inc/functions.php");
if(isset($_POST['lastids'])) {
$lastid_less = mysql_real_escape_string($_POST['lastids']); //this id is for View Less
$query = mysqli_query($dba, "SELECT * FROM mybooklibrary WHERE id <= '".$lastid_less."'-12");
}else if(isset($_POST['lastid'])) {
$lastid_more = mysql_real_escape_string($_POST['lastid']); //this id is for View More
$query = mysqli_query($dba, "SELECT * FROM mybooklibrary WHERE id > '".$lastid_more."' limit 12");
}
while ($get_info = mysqli_fetch_array($query)) {
$eid = $get_info['id'];
$ename = $get_info['ename'];
$enames = $get_info['enames'];
$aname = $get_info['aname'];
//remove brackets or whatever from name of current product
$aReplace = array('(', ')', '.');
$ename_replaces = str_replace($aReplace , '', $ename);
//////////////////////////////////////////////////////////
$url_ename6 = url_making($ename_replaces);
?>
<div class="moreData" id="<?php echo $eid;?>">
<div class="sidebar">
<div class="widget widget-shop">
<div class="product">
<div class="product-image" style="width: 112px;">
<a href="author/<?php echo $url_ename6; ?>">
<?php
$exts4 = array('png','jpg','jpeg','gif');
foreach (array_unique($exts4) as $ext4) {
if (file_exists("images/titles/".$get_info['id'].".".$ext4)) {
$path4 = "images/titles/".$get_info['id'].".".$ext4;
?>
<img style="box-shadow: 3px 3px 3px #ccc; border-radius: 3%;" alt="" src="<?php echo $path4; ?>">
<?php }} ?>
</a>
</div>
<div class="product-description">
<div class="product-titlex">
<a href="bookDetails/<?php echo $url_ename6; ?>" style="font-weight: bold; text-shadow: 3px 3px 3px #ccc;">
<?php echo $ename; ?>
</a>
<div style="width: 200%;">
<a href="bookDetails/<?php echo $url_ename6; ?>" style="color: gray;" style="">
<?php echo $enames; ?>
</a>
</div>
<hr style="min-width: 500%;">
<div>
<a href="bookDetails/<?php echo $url_ename6; ?>" class="ur1" style="font-weight: bold; float: right;">
<?php echo $aname; ?></a>
</div>
</div>
</div><hr style="border: 1px solid black; min-width: 300%;">
</div>
<!-- end: Sidebar-->
</div>
</div>
</div>
<?php } ?>
<?php
if (isset($lastid_less)) {
//count if clicked on lastid_less
$queryCount = mysqli_query($dba, "SELECT * FROM mybooklibrary WHERE id <= '$lastid_less'");
echo $get_Count = mysqli_num_rows($queryCount)-12;
}else{
//count if clicked on lastid_more
$queryCount = mysqli_query($dba, "SELECT * FROM mybooklibrary WHERE id <= '$lastid_more'");
echo $get_Count = mysqli_num_rows($queryCount)+12;
}
if ($get_Count <= 12) {
?>
<!-- show this button only if books are shown are less than equal to 12 -->
<!-- because my default is 12 -->
<div id="load<?php echo $eid; ?>" class="sidebar">
<hr>
<a class="load btn btn-block" id="<?php echo $eid; ?>" >View More</a>
</div>
<?php }else{ ?>
<!-- show both buttons if books are shown greater than 12 -->
<div id="load<?php echo $eid; ?>" class="sidebar">
<hr>
<a class="load btn btn-block" id="<?php echo $eid; ?>" >View More</a>
</div>
<div id="loads<?php echo $eid; ?>" class="sidebar">
<hr>
<a class="loads btn btn-block" id="<?php echo $eid; ?>" >View Less</a>
</div>
<?php } ?>
</div>
JQuery / Ajax for Load More Records
<script>
//this query is for Load More Records
$(document).ready(function(){
$(document).on("click",".load",function(){
var ids= $(this).attr("id");
$.ajax({
type: 'POST',
url: 'get_moredata.php',
cache:false,
data: {'lastid':ids},
success: function(response){
//appending the result get_moredata page result with div id alldata
$('#alldata').append(response);
//remove old load more button
$('#load'+ids).remove();
if(!response) {
$('.moreData').text('No more record to load');
}
}
});
});
});
</script>
JQuery / Ajax for Load Less Records
<script>
//this query is for Load Less Records
$(document).ready(function(){
$(document).on("click",".loads",function(){
var ids= $(this).attr("id");
$.ajax({
type: 'POST',
url: 'get_moredata.php',
cache:false,
data: {'lastids':ids},
success: function(response){
//appending the result get_moredata page result with div id alldata
$('#alldata').append(response);
//remove old load more button
$('#loads'+ids).remove();
if(!response) {
$('.moreData').text('No more record to load');
}
}
});
});
});
</script>
I want to set the profile picture of the stores using the first letter of their store name.
Here's my blade
<?php
$smestable = DB::table('sme_table')->get();
foreach ($smestable as $s) {
$name = $s->store_name;
?>
<div class="item">
<div class="col-xs-12 col-sm-6 col-md-2">
<span id="storename">{!! $name !!}</span>
<div id="profile"></div>
<h4 class="text-center">{!! $name !!}</h4>
<h5 class="text-center">4000,00 RSD</h5>
</div>
</div>
<?php } ?>
and here's my javascript
<script type="text/javascript">
$(document).ready(function(){
var storename = $('#storename').text();
var intials = $('#storename').text().charAt(0);
var profile = $('#profile').text(intials);
});
</script>
and here's my css
#profile {
width: 150px;
height: 150px;
border-radius: 50%;
background: #512DA8;
font-size: 35px;
color: #fff;
text-align: center;
line-height: 150px;
margin: 20px 0;
}
I want to set every store's profile picture using the first letter of the store name but only one has given. Here's the result.
heres my result
If you're using Blade - do it at all.
#foreach + {{ }} instead of {!! !!}
#foreach ($smestable as $sme)
<div class="item">
<div class="col-xs-12 col-sm-6 col-md-2">
<span id="storename">{{ $sme->store_name }}</span>
<div id="profile">{{ substr($sme->store_name, 0, 1) }}</div>
<h4 class="text-center">{{ $sme->store_name }}</h4>
<h5 class="text-center">4000,00 RSD</h5>
</div>
</div>
#endforeach
As the comments suggest, you can use PHP to extract the first character, strings can be treated as arrays like so:
<div class="item">
<div class="col-xs-12 col-sm-6 col-md-2">
<span id="storename">{!! $name !!}</span>
<div id="profile">{!! strtoupper($name[0]) !!}</div>
<h4 class="text-center">{!! $name !!}</h4>
<h5 class="text-center">4000,00 RSD</h5>
</div>
</div>
You can change below line of your code :
<div id="profile"></div>
to
<div id="profile"><?php echo substr ($name , 0 ,1 ); ?></div>
This will pick the first character from name and show it at the time of rendering itself, so you will not require to do it in JS.
<?php
require_once("core/config.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><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="author" content="Slent">
<meta name="msvalidate.01" content="1A6F186BE63EEA129AB7C25BB82391D1">
<title><?php echo $nombre; ?> - Tus pixeles en buenas manos</title>
<link href="<?php echo $url; ?>media/css/origem.css" rel="stylesheet" type="text/css">
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script>
<script type="text/javascript" src="<?php echo $url; ?>media/scripts/general.js"></script>
</head>
<body>
<div id="bar_blue"></div>
<div id="banner_itens">
<div id="alinha">
<div id="space_public">
</div>
<!-- <div id="login">
<form id="form_login" action="<?php echo $url; ?>index.php#" method="post">
<div id="espaco_inputs">
<input id="user_login" type="text" placeholder="Usuario" onclick="if(this.value=='Usuario') this.value=''" onblur="if(this.value=='') this.value='Usuario'">
<input id="pass_login" type="password" placeholder="Usuário">
<div class="forget">¿Olvidó su contraseña?</div>
</div>
<div id="opcoes">
<input id="logar_s" value=" " type="submit">
<div id="cadastro"></div>
</div>
</form>
</div> -->
</div>
</div>
<div id="bar_fine">
<div style="width:1000px; margin:0pt auto;">
<div id="text"><span class="last_tweet"><!-- Carregando último tweet... --></span>
<div class="back_form">
<div id="twitter_div">
<div id="twitter_update_list">
</div>
</div>
</div></div>
</div>
</div>
<div id="menu">
<div style="width:1000px; margin:0pt auto;">
<div id="seta_right" style="cursor: pointer;"></div>
<div id="text">
<div style="width:99999px; height:auto;" id="menu_cell">
<div class="item"> Inicio </div>
<div class="item"><a rel="c_tropihabbo" href="<?php echo $url; ?>index.php#"> <?php echo $nombre; ?> </a></div>
<div class="item"> Catálogo </div>
<div class="item"><a rel="c_pixelart" href="<?php echo $url; ?>equipe"> Equipe</a></div>
<div class="item"><a rel="c_habbohotel" href="<?php echo $url; ?>habbo">Habbo</a></div>
</div>
<div id="m_tropihabbo" class="submenu_item" style="margin-top:40px; margin-left:30px;">
<li>Equipo</li>
<li>Historia</li>
</div>
<div id="m_habbohotel" class="submenu_item" style="margin-top:40px; margin-left:270px;">
<li>Habbo Hotel</li>
</div>
<div id="m_fancenter" class="submenu_item" style="margin-top:40px; margin-left:58px;">
<li>Habbo Imager</li>
<li>Generador de Memes</li>
<li>Generador de Besos</li>
</div>
<div id="m_ajuda" class="submenu_item" style="margin-top:40px; margin-left:128px;">
<li><script language="JavaScript"> function abrir(URL) { var width = 623; var height = 513; var left = 99; var top = 99; window.open(URL,'janela', 'width='+width+', height='+height+', top='+top+', left='+left+', scrollbars=no, status=no, toolbar=no, location=no, directories=no, menubar=no, resizable=no, fullscreen=no'); } </script>Contato</li>
</div>
<div id="m_opcoes" class="submenu_item" style="margin-top:40px; margin-left:200px;">
<li>Regístrate!</li>
</div>
<div id="m_pixelart" class="submenu_item" style="margin-top:40px; margin-left:-35px;">
<li>Oficina de pixel arts</li>
</div>
</div>
<div id="seta_left" style="opacity: 0.5; cursor: pointer;"></div>
</div>
</div>
<div id="bar_gray">
<div style="width:1000px; margin:0pt auto; height:121px;">
<div id="content">
<?php $lol = mysql_query("SELECT * FROM noticias LIMIT 3"); while($data = mysql_fetch_assoc($lol)){?><div id="evento">
<div id="imagem" style="background: url(<?php echo $data['imagen']; ?>) center;"></div>
<div id="titulo"><?php echo utf8_decode($data['nombre']); ?></div>
</div><?php } ?>
</div>
</div>
</div>
<div id="content_init">
<?php if($page == 'catalogo' || $page == 'panel'){?>
<style>
#item_cat {
width:222px;
height:26px;
float:left;
margin-top:1px;
background: url(<?php echo $url; ?>media/imagens/item_valores_cat.png);
}
#item_cat .titulo {
width:190px;
height:12px;
margin-top:6px;
float:left;
margin-left:3px;
font-family:Verdana;
font-size:11px;
font-weight:bold;
color:#666;
text-shadow:1px 1px #ECECEC;
text-align:left;
}
#item_cat .titulo a {
color:#666;
}
#espaco_todo {
width:681px;
height:auto;
overflow:hidden;
margin:0px auto;
}
#item_cotacao {
width:224px;
height:43px;
background: url(<?php echo $url; ?>media/imagens/item_valores.png);
float:left;
margin-right:3px; margin-top:3px;
}
#item_cotacao .imagem {
width:34px;
height:40px;
float:left;
margin-left:3px;
background-position: center;
background-repeat: no-repeat;
}
#item_cotacao .dados {
width:160px;
height:40px;
float:left;
margin-left:2px;
overflow:hidden;
}
#item_cotacao .dados .titulo {
width:160px;
height:14px;
float:left;
margin-top:3px;
font-family:Verdana;
font-size:10px;
font-weight:bold;
color:#004A5E;
text-shadow:1px 1px #FFF;
}
#item_cotacao .dados .descricao {
width:160px;
height:14px;
float:left;
font-family:Verdana;
font-size:10px;
font-weight:bold;
color:#999999;
text-shadow:1px 1px #FFF;
}
#item_cotacao .icon_up {
width:11px;
height:14px;
float:left;
margin-left:4px;
margin-top:12px;
background-repeat: no-repeat;
background: url(<?php echo $url; ?>media/imagens/icons_cotacao.png);
}
#item_cotacao .icon_down {
width:11px;
height:14px;
float:left;
margin-left:4px;
margin-top:12px;
background-repeat: no-repeat;
background: url(<?php echo $url; ?>media/imagens/icons_cotacao.png) +22px;
}
#item_cotacao .icon_stop {
width:9px;
height:10px;
float:left;
margin-left:4px;
margin-top:15px;
background-repeat: no-repeat;
background: url(<?php echo $url; ?>media/imagens/icons_cotacao.png) +10px;
}
</style>
<?php } ?>
<div id="left">
<?php if($page == 'normal' || $page == 'reglas' || $page == 'noticias'){?>
<div id="player_left">
<!-- //Cms sin nombre xD. Por MoNiKoS. !-->
<div id="items_avatar">
<div class="avatar" style="background-image: url(https://www.habbo.com.br/habbo-imaging/avatarimage?img_format=gif&user=<?php echo $radio_locutor; ?>&action=std&direction=2&head_direction=3&gesture=sml&size=s); background-position: 0px 0px; background-repeat: initial initial;"></div>
<div id="items">
<div class="locutor">
<div class="texto"><?php echo $radio_locutor; ?></div>
</div>
<div class="programa">
<div class="texto"><?php echo $radio_programa; ?></div>
</div>
</div>
<div id="outros">
<div id="botoes">
<?php if(!isset($_SESSION['radio'])){$_SESSION['radio'] = 'play';} if($_SESSION['radio'] == 'play'){ echo '<iframe src="http://tropihabbo.es/player.php" width="0" height="0" scrolling="no" frameborder="0" marginheight="0" marginwidth="0" style="margin: 0; padding: 0;" allowtransparency="true"></iframe><br />'; } ?>
<div class="play"></div>
<div class="pause"></div>
</div>
</div>
</div>
</div>
<div id="box">
<div id="content">
<div id="top">Catálogo</div>
<?php
$lolol = mysql_query("SELECT * FROM items_catalogo ORDER BY RAND() LIMIT 3");
while($data = mysql_fetch_assoc($lolol)){?>
<div id="item_valores_left">
<div class="imagem" style="background: url(<?php echo $data['imagen']; ?>) center no-repeat;"></div>
<div class="dados">
<div class="titulo"><?php echo utf8_decode($data['nombre']); ?></div>
<div class="descricao"><?php echo $data['precio']; ?></div>
</div>
<?php if($data['actual'] == '0'){?>
<div class="icon_down"></div>
<?php } elseif($data['actual'] == '1'){?>
<div class="icon_stop"></div>
<?php } elseif($data['actual'] == '2'){?>
<div class="icon_up"></div>
<?php } ?>
</div><?php } ?>
</div>
</div>
<div id="box">
<div id="content">
<div id="top">Habbo destacado</div>
<?php $lol2 = mysql_fetch_assoc(mysql_query("SELECT * FROM habbo_destacado LIMIT 1"));?>
<div id="users_highlights">
<div class="avatar" style="background: url(https://www.habbo.com.br/habbo-imaging/avatarimage?img_format=gif&user=<?php echo $lol2['nombre']; ?>&action=crr=2&direction=2&head_direction=3&gesture=sml) -10px;"></div>
<div class="dados">
<div class="habbo"><?php echo $lol2['nombre']; ?></div>
<div class="descricao"><?php echo utf8_decode($lol2['cuerpo']); ?></div>
</div>
</div>
</div>
</div>
<div id="box">
<div id="content">
<div id="top">Publicidad</div></div></div><?php }elseif($page == 'catalogo'){ ?>
<div id="box">
<div id="content">
<div id="top">Categorías</div>
<div id="item_cat">
<div style="width:26px; height:26px; float:left; background: url(<?php echo $url; ?>media/upload/valores/c9bf51af242c7599d6fcedc6f2d95faa.png) center no-repeat;"></div>
<div class="titulo">Ecotron</div>
</div>
<div id="item_cat">
<div style="width:26px; height:26px; float:left; background: url(<?php echo $url; ?>media/upload/valores/4e81c31d0917d11c3f92efc91fbff3c7.png) center no-repeat;"></div>
<div class="titulo">Furni Matic</div>
</div>
<div id="item_cat">
<div style="width:26px; height:26px; float:left; background: url(<?php echo $url; ?>media/upload/valores/1c20dc66af8c60981d8875c603621d7b.png) center no-repeat;"></div>
<div class="titulo">Galería</div>
</div>
<div id="item_cat">
<div style="width:26px; height:26px; float:left; background: url(<?php echo $url; ?>media/upload/valores/3db82150e984d679e97b967ff3464a17.png) center no-repeat;"></div>
<div class="titulo">Habbo Cambio</div>
</div>
<div id="item_cat">
<div style="width:26px; height:26px; float:left; background: url(<?php echo $url; ?>media/upload/valores/531dd47769045b3264baea26f9383116.png) center no-repeat;"></div>
<div class="titulo">Mega raros</div>
</div>
<div id="item_cat">
<div style="width:26px; height:26px; float:left; background: url(<?php echo $url; ?>media/upload/valores/50d87cd92bd4403f22fb76ec7b2e2ddf.png) center no-repeat;"></div>
<div class="titulo">Raros</div>
</div>
<!-- //Cms sin nombre xD. Por MoNiKoS. !-->
<div id="item_cat">
<div style="width:26px; height:26px; float:left; background: url(<?php echo $url; ?>media/upload/valores/b8bb1bccbd823e85b7e50249c0b3609e.png) center no-repeat;"></div>
<div class="titulo">Raros del HC</div>
</div>
<div id="item_cat">
<div style="width:26px; height:26px; float:left; background: url(<?php echo $url; ?>media/upload/valores/4782311b2736911fa77adfeddc6020ac.png) center no-repeat;"></div>
<div class="titulo">Raros edición limitada</div>
</div>
<div id="item_cat">
<div style="width:26px; height:26px; float:left; background: url(<?php echo $url; ?>media/upload/valores/76f2cc0821e9260d21b93391c6645468.png) center no-repeat;"></div>
<div class="titulo">Regalos del HC</div>
</div>
</div>
</div>
<?php }elseif($page == 'panel'){ ?>
<div id="box">
<div id="content">
<div id="top">Categorías</div>
<div id="item_cat">
<div class="titulo">Administrar noticias</div>
</div>
<div id="item_cat">
<div class="titulo">Crear noticias</div>
</div>
<div id="item_cat">
<div class="titulo">Administradores</div>
</div>
<div id="item_cat">
<div class="titulo">Administrar catálogo</div>
</div>
<!-- //Cms sin nombre xD. Por MoNiKoS. !-->
<div id="item_cat">
<div class="titulo">Editar Habbo Destacado</div>
</div>
<div id="item_cat">
<div class="titulo">Desconectarse</div>
</div>
</div>
</div>
<?php } ?>
</div>
<?php if($page == 'normal'){?>
<div id="center">
<!-- <div id="fred_inicial"></div> !-->
<?php } else {?>
<div id="center">
<?php } ?>
Hello, I have a problem with my site, it does not load layout and I don't know how to solve this error :
Failed to load resource: net :: ERR_NAME_NOT_RESOLVED
I'll be leaving my site link for you to see how you are and the code
Link:http://www.habbomania.esy.es/menu.php
The error that you are getting in console/network tab is two files not being able to load, due to an incorrect URL. The URL It's trying to goto is
http://xn--link%20do%20seu%20f%20site-6gc/media/css/origem.css
Failed to load resource: net::ERR_NAME_NOT_RESOLVED
And
http://xn--link%20do%20seu%20f%20site-6gc/media/scripts/general.js
Failed to load resource: net::ERR_NAME_NOT_RESOLVED
These are being called from
<link href="<?php echo $url; ?>media/css/origem.css" rel="stylesheet" type="text/css">
And likewise with the JS file,
<script type="text/javascript" src="<?php echo $url; ?>media/scripts/general.js"></script>
Correct the $url variable to point to the correct address for these files and then you will no longer get the error.