if(boothsizerGlobal == 3){
var cellWidth = 112;
var cellHeight = 52;
var innerDivElectricTop = 41;
var innerDivElectricLeft = 110;
$('.imgBox').css("background-image", "url(booth_top_images/5X20TOP.jpg)");
$('.imgBox').css("width", "900px");
$('.imgBox').css("height", "225px");
sidewalls = 2;
backwalls = 6;
}
Can anybody help me on converting above code into PHP?
I mean how to set CSS for a DIV in more than 40 if conditions I have?
Thanks
.imgBox
{
background:url(booth_top_images/5X20TOP.jpg) no-repeat;
width:900px;
height:225px;
}
Well, your original code made no sense to begin with as half of the declared variables weren't even being used. Furthermore, it is beyond me why you'd want to convert front-end code into server-side code like this, php is not the right way to do this!
if(boothsizerGlobal == 3){
$cellWidth = '112px';
$cellHeight = '52px';
$innerDivElectricTop = '41px';
$innerDivElectricLeft = '110px';
$backgroundImage = 'url(booth_top_images/5X20TOP.jpg)';
$divCode = '<div style="width: ' . $cellWidth . '; height: ' . $cellHeight . '; "';
return $divCode
}
Related
I have a little generator, It generate a random phone numbers and here is my code.
<?php
limit_phone = 8; //limit phone number
$randomphone = substr(str_shuffle(str_repeat("0123456789", $limit_phone)), 0, $limit_phone); //random numbers
$randomphonecomp = array('010','011','012','015'); // company
$randomphonecomp1 = array_rand($randomphonecomp);
$phonefinaal = $randomphonecomp[$randomphonecomp1] . $randomphone;
echo $phonefinaal. "<br>";
?>
What I want is, when i run this file to work more than one time, means that i want this file to generate automatically with out stop until i stop the page from the browser
You can use a loop to generate specified number of phone numbers, Don't use an infinite loop, it will kill your browser and you will not able to stop the loop.
<?php
$total_numbers = 100;
$i=1;
while($i<=$total_numbers){
$limit_phone = 8; //limit phone number
$randomphone = substr(str_shuffle(str_repeat("0123456789", $limit_phone)), 0, $limit_phone); //random numbers
$randomphonecomp = array('010','011','012','015'); // company
$randomphonecomp1 = array_rand($randomphonecomp);
$phonefinaal = $randomphonecomp[$randomphonecomp1] . $randomphone;
echo $phonefinaal. "<br>";
$i++;
}
?>
As #bcperth said, you most likely need to generate phone numbers using Javascript in the page, it could be something like this:
var divNumbers = document.getElementById("numbers")
var btnStop = document.getElementById("stop")
function generate() {
var randomphone = ""
for(var i = 0; i < 8; ++i) randomphone += Math.floor(Math.random()*10)
var randomcomp = ['010', '011', '012', '015'][Math.floor(Math.random()*4)] + ""
divNumbers.innerHTML += randomcomp + randomphone + "<br>"
}
generate() // first generated number
var intervalGen = setInterval(generate, 2000) // others generated number
function stop() {
clearInterval(intervalGen)
}
btnStop.addEventListener("click", stop)
#stop {
border: 1px solid grey;
padding: 2px 5px;
cursor: pointer;
}
<span id="stop"> STOP </span>
<div id="numbers"></div>
Documentation:
setInterval() - Web APIs | MDN
Math.random() - JavaScript | MDN
Math.floor() - JavaScript | MDN
I'm trying to convert loaded imgtags to background images using jQuery, however, the images are being loaded in a PHP while loop. When I try implementing the jQuery, only the last img tag is looked at by the jQuery. Here is my code
PHP
$query = mysqli_query($dbleads, "SELECT * FROM plugin_blog WHERE published = 1 ORDER BY date_added DESC LIMIT 0,20");
$i = 0;
$j=-1;
while ($row=mysqli_fetch_array($query)){
preg_match('/(<img[^>]+>)/i', $row['html'], $matches);
$img = $matches[1];
++$i;
if ($i%2 == 0){
++$j;
echo "<div class='masonryImage tweets' style='width:300px; height:175px;'><div class='tweet-content'>" . $tweets[$j] . "</div></div>";
}
else{
echo "<div class='masonryImage blogImage' style='width: 300px; height:200px;'>" . $img . " </div>";
}
}
jQuery
$j('div.blogImage img').each(function() {
var imageSrc = $j(this).attr('src');
$j(this).remove();
$j('.blogImage').html('<div class="backbg"></div>');
$j('.backbg').css('background-image', 'url(' + imageSrc + ')');
$j('.backbg').css('background-repeat','no-repeat');
$j('.backbg').css('background-position','center');
$j('.backbg').css('background-size','cover');
$j('.backbg').css('width','100%');
$j('.backbg').css('height','100%');
});
Any ideas?
You are setting every .backbg's css on the last iteration.
When you run $j('.backbg').css('background-image', 'url(' + imageSrc + ')'); the last time, you are saying "find EVERY .backbg, even the ones I've already done, and set their css".
You need to do something like:
var imageSrc = $j(this).attr('src');
var blogImg = $j(this).parent();
$j(this).remove();
blogImg.html('<div class="backbg"></div>');
blogImg.find('.backbg').css('background-image', 'url(' + imageSrc + ')');
I use the Sidebar Navigation Menu Professional for Magento by CODNITIVE and I am trying to make it expanded by default. Particularly I need a solution to make just the first list item expanded by default. I try to edit Navigation.php in app/code/community/codnitive/sidenav/block/:
$collapsibleClass = '';
if ($config->isCollapsible()) {
$collapsibleClass = ' collapsible';
}
// add collapsible arrow and wrraper
$arrow = '';
$extraStyle = '';
$collapsibleIconPosition = $config->getCollapsibleIconPosition();
if ($config->isCollapsible()) {
$width = $config->getCollapsibleIconType() === 'arrow' ? 8 : 16;
$height = 0;
$expanded = 0;
if ($hasActiveChildren) {
$width = $config->getCollapsibleIconType() === 'arrow' ? 8 : 16;
$height = 16;
}
if ($height == 0) {
$extraStyle = ' display:none;';
}
if ($height == 0 && $collapsibleIconPosition === 'left') {
$liMarginLeft += $width;
}
if ($this->isCategoryActive($category)) {
$expanded = 1;
}
$expanded = ' expanded="' . $expanded .'"';
$spanOnclick = 'onclick="Codnitive.expandMenu(this.parentNode)';
$spanClass = $config->getCollapsibleIconType() . '-' . $collapsibleIconPosition;
$arrow = '<span class="' . $spanClass . ' " ' . $spanOnclick . '" style="width: ' . $width . 'px; height: ' . $height . 'px;' . $extraStyle . '"></span>';
}
If I add this code to make the desired category expanded
if ($category->getId() == '35') {
$expanded = 1;
}
there appear two problems:
The category remains expanded even if another category is active.
The "plus" sign (showing that the category can be expanded) remains but it should be "minus". I guess $collapsibleIconPosition should be 'right'?
if ($height == 0 && $collapsibleIconPosition === 'left') {
$liMarginLeft += $width;
}
Try this, though i'm not sure which parent it's setting to block. I assume it's the first <li> tag above the a tag since the span tag isn't a parent
$( document ).ready(function() {
$('.nav-1').css( "display", "block" );
});
See if this is how you want it http://jsfiddle.net/6VSUm/
You want to execute that javascript anytime after (enough of) your HTML has loaded.
If your site uses jQuery, you can put it in a ready callback:
$(function(){
Codnitive.expand(document.getElementById('the-menu-parent-element-id'))
})
You can put it at the very end of your html document, or at least after all the navigation HTML code.
...
<script type="text/javascript" language="javascript">
Codnitive.expand(document.getElementById('the-menu-parent-element-id'))
</script>
</body>
Or you can put it in a onload callback. (warning: this might interfere with other javascript on your site) If there is an existing window.onload, it is safe to add it at the beginning or end of that function.
window.onload = function(){
Codnitive.expand(document.getElementById('the-menu-parent-element-id'))
}
The element you want to target is: <ul class="level0 collapsible" ...
It doesn't have a id currently, so you can't directly use getElementById().
One solution (not my favorite approach) would be to add an id
<ul id="start-open" class="level0 collapsible" ...
And then expand it:
Codnitive.expand(document.getElementById('start-open'))
I think the best solution would be to modify the HTML to do what expand would do to it:
<li class="level0 nav-1 first parent collapsible" style="margin-left: 0px;">
<span class="plus-right " onclick="Codnitive.expandMenu(this.parentNode)" style="width: 16px; height: 16px;background-position: right center"></span>
<a class="collapsible-wrapper collapse-name" onclick="Codnitive.expandMenu(this.parentNode);return false;" href="#"><span class="category_name">WANT TO BE EXPANDED BY DEFAULT</span></a>
<ul class="level0 collapsible" style="margin-left: 5px; padding-left: 10px;display: block" expanded="1">
<span class="plus-right"... gets the style="...;background-position: right center".
<ul class="level0"... gets expanded="1" and style="...;display:block"
If this doesn't work for you, it would be really helpful to see a live version of your code. (The fiddle, lacking JS and CSS isn't enough)
This is my first post, but I've been using the site for years. However, I'm stuck on what should be a fairly simple problem with pagination. I have a group of links being populated with php,
function create_pagination($page,$echo=false)
{
$max_rows = isset($_SESSION['maxListViewRows']) ? $_SESSION['maxListViewRows'] : 15;
$total_rows = isset($_SESSION['total_rows']) ? $_SESSION['total_rows'] : 1;
$pages = ceil($total_rows / $max_rows);
if( $page > $pages) $page = $pages;
$start_row = $page == 1 ? 1 : ( ($page - 1) * $max_rows ) + 1;
$rows_disp = ($start_row + $max_rows) <= $total_rows ? ($start_row + $max_rows) - 1 : $total_rows;
$facility_number_summary = 'Showing ' . $start_row . ' - ' . $rows_disp . ' of ' . $total_rows . ' rows.<br /> <p class="carapg">(MESSAGE IRRELEVANT TO THE QUESTION)</p>';
$pagination_functions = '';
for($i = 1; $i <= $pages; $i++)
{
$pagination_functions.= $i != $page ? '' . $i . ''
: '<span class="page_link" id="page_' . $i . '">' . $i . '</span>';
}
$results = array('facility_number_summary'=>$facility_number_summary, 'pagination_functions'=>$pagination_functions);
$returned = '<div id="max_left">' . $results['facility_number_summary'] . '</div>
<div id="max_right">' . $results['pagination_functions'] . '</div>
<div class="break"></div>';
if( $echo ){ echo $returned; return; }
return $returned;
}
And after that, I parse the div with jquery and compress them.
function draw_pagination(page)
{
if(page == undefined){
page = 1;
}
var postData = { 'ajax' : 'pagination',
'page' : page };
$.ajax({
type : "POST",
url : "/ajax/account.php",
data : postData,
success :
function(data){
$("#fac_results_max").html(data);
get_page_count();
}
});
}
function get_page_count()
{
var count = $("#max_right").children().length;
if( count < 11 )
return;
var content = '';
var spacer = false;
$("#max_right").children().each(
function(index)
{
if( $(this).html() > 5 && $(this).html() <= ( count - 5 ) )
{
$(this).css('display','none');
if( !spacer )
{
content += '...';
spacer = true;
}
}
else
{
content += $(this).html();
}
}
);
$("#max_right").html(content);
}
I am going to take the elements that are hidden and append them to a div that drops down so that the user can select from them. The problem I'm having is the
content += $(this).html()
It is only returning the inside of the html, as I expect it to, but I don't know what to call on it to return the actual html of the entire element referred to by 'this'. Sorry if it's a dumb question, but I'm stumped.
Thanks in advance for your responses.
Try this:
content += $(this).clone().wrap('<div>').parent().html();
AFAIK, there exists no nice way to get the contents AND the tags of the element using jQuery, so instead we clone the element, wrap it in <div> tags, bump up to the parent (the <div>) and then get its html.
WHy not just use $('#target').append($(this)); ?
If you want the whol element, and not the HTML of the first child then just use the element.
http://api.jquery.com/category/attributes/
content += $(this).parent().html();
And give the element 'this' a dummy wrapper.
Or also try, but it may be unrelated
content += $(this).contents();
I don't see any need to turn individual elements into html strings. Simply use some math and slice() method.
http://api.jquery.com/slice/
EDIT: you should actually do this before inserting the return in your ajax success. Can manipulate the returned html without needing to insert it, then insert after manipulation
Example isn't 100% fine tuned but will look something like this
function get_page_count()
{
/* cache jQuery objects when needing to search them again for efficiency*/
var $max=$("#max_right"), $kids=$max.children()
var count = $kids.length;
if( count < 11 )
return;
var $temp=$('<div/>').append( $kids.slice(0,5)).append('...').append( $kids.slice(- 5,-1));
$max.html(temp.html());
}
I've got the following code, and the stuff before the javascript echos and the stuff after the javascript includes, but the javascript won't echo :/
$currentPage = $_POST["current_page"];
$nextPage = 1 + $currentPage;
$count = $_POST["cum_count"];
$total = $_POST["cum_total"];
$progress = $_POST["cum_progress"];
echo $currentPage . $nextPage;
# number of questions less 1
$numQs[2]=6;
$numQs[3]=3;
$numQs[4]=5;
$numQs[5]=34;
$numQs[6]=17;
$numQs[7]=43;
$falses = array('false');
for ($i=0; $i < $numQs[$nextPage]; $i++) {
array_push($falses,', false');
}
# the js is how the survey keeps track of where it is
echo "<script type='text/javascript'>\n
var c_name = 'whbssurvey';\n
var c_value = '$nextPage';\n
document.cookie=c_name + '=' + c_value;\n
// set survey info\n
var count = $count;\n
var total = $total;\n
var progress = $progress;\n
var qArray = [$falses];\n
</script>";
include("$nextPage.php");
P.S. In case anyone is thinking cum_count is something dirty, it's short for cumulative.
Are you sure it's not echoing? It's being done BEFORE you do your include. If that include is a complete html page, the JS would be echoed BEFORE the opening <html> tag (which makes for an invalid page).
As well, for dumping out multiline text like that, you should either drop out of PHP mode so it's just plaintext that'll get echoed out automatically, or use a HEREDOC. Since you're inserting a couple PHP vars into that output, the HEREDOC would probably be preferable.
Try echoing without the <script> and </script> tags. It's possible that it is being printed but your browser isn't rendering it for some reason. If you get all the code spewed on the page, it worked.
try:
echo "<script type='text/javascript'>\n" .
"var c_name = 'whbssurvey';\n" .
"var c_value = '$nextPage';\n" .
"document.cookie=c_name + '=' + c_value;\n" .
"// set survey info\n" .
"var count = $count;\n" .
"var total = $total;\n" .
"var progress = $progress;\n" .
"var qArray = [$falses];\n" .
"</script>";