how to scroll an array of text? - javascript

I am currently working on a web site for a boy scout troop and I have a database of young men that have earned there eagle scout. I was wanting that data to scroll across a text widget in WordPress. I currently have the plugins to make it work I'm just struggling with the code side of it. I have some php code to send the database to my array. My current issue is getting a dynamic array from my php to my js function and then making it scroll from right to left. what would be the best way to go about this?
.php
$Eagle = array();
while($row = mysqli_fetch_array($result))
{
$Eagle[] = "#".$row[numb]." ".$row['FName']." ".$row['LName']." ".$row['Date'];
}

Concatenate your $Eagle array to a string using implode() (php docs) and put it into an <marquee> element
echo '<marquee behaviour="scroll">' . implode(' | ', $Eagle) . '</marquee>';
for more options, have a look here or here
EDIT
an alternative way of doing what you're trying to accomplisch:
echo '<marquee behaviour="scroll">';
while ($row = mysqli_fetch_array($result))
echo "#{$row[$numb]} {$row['FName']} {$row['LName']} {$row['Date']}";
echo '</marquee>';

Related

PHP altering HTML on first connection

Currently I have a php-page using include to show an html-page.
What I want to do is use a variable the php-page received when being called and project data into a field of the html-page depending on this variable. The problem is that I can't seem to pass the variable from php to html without using html to call php.
I know that I can simply echo the php-part, but because I can't echo straight into one of the html-page's divs it ends up putting the echo at the beginning or end of the page.
What I want to accomplish is for the html-page to load the php-part into one of the div's the first time the php includes the html-page. Is there any way to do such a thing?
If this isn't possible, then how do I get the javascript in the html-page to use the variable from the php-file? Is the best option really the href?
As requested some of the code:
php:
if (filter_input(INPUT_GET, "event", FILTER_SANITIZE_STRING))
{
include "../Html/EventPage.html"; //target page
$temp = filter_input(INPUT_GET, "event", FILTER_SANITIZE_STRING); //get the variable
include "../PHP/Connector.php"; //include the connection page
$value = callFunction(Connect(), $temp); //call connection page and return value
echo "<div class = 'cant select div in html'>" . $value . "</div>"; //echo value in location
}
html:
<div id = "dynamic">
this should have the php
</div>
I assume you use some code like this to display the page:
include('page.html');
A safer way would be to prevent evaluation in page.html:
echo file_get_contents('page.html', true);
You can then do any string modification you want for the content:
$replacement = 'MY REPLACEMENT';
echo str_replace('<div id="my-div">', '<div id="my-div">' . $replacement, file_get_contents('page.html', true));

Using Javascript to change style of elements in PHP

I have a problem with javascript in PHP. I want to use Javascript function to change ccs atribute display to block for only those div elements that contain certain text that is in php variable which is taken from column in MySQL table. I don't know if it is actually possible this way but here's the code:
PHP:
$sql="SELECT * FROM Filter1";
$result=$conn->query($sql);
while($row = $result->fetch_assoc()) {
$meno=$row['meno'];
echo '<script type="text/javascript"> filterTovar() </script>';
JavaScript:
function filterTovar()
{
var meno='<?php echo $meno; ?>';
var produkt=document.getElementsByClassName("tovar");
produkt.style.display="none";
for(var i=0;i<produkt.length;i++)
{
produkt[i].style.display="none";
}
for(var i=0;i<produkt.length;i++)
{
if(produkt[i].innerHTML==meno)
{
produkt[i].style.display="block";
}
}
}
I am trying to make some kind of filter that makes only certain divs shows depending on result of table but the code above doesn't work and I'm not sure if it is possible to make work this way.
MySQL table I'm taking data from:
id meno znacka cena op format
425 H81M-S2V GIGABYTE 46.03 DDR3 mATX
426 H110N GIGABYTE 83.05 DDR4 mITX
EDIT: Better explanation of my problem: User uses checkboxes to filter products on my website, in database php creates table with corresponding products. My code above is supposed to take that table and use column "meno" in which is name of product to show only those div that contain string "meno".
EDIT2: I want to ask if it is possible to change or work with elements css via DOMDocument(). If yes it would answer my question.
Yes, it is possible but there is no need to use javascript/jQuery - just use HTML and CSS.
Basically, you have your database result set and you loop through it with a while loop, right?
I guess you are constructing HTML in that while loop.
In each iteration of the loop, test your MySQL column value and add a class to the desired HTML element.
Here is an example:
$out = '<table><tbody>';
while($row = $result->fetch_assoc()) {
$theclass = ($row['something']=='hideme') ? ' hiddenTD' : '';
$out .= '<tr><td class="' .$theclass. '">' .$row['something']. '</td></tr>'
}
$out = '</tbody></table>';
echo $out;
Of course, you would have CSS defined in the document, like:
<style>
.hiddenTD{display:none;}
</style>
This is a terrible example because you can't "hide" a TD, but it's an example.

echo variable to document via button click

First time here so apologies if I'm doing something wrong.
I have the following php code:
<?php
$quoteFile = "quotes.txt"; //File holding qoutes
$fp = fopen($quoteFile, "r"); //Opens file for read
$content = fread($fp, filesize($quoteFile));
$quotes = explode("\n",$content); //Put quotes into array
fclose($fp); //Close the file
srand((double)microtime()*1000000); // randomize
$index = (rand(1, sizeof($quotes)) - 1); //Pick random qoute
?>
The code fetches a random quote from a text file by randomly choosing one of the lines of the .txt file.
I then echo out the result using:
echo $quotes[$index];
However what I want to achieve and don't seem to be able to is to have a button (html) that when clicked executes the echo $quotes[$index]; to the current page. So that each time the button is clicked it prints/echo's out a random quote from the .text file.
I did mess about with just setting a button up to refresh the page which by default made a new random quote display but it sometimes just reloaded a blank so I'm hoping someone can help me achieve this better or prompt me in the right direction. Thank tou.
You can try saving that variable into a session variable like this:
$_SESSION['quote'] = $quote['index'];
Then create an anchor element that redirects to current page:
Refresh
And print the result on the page:
<span><?php echo $_SESSION['quote']; ?></span>
To do all of this, you need to set a session. At top of your php file write:
session_start();
Hope that helps. :)
Your TXT file might have an empty line in it at the end or anywhere else. A second explanation of this, is that the way you are generating randomness is quite questionable.
Check out this simple example by W3 Schools.
$a=array("red","green","blue","yellow","brown");
$random_keys=array_rand($a,1);
echo $a[$random_keys[0]]."<br>";
The array_rand() function returns a random key from an array, or it returns an array of random keys if you specify that the function should return more than one key.
Or, simply:
<?php
$a=array("a"=>"red","b"=>"green","c"=>"blue","d"=>"yellow");
print_r(array_rand($a,1));
?>
Full Post: http://www.w3schools.com/php/func_array_rand.asp
Happy coding !

