CODEWITHSUNDEEP
javascriptjquery
gedq
gedq

Reputation: 610

can I capture the submit event of a class

I'm hunting all over the internet and I cannot find a straight answer. I have a number of forms. Rather than assign unique ids to them all I want to capture the submit event and take the id out of this. But I cannot capture the submit event.

Right now I've got:

$('#trainingRecords tr td form').on('submit', function(e) {
  alert('here'); // doesn't fire

  e.preventDefault();
  if (confirm("You're about to delete this training record. Sure?")) {
    $(this).submit();
  }
  return;
});

and the form code looks like:

<table class="table table-bordered table-striped table-condensed" id="trainingRecords">

  @foreach ($personnel->trainingRecords as $record)

  <td width="30px">

    {!! Form::open(['url' => 'personnel/delete/' . $record->id]) !!}

    <button class="btn btn-xxs btn-danger" type="submit" class="deleteForm">

      <i class="fa fa-times"></i>

    </button>

    <input type="hidden" name="id" value="{{$record->id}}" /> {!! Form::close() !!}
  </td>

Why am I not capturing the submit event? What am I missing?

edited to add: I tried adding an on('click') handler to the submit button. That doesn't work either. The form submits, but the function isn't being fired.

Upvotes: 0

Views: 308

Answers (2)

gedq
gedq

Reputation: 610

Schoolboy howler. I was attaching the event listener to the DOM object and then creating the DOM object. I wrapped the event listener in a doc ready block and all was well. Except of course for using the submit event and then firing it, creating an endless loop. I changed it to click.

so this:

$('#trainingRecords tr td form').on('submit', function(e) {
  alert('here'); // doesn't fire

  e.preventDefault();
  if (confirm("You're about to delete this training record. Sure?")) {
    $(this).submit();
  }
  return;
});

became this:

$(function() {    
    $('.trainingDelete').on('click', function(e) {
        e.preventDefault();
        if(confirm("You're about to delete this training record. Sure?")) {
            $(this).submit();
        }
        return;
    });
});

that's all it took.

Upvotes: 0

Bast
Bast

Reputation: 369

maybe like this

$('form').on('submit', function(e){
  //prevent form submission
  e.preventDefault();
  var id = this.id;
});

Upvotes: 2

Related Questions