Backbone collection bug in IE9

Question

Can't understand what the problem is.

When calling remove method on backbone collection passing model into it collection is refreshed and I can't see removed model, but in IE9 it not refreshing until I manually refresh the page.

When trying to console.log collection in IE9 I got undefined.

In IE10+ and all other browsers this works without issues.

I'm using backbone.marionette with coffeescript using requirecs.

Here is sample:

delete: ->
  @deleteDeferred = $.Deferred()
  vent.trigger 'modal:', name: 'deleteConfirm', modalSize: '', model: @
  promise = @deleteDeferred.then =>
    xhr = $.ajax
      url: "/api/v1/user-contact-data/#{@id}"
      dataType: 'json'
      type: 'DELETE'

  promise.done =>
    @collection.remove(@) if @collection

  promise.always =>
    delete @deleteDeferred

  promise

Any ideas about this?

Thanks.

Answer 1

It sounds like IE9 is caching your ajax request (no fun =/)

Try this:

$.ajaxSetup({ cache: false });

This will add a "cache buster" query param (a ms timestamp) and will make sure each ajax request is unique.

Answer 2

Im just curious why you creating a promise and XHR call when you can just use the destroy method directly on the model? For example:

# This will automatically call "/api/v1/user-contact-data/#{@id}", using the verb 
# DELETE, fire the appropriate events, 
# and remove it from any collection(s) the model is attached to
@model.destroy success: =>
    vent.trigger 'delete:successful'