How to submit a form with javascript?

Question

I have an exposed views form, am geolocating in javascript and setting the co-ordinates in the exposed form.

This form submits properly when I click on the 'apply' button but does not when I use javascript to submit the form. The page refreshes, but the values have not been changed.

The form is standard FAPI. It is not a views-ajax form although I would like to move to ajax at some point in the future when I sort out the problems with gmaps + ajax.

Both of the following fail.

jQuery('#edit-submit-studio-locations').click();
jQuery('#views-exposed-form-studio-locations-page').submit();

The full code is in github.

Answer 1

Add this code inside Drupal.behaviors.

$('.views-exposed-form APPLY_BUTTON ID/class').click(function() {
  // Submit the form
  (this).parents('form').submit();
});

Hope it works.

Answer 2

The following would do the job:

jQuery('#edit-submit-studio-locations').mousedown();

Answer 3

You can submit form using jquery or add some trigger action

here is example code :

Drupal.behaviors.form_submit_processor = {
  attach: function (context, settings) {
    $("form#your-form").submit(function(e) {
     // some code here
    });
  }
}

Answer 4

Apologies, the problem was that the geocoding was being done asynchronously. Both of these submission methods work.

The solution is to trigger an event in the geocoding closure and react to this event.

I thought FAPI was somehow validating my submission.

geocoder.geocode({'address': address_string}, function (results, status) {
  $(window).trigger('yhive_geocoded');
});

$(window).on('yhive_geocoded', function() {
      $('#views-exposed-form-studio-locations-page').submit();
});