Unique URL For Article Viewer

On my website, I have an Article Viewer page where users are allowed to search through and select articles to view. These articles are viewed in an Iframe. When an article is sel

Solution 1:

An easy way of doing this is adding a hash in the url:

$(document).ready(function() {
    $(function(){
        $("#article-search-textbox").autocomplete({
            source: "/functions/article_search.php",
            delay: 800,
            select: function(event, ui){
                window.location.hash = ui.item.value; // <<< Hash
                $("#document-viewer").attr("src", "/articles/" + ui.item.value + ".pdf");
            }
        });
    });

    // And check if the entered url has a hash, to load the article at page loading.
    var hash = window.location.hash;
    if(hash.length) {
        $("#document-viewer").attr("src", "/articles/" + hash + ".pdf");
    }
});

Solution 2:

Try this (untested):

<!-- HTML -->
<iframe id="document-viewer"></iframe><br />
<a id="article_link" href="#"></a>


/* jQuery */
$(document).ready(function(){
$(function(){
    $("#article-search-textbox").autocomplete({
        source: "/functions/article_search.php",
        delay: 800,
        select: function(event, ui){
            var article_url = "/articles/" + ui.item.value + ".pdf";
            $("#document-viewer").attr("src", article_url);
            $("a#article_link").attr({"href": document.location.hostname+article_url,"target":"_blank"}).html(ui.item.value);

        }
    });
});
});