Similar to how XBOX LIVE or PSN allows users to select an image/avatar from their database, how would I be able to achieve the same result using Javascript/jQuery, I used PHP to achieve this functionality, however, for further learning, I'd like to explore how this functionality could be achieved through other means (js or jQuery), my PHP code is down below:
<?php
$imageFile = "../img/avatars/";
$imageLoop = glob($imageFile. '*.*' , GLOB_BRACE);
foreach($imageLoop as $image){
echo "<label id='avatarLabel'><input type='radio' class='avatarInput' name='avatar' value='$image' >
<img src='$image' id='avatarImage'></label>";
}
?>
?>
my JQuery attempt at displaying images from folder:
$(document).ready(function(){
("body").load("imgs/");
)}
There is NO way to do it using php. Php can only process the file from POST data ad it will be located in a temp directory. At that moment there will be no data about original file folder.
Might be there are ways to do it using javascript, but it will be safety violation...
Give this a try, if I understand it correctly:
<?php
$dir = '../img/avatar/';
$loop = GLOB($dir. '*{.jpg,.png}', GLOB_BRACE); // look for only jpg and png
foreach ($loop as $image) {
$filename = basename($image); // only file name without path
echo '<input type="radio" name="avatar_register" value="' . $filename . '" required><img src="' . $image . '">';
}
?>
The numeric value of $x doesn't have any meaning and I have changed to $filename so you can locate the image with
$dir . $_POST['avatar_register'];
Since you are just selecting existing images from folder, no upload process is needed. You simply need to know which image user has picked.
I also have removed the id="" as it's inside a loop. Which means multiple ids with same value will be generated. This may cause some future problem if you are trying to locate the id from DOM
Related
I'm trying to connect to the database and view pictures from there. Despite the fact that all pictures are shown, it is not possible to download them. To download I use tag .
Here is my code.
while($row = mysqli_fetch_array($result))
{
echo '
<tr>
<td align="center">
<a href="data:image/jpeg;base64,'.base64_encode($row['Pilt'] ).'" download>
<img src="data:image/jpeg;base64,'.base64_encode($row['Pilt'] ).'" width=400 class="img-thumnail" />
</a>
</td>
</tr>
';
}
Here is a small part of the database where I get pictures. https://imgur.com/yZGsFzb . So I noticed that only one photo is being downloaded, which size is 150.4KiB.
I expect that by clicking on the image (any size) it will be downloaded. Right now when I click on image appears error like this https://imgur.com/yZrlIH8 whereas I would like to see something like this https://imgur.com/4vkUukp .
I will be very grateful for any help.
I recommend you stop printing large quantities of big images that way, they will be hardcoded in the HTML code and downloaded all at once to the browser's cache, 2 times (3 with the click included). This wastes RAM and bandwidth. The network error you get is probably caused by the abnormally big size of the href in your link (might even look a bit like malware to your browser).
Instead, you want to serve these images dynamically on a PHP script first (by setting the header to 'Content-Type: image/png' and printing the image contents as obtained from your database) and provide a direct URL to the script.
This example works just as described in your screenshots, I'm indicating where you should replace your SQL queries to obtain the image:
while(for all your rows)
{
echo '
<tr>
<td align="center">
<a href="image.php?id=' . $id . '" download>
<img src="image.php?link=' . $id . '" width=400 class="img-thumnail" />
</a>
</td>
</tr>';
}
And image.php would look something similar to:
<?php
$id = htmlspecialchars($_GET['id']);
header('Content-Type: image/png');
$content = store the image contents from the BD here ($row['Pilt'] in your code);
echo $content;
Notice that image.php serves images dynamically and I'm supposedly identifying each image with an id (perhaps your row id? You can think of more secure identifiers too if ids are not public already). This is a common security practice in PHP so that you're not providing absolute file paths or other information to attackers.
I know some HTML and CSS but zero JAVA or PHP. I would like to insert LineIt button into my functions.php in WordPress:
The code goes like this:
<img src="imgpath" alt="LINE it!" />
Unfortunately this will display only the line link without my permalink. The_Permalink will be display as text not as dynamically taken URL.
I tried to do something like this:
<img src="linkin" width="[Width of Button]" height="[Height of Button]" alt="LINE it!" />'
But of course that didn't work. Oh and I don't want to use tags <script >.
Could help?
Thanks
Here is the function in my functions.php that I'm trying to modify with custom "LineIT" button:
function show() {
$return = '<aside class="show1 show2">'
. show_content() .
'<div class="show-box">'
. apply_filters('show_filter', show_rander()) .
'<div class="show3">'
. getIcons() .
'</div></div>**<img src="linkin" width="[Width of Button]" height="[Height of Button]" alt="LINE it!" />**<div style="clear:both;"></div>'
. show_content()
. show_content2() .
'</aside>
return apply_filters('show_buttons', $return);
}
according to the document at https://codex.wordpress.org/Function_Reference/the_permalink, the the_permalink() function is usually applied in the template within The Loop. Whereas functions.php is usually provide convenient functions and register them for the future use or register in The Loop.
So put the_permalink() in functions.php might not work as what you expected.
The general template files are like home.php, page.php or category-6.php(which will provide specific template for the category with id as 6).
In these files, the Loop usually is like:
<?php
if(have_posts()){
while(have_posts():
the_post();
the_content();
?>
//here you can add the link
<img src="imgpath" alt="LINE it!" />
<?php
endwhile;
endif;?>
Please refer to this page https://codex.wordpress.org/The_Loop_in_Action for further knowledge of the loop.
if you really want to use the functions.php, I would suggest using the other function get_permalink($id) and get_the_title($id) which will get the permalink of the post by the id and add a function for it. so the function will be:
function get_line($id){
$url = get_permalink($id);
$title = get_the_title($id);
return '<img src="imgpath" alt="LINE it!" />';
}
and then call the function in The Loop of the template.
To learn more about wordpress template, please refer https://developer.wordpress.org/themes/basics/template-hierarchy/
As suggested by #lhrec_106 I have used 3rd option and modified code works like a charm. Thanks!
I have inserted function get_line($id) before my function and then simply entered
. get_line($id) inside my custom function. Button works and share via Line my dynamically generated url.
Thank you
I have a php file that's being used as a dynamic stylesheet. So its a very large file with css/values generated by php. Here's an example.
<?php
header("Content-Type: text/css");
?>
.top {
top: <?= $topValue ?>px;
}
More css...
On a separate file, i'm trying to get the generated content from the php file and store it on the page somewhere so I can get it later with javascript. So the method i'm trying is storing the contents in a hidden input. Like so.
<?php
$file = file_get_contents("FILE_URL.php");
?>
<input type="hidden" name="hidden-css" value="<?= $file ?>" />
However, when I do this, the value contains the raw php from the file and its also commenting out the opening/closing php tags. So for instance, its doing things like '< !--?php' instead of "< ?php" and "?-->" instead of "?>". This messes up the general html on the page and doesn't store the value correctly in the input.
So I ask you, how can I fix the current situation or better store the contents of the stylesheet on the page so I can later grab it and use it with javascript?
EDIT: There may also be an issue with quotes in the generated css causing issues. I'm not sure how to address this issue either.
EDIT: This is how it should be stored if everything worked perfectly.
<input type="hidden" name="hidden-css" value="
.top {
top: 54px;
}
" />
You can't use the file_get_contents() function for this purpose - it simply gets the file contents (i.e. it won't run PHP on that file first).
Instead, as user574632 suggests, you must use include and so your code would look something like this:
<input type="hidden" name="hidden-css" value="<?php include 'FILE_URL.php'; ?>" />
Hopefully that solves your problem.
(Another quick note: Given your main file is HTML not CSS, you will probably need to declare that content header again after the input like this:
<?php header('Content-Type: text/html; charset=utf-8'); ?>
)
I use a simple PHP script placed on each page of my websites to track some stats.
<?php
echo( "<img src='http://maindomain.com/stats.php?var1=" . #$_GET['var1'] . "&var2=" . #$_GET['var2'] . "&r=" . #$_SERVER['HTTP_REFERER'] . "' width='1' height='1' border='0' />" );
?>
This script works fine, once placed on domain1.com and domain2.com the file in maindomain.com/stats.php must validate the GET and register the stats.
The problem is that i also have domain3.com and this site is not PHP but simple HTML.
So i'm looking for a way to change the script in javascript, something like this:
<script src="http://maindomain.com/stat.php?var1=XXX&var2=YYY&r=HTTP_REFERER"></script>
I think this is possibile but i don't know how to pass the GET vars with js.
You could try using CSS instead of JavaScript.
If you create your stylesheet as such; style.css.php, you can execute php code in the stylesheet, and let the rest of the stylesheet just be as it already is.
Something like:
<?php
include('stats.php')
?>
html {
color: #000
}
I am using Accordion (jQuery) on my school webserver. Currently, my coding-scheme uses PHP/HTML/CSS/Javascript. I started noticing an opportunity for automation/templating when writing the entries for the Accordion modules. I write the following code:
<h3>Title</h3>
<div class="nobg">
<p class="nobg">
<!-- Entry text -->
</p>
</div>
so I am looking for pointers for the best way to template that code based on the following needs:
Adjustable parameters: Title, Content
When making new modules with a large content 'parameter', the creation of that parameter should maintain readability.
Since I am already on PHP, I was thinking maybe some sort of template function:
<? php accordion_entry("Title", "Entry Text" ?>
But the text is usually a lot of HTML: like the following:
PDF
<p>
The release date is 2007 but the pinout seems to check out (I did some small verifications with my PCB). Also, the reference documents are all valid!
</p>
I would like to write that HTML myself in the designated spot where the module will eventually manifest as a whole. Perhaps even cooler would be something like this:
<accordion-entry title="Title">
PDF
<p>
The release date is 2007 but the pinout seems to check out (I did some small verifications with my PCB). Also, the reference documents are all valid!
</p>
</accordion-entry>
I have no idea how to get started creating such a mechanism, or if it's too much trouble to bother.
I found my temporary solution, until someone comes along with something better! Please review! I am no PHP Expert!! :D
The PHP Function:
<?php
function accordionEntry($title, $entry)
{
echo '<h3>' . $title . '</h3>';
echo '<div class="nobg">';
echo ' <p class="nobg">';
echo $entry; // <!-- Entry text -->
echo ' </p>';
echo '</div>';
}
?>
The PHP function call:
<?php accordionEntry(
"GSM0107IG001 - Integration Manual",
'PDF
<p>
The release date is 2007 but the pinout seems to check out (I did some small verifications with my PCB). Also, the reference documents are all valid!
</p>');
?>
Create a partial, and load your content into it along with settings
accordian.phtml (just use .html if you want, doesn't really matter)
<accordion-entry title="<?php $title ?>">
<?php $content ?>
</accordion-entry>
page.html
<div><?= renderPartial('accordian.phtml',array(
'title'=>'GSM0107IG001 - Integration Manual',
'content' => '<p>your html</p>'
)); ?>
partial.php
function partial($partial, $settings){
//will load html from indicated file, and merge passed settings and content into place before returning all $html
// this allows the reuse of the 'partial()' function for other snippets
$template = file_get_contents($partial);
//$settings should be an array, and then your keys can be extracted as variables that match the $settings variables (such as $title) that exist in the .html partial file
extract($settings); //will assign any keys in your array, such as 'title' to php variables of the same name... so in this case $title, and $content
echo $template;
}