I have replication working in CouchDB and want to update my UI when changes are pushed to the target database. I've read about _changes database API and found the couch.app.db.changes() function in jquery.couch.js However I can't work out how to use the function. I assume I need to set up listener, but my knowledge of Javascript is not yet what it needs to be.

Unfortunately the docs at don't even list the changes() function.

Can someone help me here and also let me know what the options param is for.

Here is the code for the function in question:

    changes: function(since, options) {
      options = options || {};
      // set up the promise object within a closure for this handler
      var timeout = 100, db = this, active = true,
        listeners = [],
        promise = {
        onChange : function(fun) {
          listeners.push(fun);
        },
        stop : function() {
          active = false;
        }
      };
      // call each listener when there is a change
      function triggerListeners(resp) {
        $.each(listeners, function() {
          this(resp);
        });
      };
      // when there is a change, call any listeners, then check for another change
      options.success = function(resp) {
        timeout = 100;
        if (active) {
          since = resp.last_seq;
          triggerListeners(resp);
          getChangesSince();
        };
      };
      options.error = function() {
        if (active) {
          setTimeout(getChangesSince, timeout);
          timeout = timeout * 2;
        }
      };
      // actually make the changes request
      function getChangesSince() {
        var opts = $.extend({heartbeat : 10 * 1000}, options, {
          feed : "longpoll",
          since : since
        });
        ajax(
          {url: db.uri + "_changes"+encodeOptions(opts)},
          options,
          "Error connecting to "+db.uri+"/_changes."
        );
      }
      // start the first request
      if (since) {
        getChangesSince();
      } else {
        db.info({
          success : function(info) {
            since = info.update_seq;
            getChangesSince();
          }
        });
      }
      return promise;
    },

I have replication working in CouchDB and want to update my UI when changes are pushed to the target database. I've read about _changes database API and found the couch.app.db.changes() function in jquery.couch.js However I can't work out how to use the function. I assume I need to set up listener, but my knowledge of Javascript is not yet what it needs to be.

Unfortunately the docs at http://www.couch.io/page/library-jquery-couch-js-database don't even list the changes() function.

Can someone help me here and also let me know what the options param is for.

Here is the code for the function in question:

    changes: function(since, options) {
      options = options || {};
      // set up the promise object within a closure for this handler
      var timeout = 100, db = this, active = true,
        listeners = [],
        promise = {
        onChange : function(fun) {
          listeners.push(fun);
        },
        stop : function() {
          active = false;
        }
      };
      // call each listener when there is a change
      function triggerListeners(resp) {
        $.each(listeners, function() {
          this(resp);
        });
      };
      // when there is a change, call any listeners, then check for another change
      options.success = function(resp) {
        timeout = 100;
        if (active) {
          since = resp.last_seq;
          triggerListeners(resp);
          getChangesSince();
        };
      };
      options.error = function() {
        if (active) {
          setTimeout(getChangesSince, timeout);
          timeout = timeout * 2;
        }
      };
      // actually make the changes request
      function getChangesSince() {
        var opts = $.extend({heartbeat : 10 * 1000}, options, {
          feed : "longpoll",
          since : since
        });
        ajax(
          {url: db.uri + "_changes"+encodeOptions(opts)},
          options,
          "Error connecting to "+db.uri+"/_changes."
        );
      }
      // start the first request
      if (since) {
        getChangesSince();
      } else {
        db.info({
          success : function(info) {
            since = info.update_seq;
            getChangesSince();
          }
        });
      }
      return promise;
    },

• javascript
• jquery
• couchdb

Share Improve this question Follow edited Oct 12, 2014 at 9:50 tshepang 12.5k2525 gold badges9898 silver badges139139 bronze badges asked Nov 25, 2010 at 1:55 nevfnevf 4,82666 gold badges3434 silver badges3535 bronze badges

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 3

Alternatively you can use longpoll changes feed. Here is one example:

    function bind_db_changes(database, callback) {
        $.getJSON("/" + database, function(db) {
            $.getJSON("/"+ database + 
                        "/_changes?since="+ db.update_seq +"&heartbeat=10000&feed=longpoll", 
            function(changes) {
                if($.isFunction(callback)){
                    callback.call(this, changes);
                    bind_db_changes(database, callback);
                }
            }); 
        });
    };

    bind_db_changes("test", function(changes){
        $('ul').append("<li>"+ changes.last_seq +"</li>");
    });

Note that $.couch.db.changes is now in the official documentation:

http://daleharvey.github./jquery.couch.js-docs/symbols/%24.couch.db.changes.html

Also a nice example of consuming _changes with the jquery.couch plugin here:

http://bradley-holt./2011/07/couchdb-jquery-plugin-reference

what about using the ajax-feateures of jquery?

function get_changes() {  
            $.getJSON("/path/to/_changes", function(changes) {  
                $.each(changes, function() {  
                    $("<li>").html(this.text).prependTo(mychanges_div);  
                });  
                get_changes();  
            });  
}  
setTimeout(get_changes, 1000);  

I've been doing work with JS Promises code which enabled mt to understand the CounchDB code I posted above. Here is a sample:

var promise_changes = app.db.changes();
// Add our deferred callback function. We can add as many of these as we want.
promise_changes.onChange( db_changes );

// called whenever this db changes.
function db_changes( resp ) {
    console.log( "db_changes: ", resp );
}

Google Chrome goes into a Busy state with long polling, which I hope they will resolve one day.