sending form via ajax everytime clicked

I want to send my forms by click on each submit button.

My question: How can i send each forms and indicate each result separately. I've tested the following code but it does not send any thing and there is no result in div with ?.divs:

$("form").on('submit',function(e) {
  var url = 'http://seller.ir/test'
  $.ajax({
    type: "POST",
    url: url,
    data: $(this).serialize(),
    success: function(data) {
      $(this).find('.divs').empty
      $(this).find('.divs').html(data)

    }
  });
  e.preventDefault();
});
form{
	width:100px;
	border:1px solid blue;
	height:50px;
	}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<div class="divs">
<form>
<button id="done"type="submit">done</button>
</form>
</div>
<div class="divs">
<form>
<button id="done" type="submit">done</button>
</form>
</div>
<div class="divs">
<form>
<button id="done" type="submit">done</button>
</form>
</div>

Answers:

Answer

The only problem with your code is that your forms don't have .divs as their descendants. Please read the documentation of .find().

Get the descendants of each element in the current set of matched elements, filtered by a selector, jQuery object, or element.

Change your HTML to

<form>
  <button id="done"type="submit">done</button>
  <div class="divs"></div>
</form>
<form>
  <button id="done"type="submit">done</button>
  <div class="divs"></div>
</form>
<form>
  <button id="done"type="submit">done</button>
  <div class="divs"></div>
</form>

Now, if you press the done button, the corresponding form will trigger its submit event, which will be handled by jQuery. Also, as other answers pointed out, IDs for different elements have to be unique for an HTML page.

If you're just replacing the contents of the inner div, this line is sufficient.

$(this).find('.divs').html(data);

You don't need to empty the div first.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us Javascript

©2020 All rights reserved.