Skip to content

Instantly share code, notes, and snippets.

@qaharmdz
Forked from havvg/ajax-form.js
Last active January 2, 2016 13:09
Show Gist options
  • Select an option

  • Save qaharmdz/8307845 to your computer and use it in GitHub Desktop.

Select an option

Save qaharmdz/8307845 to your computer and use it in GitHub Desktop.

Revisions

  1. A. Qahar Mudzakkir revised this gist Jul 11, 2014. 1 changed file with 13 additions and 13 deletions.
    26 changes: 13 additions & 13 deletions ajax-form.js
    Original file line number Diff line number Diff line change
    @@ -1,18 +1,18 @@
    jQuery(function($) {
    $('form[data-async]').live('submit', function(event) {
    var $form = $(this);
    var $target = $($form.attr('data-target'));
    $('form[data-async]').on('submit', function(e) {
    var $form = $(this);
    var $target = $($form.attr('data-target'));

    $.ajax({
    type: $form.attr('method'),
    url: $form.attr('action'),
    data: $form.serialize(),
    $.ajax({
    type: $form.attr('method'),
    url: $form.attr('action'),
    data: $form.serialize(),

    success: function(data, status) {
    $target.html(data);
    }
    });

    event.preventDefault();
    success: function(data, status) {
    $target.html(data);
    }
    });

    e.preventDefault();
    });
    });
  2. @havvg havvg created this gist Aug 1, 2012.
    18 changes: 18 additions & 0 deletions ajax-form.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,18 @@
    jQuery(function($) {
    $('form[data-async]').live('submit', function(event) {
    var $form = $(this);
    var $target = $($form.attr('data-target'));

    $.ajax({
    type: $form.attr('method'),
    url: $form.attr('action'),
    data: $form.serialize(),

    success: function(data, status) {
    $target.html(data);
    }
    });

    event.preventDefault();
    });
    });
    22 changes: 22 additions & 0 deletions form.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,22 @@
    <!-- Bootstrap trigger to open modal -->
    <a data-toggle="modal" href="#rating-modal">Write a Review</a>

    <div class="hide fade modal" id="rating-modal">
    <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal">×</button>
    <h2>Your Review</h2>
    </div>

    <div class="modal-body">
    <!-- The async form to send and replace the modals content with its response -->
    <form class="form-horizontal well" data-async data-target="#rating-modal" action="/some-endpoint" method="POST">
    <fieldset>
    <!-- form content -->
    </fieldset>
    </form>
    </div>

    <div class="modal-footer">
    <a href="#" class="btn" data-dismiss="modal">Cancel</a>
    </div>
    </div>