隐藏页面在重新加载时已发送表单的事实

Question

I have used a form to submit an image id to the another page. I have done this rather than r than via url because it makes the url cleaner. However, when the user now reloads, it asks if they want to submit the form again. The won't know they have submitted a form, as far as they are aware they have simply clicked an image and been brought to a page that displays that image bigger.

Is there any way around this, that saves the image id the hidden form field has sent via the form, yet refreshes the page for the user?

HTML

<a class="gallery-img span4 js-img-submit" href="#">
   <img src="img.jpg"/>
   <form action="/image" method="post">                                
     <input type="hidden" value="<?=$img['id']; ?>" name="image_id"/>
   </form>
</a>

JQUERY

$('.js-img-submit').click(function(){           
        $(this).find('form').submit();            
 })

PHP

$image_id = isset($_POST['image_id']) ? $_POST['image_id'] : false; 

Answer 1

Somehow the parameter needs to be send to the image page.

• GET: You dont want that.
• POST: You use that, but causes the refresh problem.
• SESSION: Will be hidden, but cause troubles, when he opens multiple images, and then refreshing the first page.

So, i would to the following:

Use the hashtag, and load the image via javascript then. finally remove the hashtag:

MainPage:

<a class="gallery-img span4 js-img-submit" href="/image#<?=$img['id']; ?>">
   <img src="img.jpg"/>
</a>

ImagePage:

<script language="javascript">
$(document).ready(function(){
   var imgid = document.location.hash.slice(1);
   document.location.hash = ""; //Remove
   loadImage(imgid);
})
</script>

loadImage then needs to be the required javascript function.

The user might notice it for a split second. IF the user is not allowed to see, then your only way would be to use the PHP Session with seperate variables for every opened image-window.