Wordpress and DD's Ultimate Fade-in Slideshow: Code Doesn't Scroll Through Thumbnails

I am trying to use a Wordpress loop (of a certain category) to pull featured images, links, and excerpts and populate the Ultimate Fade in Slideshow JS. The code outputs the correct format, syntax, and shows the links to the two posts correctly. However, this code is not looping through the featured images. It seems to fade between the same image twice.
There are currently two posts in this specific category, both with images set as the featured. Each post also has an excerpt.
All documents (fadeslideshow.js and jQuery) are linked correctly in the header and upon watching the code using Safari's web inspector - the dynamic drive script shows the transparency changing - it is just switching between the same image so it appears that nothing is happening.
The code below is in a separate .php document that is called in the header.
<script type="text/javascript">
<?php query_posts('cat=7'); ?> //queries posts only from featured category
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
var mygallery=new fadeSlideShow({
wrapperid: "fadeshow", //ID of blank DIV on page to house Slideshow
dimensions: [585, 350], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
<?php $thumbnails = get_posts('posts_per_page=5'); //adding category=7 here breaks code
$my_excerpt = get_the_excerpt();
$url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );
$total = count($thumbnails); //this is to count the number of thumbnails in foreach loop to NOT add a comma to the last one
$i=1;
foreach ($thumbnails as $thumbnail) {
if ( has_post_thumbnail($thumbnail->ID)) {
$i++;
echo '["'.$url.'","'.get_permalink( $thumbnail->ID ).'","","'.$my_excerpt.'"]'; //This spits out the exact correct code
if ($i != $total) { echo', '; }//this is to count the number of thumbnails in foreach loop to NOT add a comma to the last one
}} ?>
],
displaymode: {type:'auto', pause:3000, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: ""
})
<?php endwhile; endif; ?> //This ends the wordpress loop
<?php wp_reset_query(); ?>
</script>
Dynamic Drive's Ultimate Fade in Slide show information is here: http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm
My code is on this website: http://johnharvey.hsjjr.net
I've also tried to use wp_get_attachment_image_src without success.
I have thoroughly searched on Google, the Dynamic Drive forums, and the Wordpress Codex without finding anything else to try. I believe perhaps I am not informed enough about what is going wrong to know what else to search for. I believe there is a reasonably simple solution to this, I simply do not have the experience to know what is going wrong.
Thank you all so much for you help and knowledge!
Not entirely sure why this worked - but I solved the problem. Instead of defining the variables above the foreach loop, I moved it down into the loop:
<?php $thumbnails = get_posts('posts_per_page=5'); //adding category=7 here breaks code
$total = count($thumbnails); //this is to count the number of thumbnails in foreach loop to NOT add a comma to the last one
$i=1;
foreach ($thumbnails as $thumbnail) {
if ( has_post_thumbnail($thumbnail->ID)) {
$i++;
echo '["'.wp_get_attachment_url( get_post_thumbnail_id($thumbnail->ID) ).'","'.get_permalink( $thumbnail->ID ).'","","'.get_the_excerpt($thumbnail->ID).'"]'; //This spits out the exact correct code
if ($i != $total) { echo', '; }//this is to count the number of thumbnails in foreach loop to NOT add a comma to the last one
}
}
?>
The except still does not cycle through, but at least the thumbnails do.

How would I create a news system?

I have a database where I can create a news article through PHPMyAdmin with the fields: "Name of the article", "Content", "Writer".
I have already made a "latest news" system, which looks like this:
$result = mysql_query("SELECT * FROM news LIMIT 5");
if(mysql_num_rows($result) > 0)
{
while($row = mysql_fetch_array($result))
{
echo $row['Namn'];
echo " av ";
echo $row['Skribent'];
echo "<br />";
}
}
mysql_close($con);
?>
And that is the latest news system (skribent means = writer), (namn means = name (of the article), (av means = by),.
So, now I have two problems. Once these news are displayed, I want them to be clickable and once you click it, you get to the original page where the article is located, how do I do it?
And, how do I do so that when I insert a query it will automatically create a nice page for every article, like most famous sites have. When they create a news it comes like http://google.com/news/how-to-be-a-dork/
Firstly to link articles to a different page you could use the element's onclick method, and use javascript to redirect the user, or you could add <a> tag around the article element.
Secondly, if you would like pretty urls you will have to read up on url re-writing, I unfortunately don't know much about it.

Categories

Resources