I have some images in folder and name of the images in a file. I want to display the images according to the buttons clicked.
<!DOCTYPE html>
<html>
<head>
<title>Your Album</title>
</head>
<body>
<form method="post">
<input type="submit" name="first" value="FIRST">
<input type="submit" name="previous" value="PREVIOUS">
<input type="submit" name="next" value="NEXT">
<input type="submit" name="last" value="LAST">
<input type="submit" name="dele" value="DELETE">
</form>
<br>
<?php
$fp = fopen("imgname.csv","r");
$line = fread($fp,filesize("imgname.csv"));
$item = explode("
", $line);
$count;
$sizecsv = sizeof($item);
if(isset($_POST['next'])) {
$count++;
echo "<img src='images/$item[$count]' width='250px'>";
echo "<br>","Image No: ",$count+1;
}
if(isset($_POST['previous'])) {
$count--;
echo "<img src='images/$item[$count]' width='250px'>";
echo "<br>","Image No: ",$count+1;
}
if(isset($_POST['first'])) {
$count = 0;
echo "<img src='images/$item[$count]' width='250px'>";
echo "<br>","Image No: ",$count+1;
}
if(isset($_POST['last'])) {
$count = $item[$sizecsv-1];
echo "<img src='images/$item[$count]' width='250px'>";
echo "<br>","Image No: ",$count+1;
}
?>
</body>
</html>
This is my code. I store the image names in an array and try to manipulate the index according to the button clicked. This works for "FIRST" button but not for anything else. I don't understand the problem. Is it that every time a click a button the page reloads and value of $count is lost. Please give a solution. Also I am new to php so if you can keep it simple then it would be helpful. Thanks in advance.
I am assuming your csv file data are a array of file names separated by new line like the following:
some-img-01.jpg
img-02.jpg
img-05.jpg
....
Please check with the following codes. I have restructured the code to pass the state(if exists from previous post) between each page loads. Here I have designed it to cycle - from first if reaches the end and next is clicked or jump to last if previous is clicked from first position. You can disable this features by commenting out the appropriate lines(check the comments).
<?php
$current_index = isset($_POST['current_index'])? intval($_POST['current_index']) : 0;
$fp = fopen('imgname.csv', 'r');
$line = fread($fp, filesize('imgname.csv'));
fclose($fp);
$item = explode("
", $line);
$sizecsv = sizeof($item);
$current_index = isset($_POST['current_index'])? intval($_POST['current_index']) : 0;
if ($current_index >= $sizecsv) $current_index = ($sizecsv - 1);
if ($current_index < 0) $current_index = 0;
if (isset($_POST['next'])) {
$current_index++;
// If reached end of the list, then clicked next, the index starts from firt again.
// If you dont need this feature, then can comment the following line.
if ($current_index >= $sizecsv) $current_index = 0;
}
if (isset($_POST['previous'])) {
$current_index--;
// If the indexin first image, but clicked the Previous button, then the index goes to last element.
// If you dont need this feature, then can comment the following line.
if ($current_index < 0) $current_index = ($sizecsv - 1);
}
if (isset($_POST['first'])) $current_index = 0;
if (isset($_POST['last'])) $current_index = ($sizecsv - 1);
?><!DOCTYPE html>
<html>
<head>
<title>Your Album</title>
</head>
<body>
<form method="post">
<input type="text" name="current_index" value="<?php echo $current_index;?>"/>
<input type="submit" name="first" value="FIRST"/>
<input type="submit" name="previous" value="PREVIOUS"/>
<input type="submit" name="next" value="NEXT"/>
<input type="submit" name="last" value="LAST"/>
<input type="submit" name="dele" value="DELETE"/>
</form>
<br>
<img src="images/<?php echo $item[$current_index];?>" width="250px"/>
<br>, Image No: <?php echo ($current_index + 1);?>
</body>
</html>
I would do this in a loop.
$i = 1;
while($i<=100){
$name = $i<10?"0".$i:$i;
echo "<a href='images/".$item.".jpg' class='image'>
<img src='images/thumbs/image".$name.".jpg' alt=''/>
</a>";
$i++;
}
Not sure how many images you are working through but I have it set at 100. Be sure to adjust accordingly.