Backbone.Marionette + Rails app redirects after form submission. Why?

133 views Asked by At

I have a sample app that I'm working on that uses Ruby on Rails for the server backend and Backbone.Marionette for the client-side. The main functionality is a form to "order a widget". I'm using backbone-forms to create the form. The oddity that is throwing things off is that once I submit the form and save the model to the Rails backend, the browser is automatically redirected to the root url with all of the form params as URL params (e.g. http://localhost:3000/?quantity=4&color=red&needed_by=2015-06-15T04%3A00%3A00.000Z&kind=Widget+Pro). This redirection prompts Rails to GET the #index method on the controller (which is the blank form, as this is the sole function of the app).

For the life of me, I can't find what is causing this. I don't know if its Backbone, Marionette, or backbone-forms. I won't to either stop it or at least understand it well enough to get it do what I want.

If it helps, here's the code that generates the form, waits for submission, commits the Backbone.Model, then saves it to the Rails backend:

@WidgetApp.module "Widget.Create", (Create, App, Backbone, Marionette, $, _) ->

  # VIEW
  class Create.Widget extends Marionette.ItemView
    template: "create_widget"

  # Controller
  class Create.Controller extends Marionette.Controller

    initialize: ->
      widget = App.request "new:widget:entity"

      # newView = new Create.Widget
      # App.mainRegion.show newView
      form = new Backbone.Form(
        template: _.template($('#formTemplate').html())
        model: widget
        )
      App.mainRegion.show(form.render())
      # Run validation before submitting
      form.on 'submit', (event) ->
        errs = form.commit({ validate: true })
        if errs
          console.log errs
          event.preventDefault()
        widget.save()
1

There are 1 answers

2
nikhil mehta On BEST ANSWER

Try making the statement event.preventDefault() as your first statement in the event listener of form submit.I was having the same problem adding the same statement in the first line of the event listener solved my problem.