title: How to update the Options Object in the beforeSubmit function using jQuery Forms Plugin
body: <p>I am refactoring my use of <code>$.ajax</code> to submit forms using the jQuery Forms Plugin.  The <a href="http://jquery.malsup.com/form/#options-object" rel="noreferrer">API</a> states that it is possible to pass any of the options passed to <code>$.ajax</code> to <code>$.ajaxSubmit</code>. I wish to modify the Options Object in the <code>beforeSubmit</code>, adding a <code>data</code> property.  Alerting the value of <code>options.beforeSubmit</code> in <code>processSubmit</code> suggests that this is the Options Object initialised by the handler and that the data is set, but as the Options Object has already been initialised with no <code>data</code> property, it isn't included in the post sent to the server. Is it possible to modify the Options Object in the <code>beforeSubmit</code>, or in some other way?</p>
  
  <p>When the document is ready I bind a handler to <code>submit()</code>:</p>
  
  <pre><code>$("#myform").submit(function() {
      var options = { dataType: 'json',
              beforeSubmit: processSubmit,
              success: endSubmit };
      $(this).ajaxSubmit(options);
      return false;
  });
  </code></pre>
  
  <p>The <code>processSubmit(arr, $form, options)</code> function packages up data to be sent to the server as JSON:</p>
  
  <pre><code>function processSubmit(arr, $form, options) {
      var followers =[];
      $($("#follower-multi-select").children().filter("li")).each(function() {
        if ($(this).hasClass("selected")) {
          var fwr =  $(this).attr("id");
          followers.push(fwr);
        }
      });
  
      var postData = { followers : followers };
      alert('beforeSubmit is: ' + options.beforeSubmit);
  
      options.data = 'json='+$.toJSON(postData);
      alert('data set: ' + options.data);
  }
  </code></pre>
  
  <p>The form HTML:</p>
  
  <pre><code>&lt;form id="myform" action="/myaction" method="post"&gt;
      &lt;fieldset&gt;
          &lt;legend&gt;Choose your competitors&lt;/legend&gt;
          &lt;ul id="follower-multi-select" class="follower-multi-select"&gt;
              {% for f in follower_thumbs %}
              &lt;li id="{{ f.hashedkey }}"&gt;&lt;img src='{{ f.thumb }}' alt="{{ f.name }}" /&gt;&lt;span class="name-multi-select"&gt;{{ f.name }}&lt;/span&gt;&lt;/li&gt;
              {% endfor %}
          &lt;/ul&gt;
      &lt;/fieldset&gt;
      &lt;input id="send" type="submit" class="large" value="send" /&gt;
  &lt;/form&gt;
  </code></pre>