开发者

Dynamic jquery address using search button

I'm trying to use http://www.asual.com/jquery/address/ for history management, this works absolutely fine when we work on "a" tags, but now I've search module which trigger when I click on a search button and I'm trying to include the search text in the address(and also the page number), so that when the user uses the backs button he/she can also see what search they have done previously. Any help will be greatly appreciated.

Edited: Reference - http://www.asual.com/jquery/address/

I'm building AJAX application, so all the modules are loaded using AJAX and to keep a track of the history I'm using: http://www.asual.com/jquery/address/, till now all the links are "a" href's which I'm coding as Public

Now, I'm working on the search page which has a search TextBox and a searchButton, so when the user enters in the text box and clicks on searchButton, the url has to be adjusted accordingly so when the user directly enters (or comes to that URL using BACK button), the search results should be displayed, this is similar to the "SEARCH MAIL" button in gmail, please note how the url is changing, he开发者_开发技巧re I'm also trying to achieve the same thing. Hope it is clear, thanks.

Regards


I bealive you're looking for something like in this example.

Simplified example:

<html>
<head>
    <title>jQuery Address Form</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript" src="jquery.address.js"></script>
    <script type="text/javascript">
        $.address.init(function(event) {
            $('form').address();
        })
        .change(function(e) {
            // for anything that isn't homepage
            if (e.value != '/') {
                // load results for url in e.value, for example:
                $("#results").load(e.value);
            }
        })
    </script>
</head>
<body>
    <div class="page">
        <h1>jQuery Address Form</h1>
        <form action="find.php" method="get">
            <label for="input">Query</label><br>
            <input id="input" name="input" type="text" value="" size="60"/>
            <input id="submit" name="submit" type="submit" value="Submit"/>
        </form>
        <div id="results">

        </div>
    </div>
</body>
</html>

When you submit the form, the url is changing. The change event is then handled by my code. e.value is a url in this example, so when the url is changing we're trying to load search results into the #results div. The same change handler is used when user navigates using the "back" button in his/her browser.


There exists whole jQuery plugin for that, called jQuery BBQ: Back Button & Query Library. Try out demo, and find if that is what you need.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