CODEWITHSUNDEEP
javascriptjqueryfirefox
copser
copser

Reputation: 2641

submit form not workin in firefox browser only

I'm submitting a form from Bootstrap modal and I have a problem with Firefox only, it's really simple code,

$('#confirmBtn').click(function(e){
    e.preventDefault();
    $('#s-form').submit();
  });

calling it from modal

<div class="modal" tabindex="-1" role="dialog" id="sipChannel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title"><strong>Updating SIP Channel</strong></h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <p>Please confirm we are updating <%= @customer.company_name %> SIP channels from x to y,
           this will affect your billing and will take affect within the next few minutes.</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
        <button type="button" class="btn btn-primary" type="submit" id="confirmBtn">Confirm</button>
      </div>
    </div>
  </div>
</div>

form

  <div style="" class="col-md-5 offset-md-2 custom-form">
    <%= form_for @changeset, Routes.customer_path(@conn, :update_info, @customer.id), [id: "s-form", as: :customer], fn f -> %>
      <h6>Channels:</h6>

      <div class="input-group input-group--t4-xl">
        <%=
          number_input(f, :channels,
            class: "custom-text-field form-control form-control-lg",
            style: "",
            disabled: true,
            max: (@customer.channels || 1) * 2,
            min: 1,
            id: "s-number"
          )
        %>

        <div class="input-group-append" id="cancel-sip">
          <button class="btn btn-outline-secondary" id="edit-sip">
            Edit 
          </button>
        </div>
      </div>
    <% end %>

If I put console.log("...") inside my jquery function I can see that by clicking on the button I'm calling the function but Firefox is ignoring the submit so how can I fix this?

Upvotes: 0

Views: 135

Answers (1)

mplungjan
mplungjan

Reputation: 177684

WHY not just put the button inside the form and not use jQuery? OR add form="s-form" to it?

If not, it should be type=button so you do not need the preventDefault on the click event.

Otherwise if you need confirmation, use

$('#s-form').on("submit",function(e) {
  if (!confirm("Are you sure")) e.preventDefault();
});

Upvotes: 1

Related Questions