CODEWITHSUNDEEP
javascriptjqueryruby-on-railsajaxforms
Sean Magyar
Sean Magyar

Reputation: 2380

firing js before submitting remote bootstrap modal rails form

I have a rails4 app. I'm trying to do remote submission with the inbuilt AJAX mechanism (respond_to format.js and create.js.erb), but before I submit the form I want to change the code a bit via js to save the proper UTC time to db.

Everything works fine till the last line, so default behavior is pervented, time is properly formatted with momentjs, but the form doesn't get submitted in the end. Is something wrong with this $('#new-task-modal-form').submit(); line? What else could I miss here?

form

<%= form_for([current_user, @task], remote: true, id: "new-task-modal-form") do |f| %>
....
....
<%= f.submit "Create Task", class: 'btn btn-primary new-task-submit', "data-sid" => current_user.id, "data-rip" => :executor_id %>

js

var ready = function() {

  $('.new-task-submit').on('click', function (e){
    e.preventDefault();
    var localMoment = moment($('.new-task-deadline').val());
    $('.new-task-deadline').val(localMoment.toISOString());
    $('#new-task-modal-form').submit();
  });

$(document).ready(ready);
$(document).on("page:load", ready);

I tried it this way as well, so momentjs can't be the problem:

var ready = function() {

  $('.new-task-submit').on('click', function (e){
    e.preventDefault();
    $('#new-task-modal-form').submit();
  });

$(document).ready(ready);
$(document).on("page:load", ready);

Upvotes: 0

Views: 400

Answers (2)

Sean Magyar
Sean Magyar

Reputation: 2380

This was a bootstrap modal issue. It's weird but I had to call the submit function on the modal not on the rails form: $('#newtask').submit();.

<%= form_for([current_user, @task], remote: true, class: "new-task-modal-form") do |f| %>
<div class="modal fade" id="newtask" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">

Upvotes: 1

lonewarrior556
lonewarrior556

Reputation: 4479

Try this:

  $('.new-task-submit').on('submit', function (e){
    e.preventDefault();
    var localMoment = moment($('.new-task-deadline').val());
    $('.new-task-deadline').val(localMoment.toISOString());
    this.submit();
  });

Credit to lonesomeday https://stackoverflow.com/a/4517383/2898941

Upvotes: 0

Related Questions