Convert Form Data into Request Data for an AJAX Request

Question

I am trying to submit my form data via a POST AJAX request and cannot find any solutions.

I can't just get the values by ID or name etc because it is dynamically created depending on data from a database.

I have tried using the childNodes and think this may be a solution but cannot figure it out. Do I need to use JQuery? Can it be done with just JS as I'm a beginner.

Any ideas would be appreciated, cheers.

Answer 1

Did you tried below

$( "form" ).submit(function( event ) {
 ( var jsonData = $( this ).serializeArray() );
  event.preventDefault();
 // --- Your Ajax request
});

Answer 2

What you can do is just give an id (here i am giving form_id ) to the form

$('#form_id').submit(function(){
  e.preventDefault();
  $.ajax({
        type: "POST",
        url: "your_url",
        data: $('#form_id').serialize(),
        success: function (data) {
            alert('ok');
        }
  });
})

Cheers. :)