Skip to content
WJunction - Webmaster Forum
Register

Jquerymobile and PHP

Status
Not open for further replies.
I

iobit

Active Member
338
2010
18
10
Hello,
i'm very new in programming lenguage, and i create a gallery with jquerymobile! but now i have a problem, i have many images and is impossible create address line by line..... And i fuond this solution, for load images from directory:


index.html

Code: 
<div data-role="content">
    
        <ul data-role="listview" data-inset="true">
        

        <li><a href="/mobile/gallery.php"> [COLOR=Red]<----- this is my call script[/COLOR]
                <img src="../../mobile/backicon/panorama.jpg">
                <h2>Panorama</h2>
                <p>Click To See The Panorama Images</p>
                <p class="ui-li-aside">Panorama Images</p>
            </a>
gallery1.html
Code: 
     <!DOCTYPE html> 
<html> 
    <head> 
        <title>Gallery</title> 
        <meta name="viewport" content="width=device-width, initial-scale=1" /> 
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
        <link rel="stylesheet" href="css/style.css" />        
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
        <script type="text/javascript" src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
        <script type="text/javascript" src="js/script.js"></script>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></head> 
    <body>
        <div data-role="page" class="page gallery-page">
            <div data-role="header">
                <!--<a href="gallery.html" data-icon="arrow-l" data-rel="back" data-direction="reverse">Back</a>-->
                <a href="index.html" data-icon="home" data-direction="reverse">Home</a>
                <h1>PANORAMA</h1>
            </div><!--/header-->
            <div data-role="content" class="full-width">
            <ul class="gallery three-column-gallery" id="gallery">
            
            
    <script>        
<?php

$directory = "/[COLOR=Red]images[/COLOR]/";


if (is_dir($directory)) {

    if ($directory_handle = opendir($directory)) {

        while (($file = readdir($directory_handle)) !== false) {


            if((!is_dir($file))&($file!=".")&($file!=".."))
                echo "<li><a href=\"[COLOR=Red]images[/COLOR]".$file."\"><img src=\"/[COLOR=Red]http://www.wjunction.com/images/thumbs_[/COLOR]".$file."\" alt=\"Image 01\" /></a></li>";
        }

        closedir($directory_handle);
    }
}
?> 
            </script>                 
                    
                    
                    
            </div><!-- /content -->

        </div><!-- /page -->
        
        
    </body>
</html>
but when i click on gallery for load image i have a blank page.

Where wrong?

Thanks.
 
Last edited:

8 comments

i have edit post and i change gallery.html in gallery1.html.
i have in my root/site-dir index.html gallery1.html and gallery.php
I also tried to change the name from index.html to index.php, but the problem dont solve.

if you want i send link for see the live site.

Thanks for your patience.
 
First of all enable error reporting whenever you are testing your code.

Now 2 things are coming in my mind, first does this path exist?
$directory = "/images/";
you might have to give full path
$directory = "/location/images/";

or use like below if its in same folder
$directory = dirname(__FILE__)."/images/";

second on 'blank page' do you see any of your html output in source code?
 
Thanks for aswer :)
So i used this: $directory = dirname(__FILE__)."/images/";
and when i click on homepage have a blank page with this sourc code:
Code: 
<li><a href="[URL="http://www.wjunction.com/view-source:http://pixemitter.com/mobile/imageslogo-01-beta2.png"]imageslogo-01-beta2.png[/URL]"><img src="[URL="http://www.wjunction.com/view-source:http://pixemitter.com/images/thumb_logo-01-beta2.png"]/images/thumb_logo-01-beta2.png[/URL]" alt="Image 01" /></a></li>
<li><a href="[URL="http://www.wjunction.com/view-source:http://pixemitter.com/mobile/imageslogo-01-beta.png"]imageslogo-01-beta.png[/URL]"><img src="[URL="http://www.wjunction.com/view-source:http://pixemitter.com/images/thumb_logo-01-beta.png"]/images/thumb_logo-01-beta.png[/URL]" alt="Image 01" /></a></li>
<li><a href="[URL="http://www.wjunction.com/view-source:http://pixemitter.com/mobile/imageslogo-01-beta3.png"]imageslogo-01-beta3.png[/URL]"><img src="[URL="http://www.wjunction.com/view-source:http://pixemitter.com/images/thumb_logo-01-beta3.png"]/images/thumb_logo-01-beta3.png[/URL]" alt="Image 01" /></a></li>
<li><a href="[URL="http://www.wjunction.com/view-source:http://pixemitter.com/mobile/imagesthumb"]imagesthumb[/URL]"><img src="[URL="http://www.wjunction.com/view-source:http://pixemitter.com/images/thumb_thumb"]/images/thumb_thumb[/URL]" alt="Image 01" /></a></li>
<li><a href="[URL="http://www.wjunction.com/view-source:http://pixemitter.com/mobile/imageslogo-01-beta1.png"]imageslogo-01-beta1.png[/URL]"><img src="[URL="http://www.wjunction.com/view-source:http://pixemitter.com/images/thumb_logo-01-beta1.png"]/images/thumb_logo-01-beta1.png[/URL]" alt="Image 01" /></a></li>
but if i refresh page my output the gallery dont see, i see this links:


  • Image01
  • Image01
  • Image01
  • Image01
  • Image01
  • Image01
when i click on links have this message:

Not Found

