Search code examples
jqueryruby-on-railsruby-on-rails-3ruby-on-rails-4formtastic

Auto Submit in Formtastic using Jquery/Javascript


I want to able to auto-submit my form once the input field 'studentnumber' reaches 8. but i am not very familiar with jquery, and I don't really know where to start. I tried to do this my self, but from what i understand Jquery/javascript uses Id and class ?

I also found the following function, and tried it out but i think i am doing this the wrong way.

$('#____').keyup(function(){
if(this.value.length ==8){
$('#___').click();
}
});

My form looks like this.

<%= semantic_form_for [@event, @student] do |f| %>
<%= f.inputs do %>
<%= f.input :event, :label => "Select Your Event", :include_blank => false %>
<%= f.input :studentnumber, :label => "Student Number", :input_html => {:autofocus => true} %>
<% end %>

<%= f.actions do %>
<%= f.action :submit, :as => :input %>
<% end %>
<% end %>

Any feedback would be very appreciated. Thanks in advance

If any one is looking for answers, I had do few different things, since i had 2 submit buttons in my app i just ended up using the input[name="student[studentnumber] instead of #id And i had to use the .trigger method instead of .submit since i had 2 submits on the same page.

the final script looks like this

$('input[name="student[studentnumber]"]').keyup(function(){
if($(this).val().length ==8)
  $('input[name="commit"]').trigger('click');});

Solution

  • I believe you're on the right track, but instead of $("#___").click(), you should submit the form instead of invoking click on something.

    Also, in your if statement, you are using a DOM element, when you should be using a jQuery object. $(this) as opposed to this

    $("form#theForm").submit() http://api.jquery.com/submit/

    Final code would look like,

    $('#text_field').keyup(function(){
      if($(this).value.length ==8)
        $('form#myForm').submit();
    });
    

    Also, i wanted to note that since you are using rails, you should use Coffee. It's much nicer.