nattfodd
nattfodd

Reputation: 1890

Remote link in a remote form - ajax callback only for submit

I have a remote form on my page, which contains a remote link inside:

= form_tag users_path, remote: true, class: 'my-form' do
  .form-group
    = link_to some_remote_path, class: 'btn btn-warning', remote: true
    = text_field_tag 'some_data', 'some_data', class: 'form-control'
  %button.pull-right.btn.btn-primary{type: 'submit'}
    = 'Save'

What it does now, is when you press the 'Save' button, it displays error or success message depending on AJAX response.

This is my Coffee file:

jQuery ->
  $('.my-form').on 'ajax:success', ->
    $(@).find('.indicator.text-success').show().delay(1000).fadeOut(1000)

  $('.my-form').on 'ajax:error', ->
    $(@).find('.indicator.text-danger').show().delay(1000).fadeOut(1000)

But, since there is now another remote link here (link_to some_remote_path, remote: true), my callback is also triggered when I press that link.

I want the message to be shown only when I click on "Save". Moving the remote link outside form isn't an option (by design).

I made some research, but didn't found any applicable solution. Any help is appreciated!

Upvotes: 0

Views: 40

Answers (1)

yeuem1vannam
yeuem1vannam

Reputation: 957

In your CoffeeScript, you can access the element that triggered the event, and make the change only for it.

jQuery ->
  $('.my-form').on 'ajax:success', (e) ->
    // Find the parent form of e.target
    // then do what you need just for that one
    $targetForm.show().delay(1000).fadeOut(1000)

Upvotes: 1

Related Questions