The requested URL /root/imageslogo-01-beta.png was not found on this server.
but i put the images in root dir...
:(

Sory but how enable error reporting?
 
Last edited:
you have issue with image location

Now I will assume this is your folder structure

PHP: 
index.php
gallery.php
//A folder which contains images/ folder with images
images/1.jpg
images/2.jpg
etc


then you should change this line from your above code like this:
PHP: 
 echo "<li><a href=\"images/".$file."\"><img src=\"images/thumbs_".$file."\" alt=\"Image 01\" /></a></li>";

.or you can add http path to links like
PHP: 
 echo "<li><a href=\"http://www.wjunction.com/images/".$file."\"><img src=\"http://www.wjunction.com/images/thumbs_".$file."\" alt=\"Image 01\" /></a></li>";

// change wjunction.com to ur host


you have to provide correct paths and visit the image url if it works and then try to implement that.

To enable php error reporting you have to enable it in php.ini file or add below on top of your file
PHP: 
<?php
error_reporting(E_ALL);
ini_set("display_errors",1);
?>
 
Last edited:
Hello,
first for all thankyou very mutch for your help because now begin works! :)
So i follow your tutorial but have still some prblem:
if i make this:

gallery.php
PHP: 
echo "<li><a href=\"http://www.wjunction.com/images/".$file."\"><img src=\"http://www.wjunction.com/images/thumbs_".$file."\" alt=\"Image 01\" /></a></li>";
i have this links:

  • image01
  • image01
  • image01
  • image01 this is a dir thumb_ when click have error: forbidden You don't have permission to access /images/thumbs_/ on this server.
  • image01
if remove thumbs_ i see not links but the image not in gallery but full size.
The my gallery1.html file i dont need? Because if i delete the file no changes are made.

gallery1.html
PHP: 
<!DOCTYPE html> 
<html> 
    <head> 
        <title>Gallery</title> 
        <meta name="viewport" content="width=device-width, initial-scale=1" /> 
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
        <link rel="stylesheet" href="css/style.css" />        
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
        <script type="text/javascript" src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
        <script type="text/javascript" src="js/script.js"></script>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></head> 
    <body>
        <div data-role="page" class="page gallery-page">
            <div data-role="header">
                <!--<a href="gallery.html" data-icon="arrow-l" data-rel="back" data-direction="reverse">Back</a>-->
                <a href="index.html" data-icon="home" data-direction="reverse">Home</a>
                <h1>PANORAMA</h1>
            </div><!--/header-->
            <div data-role="content" class="full-width">
            <ul class="gallery three-column-gallery" id="gallery">
            
                <script>        
<?php

$directory = dirname(__FILE__)."/images/";

//$directory = "/images/";//

if (is_dir($directory)) {

    if ($directory_handle = opendir($directory)) {

        while (($file = readdir($directory_handle)) !== false) {


            if((!is_dir($file))&($file!=".")&($file!=".."))
                echo "<li><a href=\"/gallery1.html/".$file."\"><img src=\"/images/".$file."\" alt=\"Image 01\" /></a></li>";
        }

        closedir($directory_handle);
    }
}
?> 
            </script>

            
            
            <!--  This is my old links gallery format
          
                    <li><a href="img/gallery/full/holiday/01.jpg" rel="external"><img src="img/gallery/thumb/holiday/01.jpg"  /></a></li>
                    <li><a href="img/gallery/full/holiday/02.jpg" rel="external"><img src="img/gallery/thumb/holiday/02.jpg"  /></a></li>
                    <li><a href="img/gallery/full/holiday/03.jpg" rel="external"><img src="img/gallery/thumb/holiday/03.jpg"  /></a></li>
                    <li><a href="img/gallery/full/holiday/04.jpg" rel="external"><img src="img/gallery/thumb/holiday/04.jpg"  /></a></li>
                    <li><a href="img/gallery/full/holiday/05.jpg" rel="external"><img src="img/gallery/thumb/holiday/05.jpg"  /></a></li>
                -->    

                    
                    
                             </ul>        
            </div><!-- /content -->

        </div><!-- /page -->
        
        
    </body>
</html>
My brain smokes!

I edited my PHP.ini and have enabled:
error_reporting
Default Value: E_ALL & ~E_NOTICE
Development Value: E_ALL | E_STRICT
Production Value: E_ALL & ~E_DEPRECATED
but i dont have error message
 
iobit said:
if remove thumbs_ i see not links but the image not in gallery but full size.
The my gallery1.html file i dont need? Because if i delete the file no changes are made.
Click to expand...
Make sure you are pointing to correct path of thumbs folder there
ie if thumbs containing folder is inside images folder
/images/thumbs/thumbs_".$file."

Also might be issue with your gallery image script, make sure your url's are pointing to correct JavaScript files.

You dont have any PHP error otherwise it will display you with error reporting On, To see if there is any error in JavaScript/gallery script you can use Firebug.
 
So, i see the problem is the php code, because if i use only php code without jquerymobile.....
the problem dont solve.
if i from index.html/php click on button for call gallery.php appears a blank page, if refresh page the gallery appears.

this is a code:
PHP: 
 <?php 
$directory = dirname(__FILE__)."/images/"; 
if (is_dir($directory)) { 
    if ($directory_handle = opendir($directory)) { 
        while (($file = readdir($directory_handle)) !== false) { 
            if((!is_dir($file))&($file!=".")&($file!="..")) 
                echo "<li><a href=\"/images/".$file."\"><img src=\"/images/thumb/".$file."\" alt=\"Image 01\" /></a></li>"; 
        } 
        closedir($directory_handle); 
    } 
} 
?>
 
Last edited:
Status
Not open for further replies.

About the author

I
iobit
Active Member · Joined
338
Messages
18
Reactions
18
Points

Trending

Advertise on WJunction

Reach 1000's of webmasters, hosts & affiliates. Banner & sponsored-thread slots available.

Contact us
Back
Top Bottom