Does the jQuery Address plugin work if my hrefs are empty?

Question

I've been using empty hrefs (href="#") and allowing a jQuery click event to get the data from my controller and display it in a partial view.

However, I'd like to implement the jQuery Address plugin so the back button can be used. From what I can tell, I need to stop using empty hrefs. (I imagine it's also bad practice to have empty hrefs.)

My new link looks like this.

<a href="/Stop/Details/<%: item.StopID %>">
    <div class="stopId"><%: item.StopID %></div>
</a>

But now instead of my jQuery click event capturing it, I'm getting redirected to /Stop/Details right away, which is not what I want since that's a partial view. How can I fix this?

Edit: I just realized that my title is not accurate to the question. Sorry about that. Will try to think of a more accurate title and change it.

Double edit: Also realized that a div shouldn't be nested in a link.

My click event is actually a live click. It looks something like this:

$(function () {
$(".stopId").live('click', function () {
    var stopId = $(this).html()

        $.post('<%= Url.Action("Details") %>',
    { id: stopd },
    handleSuccess
        );
});
});

score 2 · Accepted Answer · answered Apr 06 '11 at 18:20

2

You probably want to prevent the default action from happening in your click function for your anchors. This will prevent the browser from following the link when you click it. You didn't post your jQuery click code but it should be something like this:

$('a').click(function(e) { //Edit note the e
    //Your code here
    e.preventDefault(); //This stops the browser from following the link
});

Edit
Actually, after looking at the jQuery address plugin docs, I think you want to make the links look like this: <a href="#/Stop/Details/<%: item.StopID %>"> (Note the #). This may solve your problem as well.

answered Apr 06 '11 at 18:20

Richard Marskell - Drackir

13,080
3
33
54

That worked. So much I don't know about jQuery. (I've been slowly going the book "jQuery: Novice to Ninja" but I keep running into issues that I haven't read about yet.) Thank you! – Gary the Llama Apr 06 '11 at 18:35
@Gary the Llama: Glad it helped. If you come across any issues a quick google/StackOverflow search or checking the jQuery [api](http://api.jquery.com/) usually helps. :) – Richard Marskell - Drackir Apr 06 '11 at 19:42

score 2 · Answer 2 · edited May 23 '17 at 12:04

2

Without seeing your jQuery click-handler, I can't be sure, but have you remembered to use the return false or event.preventDefault:

$('a').click(
    function(){
        // other stuff
        return false;
    });

Or:

$('a').click(
    function(e){
        e.preventDefault;
        // other stuff
    });

References:

edited May 23 '17 at 12:04

Community

1
1

answered Apr 06 '11 at 18:21

David Thomas

249,100
51
377
410

It's a live('click') event so I don't seem to have access to e.preventDefault. Edit: Chalk that up to intellisense, their website says it's possible. – Gary the Llama Apr 06 '11 at 18:31
You're correct as well, but the other guy beat you by a mere minute. Thanks for the quick response. – Gary the Llama Apr 06 '11 at 18:36
@Gary: no problem at all; glad to have been of, at least some, help. :) – David Thomas Apr 06 '11 at 18:37

Does the jQuery Address plugin work if my hrefs are empty?

2 Answers2