A simple jquery function for submitting twitter bootstrap forms with ajax and populating error messages. This expects some twitter bootstrap conventions but keeps be from rewriting the same ajax javascript a dozen times per app.

bootstrap_form.js

(function($){
    $.fn.bootstrapForm = function(options){
        var options = $.extend({
            submit_button: 'button[type="submit"], input[type="submit"]',
            model_name: '',
            show_errors: true
        },options);

        return this.each(function() {
            var form = $(this);
            var submit_button = form.find(options.submit_button);

            function doSuccessCallback(data, text, xhr){
                if($.isFunction(options.success)){
                    options.success(data, text, xhr);
                }
            }

            function doErrorCallback(data, text, error){
                if($.isFunction(options.error)){
                    options.error(data, text, error);
                }
            }

            function doBeforeSumbitCallback(form){
              if($.isFunction(options.before_submit)){
                    options.before_submit(form);
                }
            }


            function addErrorsToForm(form, data, model_name){
                var form, obj;
                if (model_name == null || model_name == '') {
                  model_name = null;
                }
                obj = $.parseJSON(data.responseText);
                form = $(form);
                $.each(obj, function(key, errors) {
                  var cg, input;
                  if (model_name) {
                    input = $(form).find("[name='" + model_name + "[" + key + "]']");
                  } else {
                    input = $(form).find("[name='" + key + "']");
                  }
                  cg = input.closest('.control-group').addClass("error");
                  cg.find(".help-inline.error").html(errors[0]); //showing only first error
                });
            }
            form.find(submit_button).unbind('click').click(function(){
              doBeforeSumbitCallback(form);
                $(submit_button).button('loading');
                $.ajax({
                  url: form.attr('action'),
                  type: form.attr('method'),
                  dataType: 'json',
                  data: form.serialize(),
                  success: function(data, text, xhr){
                    submit_button.button('reset');
                    $('.control-group').removeClass("error");
                    $('.help-inline.error').html("");
                    doSuccessCallback(data, text, xhr);
                  },
                  error:function(data, text, error){
                    submit_button.button('reset');
                    $('.control-group').removeClass("error");
                    $('.help-inline.error').html("");
                    if(options.show_errors){
                      addErrorsToForm(form, data, options.model_name);
                    }
                    doErrorCallback(data, text, error);
                  }
                });
                return false;
            });
        });
    };

})(jQuery);

sample_form.html

<form id="new_login_request" class="form-horizontal login-request-form" method="post" action="/login_requests" accept-charset="UTF-8">
  <div class="control-group">
    <label class="control-label" for="login_request[first_name]">First Name</label>
    <div class="controls">
      <input id="login_request[first_name]" class="input-xxlarge" type="text" value="" name="login_request[first_name]">
      <span class="help-inline error"></span>
    </div>
  </div>
  <div class="control-group">
    <label class="control-label" for="login_request[last_name]">Last Name</label>
    <div class="controls">
      <input id="login_request[last_name]" class="input-xxlarge" type="text" value="" name="login_request[last_name]">
      <span class="help-inline error"></span>
    </div>
  </div>
</form>

sample_init.js.coffee

jQuery ->
  LoginRequestForm.initialize()

window.LoginRequestForm = {

  initialize: ->
    $("#new_login_request").bootstrapForm({
      model_name: "login_request", #optional for whn you have nested your attr names, common in ruby
      success: @formSuccess, 
      before_submit: @formSubmit
    });
    
  formSubmit: (form) ->
    #do something before submit
    
  formSuccess: (data, text, xhr) ->
    #do something after successful submission

}