jQuery Forum

I'm trying to use ajax to check every 5 seconds if content on my server has changed since the user loaded it. I understand I must use advanced HTTP caching to make sure my server isn't hammered down to the ground because of this.

My server is set up to return the `Last-Modified` HTTP header, including `302 Not Modified` if that is the case.

On the client-side I've set `ifModified: true`, as well as `If-Modified-Since` in `beforeSend` to the value of `Last-Modified`. But I'm having trouble understanding how all this fits together. Other than setting `If-Modified-Since`, where am I supposed to actually use it? And, how do I check for change inside `success`?

globalVar.firstRequest = true;
globalVar.lastModifiedDate;

$.articlePoller = {
  poll: function() {
    console.log('Ran poll');
    setTimeout(this.request, 5000);

  },
  request: function() {
    console.log('Ran request');

    var dataUrl = $('#articles').data('url');

    $.ajax({
      url: dataUrl,
      type:"GET",
      cache: true,
      ifModified: true,
      Async: true,
      beforeSend: function(xhr){
        if(!globalVar.firstRequest) {

          // HELP!!!

          xhr.setRequestHeader("If-Modified-Since", globalVar.lastModifiedDate);
        }
      },
      success: function(html, textStatus, xhr){
        if(globalVar.firstRequest) {
          console.log('First request');

          globalVar.firstRequest = false;
          globalVar.lastModifiedDate = xhr.getResponseHeader('Last-Modified');

          // Start again

          $.articlePoller.poll();
        } else {
          console.log('Subsequent request');

          // HELP!!!

          if(???) {
              console.log('We have change! Proceeding to fetch the actual content...');
              $.articlePoller.addArticles();
          }
        }
      }
    });
  },
  addArticles: function(articles) {
    // ...
  },
  showArticles: function(e) {
    // ...
  }
};

$(function() {
  $.articlePoller.poll();
  $('#show_articles a').click($.articlePoller.showArticles);
});

Hi!

Does anybody know how I can make the Snap.js mobile menu (https://github.com/jakiestfu/Snap.js) work across multiple jQuery Mobile pages?

http://jsfiddle.net/frank_o/phpyf0ws/5/

Thanks!

For people who have made their own UIs from scratch, would it be a better choice to switch to http://weblinc.github.io/jquery.smoothState.js/?

From what I understand, jQuery Mobile is all about its UI. It's code heavy, has an immense backlog of things to do, and basic scrolling won't even work until version 1.7.

What do you guys reckon?

Thanks!

Frank

Can anyone tell why jQM (structure only CSS) adds a black border to the header and footer when the select box is opened?

http://jsfiddle.net/frank_o/y7jf4/10/

Assuming it's possible, can someone help translate these plain JS snippets into jQuery?

From https://github.com/jakiestfu/Snap.js:

1. var snapper = new Snap({
2.     element: document.getElementById('content')
3. });
4. 
   
5. var addEvent = function addEvent(element, eventName, func) {
6.     if (element.addEventListener) {
7.         return element.addEventListener(eventName, func, false);
8.     } else if (element.attachEvent) {
9.         return element.attachEvent("on" + eventName, func);
10.     }
11. };
12. 
    
13. addEvent(document.getElementById('open-panel'), 'click', function () {
14.     snapper.open('left');
15. });

jQuery is just so much prettier and easier to understand.

Thanks!

Frank

Does anybody know how to set up Snap.js in jQuery Mobile? I'm trying to migrate from the jQuery Mobile panel widget (which has major scroll issues), but it doesn't seem to want to work at all:

http://jsfiddle.net/frank_o/vZBzD/3/

In comparison here's a working version without jQuery Mobile:

http://jsfiddle.net/frank_o/5X4K9/5/

Thanks!

Frank

Hi,

Hello,

Anybody aware of any jQuery / JS tap indicators?

Hi,

I'm probably missing something obvious, but why won't jQuery Masonry initialize on #page2 if I go to #page1 first and then click on the link to #page2?

http://fiddle.jshell.net/frank_o/UQdJ3/show/light/ (one has to resize the window for it to work)

When going directly to #page2, however, everything works fine:

http://fiddle.jshell.net/frank_o/UQdJ3/show/light/#page2

The actual fiddle:

http://jsfiddle.net/frank_o/UQdJ3/

Thanks!

How does one completely remove the jQuery Mobile loader?

There's this:

http://stackoverflow.com/questions/13533543/jquery-mobile-how-to-completely-remove-the-pre-loader-from-jquery-mobile

But I'd also like to remove .ui-loader from my page.

Thanks.

Hi,

I'm trying to bind my JS to pageinit as recommended by jQuery Mobile.

Everything seems to work except for this nav menu which organizes its dropdown links into columns if they flow out of the page:

http://jsfiddle.net/frank_o/ksYFF/5/ (please uncomment the 1st line and comment the 2nd one)

Anybody know why this is?

Thanks!