7

Using jQuery Mobile I would like to disable the ajax call on links within a specific part of the DOM.

I do not want to put a 

data-ajax = false

every time I don't want to use the jquerymobile ajax.

For example, any link that is a child of 'content':

<div class="content">
    <a href="http://externalwebsite.com">External Link</a>
</div>

I would like to add the 'data-ajax = false' onto every link that is a child of 'content'

Is there a way to do this with jquery?

cusejuice
  • 10,285
  • 26
  • 90
  • 145

3 Answers3

18

If you want to disable the ajax link behaviour from an anchor tag, you can put rel=external in the link and the link will load without ajax and your url will then be usual.

http://jquerymobile.com/demos/1.0a4.1/#docs/pages/docs-navmodel.html

<a href="User/somepage" rel="external" />I wont be using ajax for navigation</a>

If you want to do this in jQuery for some a tags inside content div, you may try like this

$(function(){
  $(".content a").each(function(){
    $(this).attr("rel","external");
  });
});

Here is a sample http://jsfiddle.net/4WEBk/3/

The more Simplified version. (Thanks to tandu for pointing ) 

$(function(){
  $(".content a").attr("rel","external");
});
Community
  • 1
  • 1
Shyju
  • 214,206
  • 104
  • 411
  • 497
  • This is a slower alternative. The call to `.each` is unnecessary since the setter version of `.attr` works on a collection. You could also call `$(".content a").each()` which avoids adding to the symbol table. – Explosion Pills Apr 25 '12 at 16:46
  • Wouldn't adding `rel="external"` be just as bad as adding `data-ajax=false`? Good answer, but I think it creates the same requirements that the OP doesn't want. – Josh Allen Apr 25 '12 at 16:46
  • @JoshAllen the OP was asking for an easy way to automatically add an attribute to a specific selector .. if he wanted to leave the attributes *off*, he could solve that by doing nothing. – Explosion Pills Apr 25 '12 at 16:50
  • @JoshAllen: As per jQMobile docs, adding rel will stop the links from being ajaxified. http://jquerymobile.com/demos/1.0a4.1/#docs/pages/docs-navmodel.html – Shyju Apr 25 '12 at 16:52
5
$(".content a").attr('data-ajax', false);
Explosion Pills
  • 188,624
  • 52
  • 326
  • 405
0

I had to add rel="external" and target="_self" also to make it work.

Under certain conditions, normal http requests will be used instead of Ajax requests. One case where this is true is when linking to pages on external websites. You can also specify that a normal http request be made through the following link attributes:

  • rel=external

  • target (with any value, such as "_blank")

fabro
  • 731
  • 6
  • 11