How to convert ajax request from jQuery pure js?

Question

I need to convert this jquery ajax to Javascript.

  $("#newsLetter-form").on('submit',function(event){
        event.preventDefault();
        email = $('#emailId').val();
        console.log(email);
        $.ajax({
          url: '/subscribes/emailSubscribe',
          type:'POST',

          data:{
            "_token": "{{ csrf_token() }}",
            email:email,
          },
          success:function(response){
            console.log(response);
            $('#responseFromSub').text("Registred!");
            $('#responseFromSub').css('background','lightgreen')
            $('#newsLetter-form').css('display','none');
            $('.sucsessMessage').fadeIn(1);
            setTimeout(function(){$('.sucsessMessage').fadeOut(1);$('#newsLetter-form').css('display','flex');},3000);
          },
          error:function(response){
            console.log(response);
            var val = 'asdasd:111122:123123123';
            var response1 = response.responseJSON.message.substring(response.responseJSON.message.indexOf("\"title\":"));
            response1 = response1.split(":").pop();
            response1 = response1.split(',')[0];
            response1 = response1.replace("\"", "");
            response1 = response1.replace("\"", "");
            console.log(response1);
            $('#responseFromSub').text(response1);
            $('#responseFromSub').css('background','red');
            $('#newsLetter-form').css('display','none');
            $('.sucsessMessage').fadeIn(1);
            setTimeout(function(){$('.sucsessMessage').fadeOut(1);$('#newsLetter-form').css('display','flex');},3000);
          },
         });
    });

I was googling a lot but I don't how can I push my data by this url in pure js. If someone knows how to do this, please help.

Answer 1

Here is the sample.

const xhr = new XMLHttpRequest();

// listen for `load` event
xhr.onload = () => {
    // print JSON response
    if (xhr.status >= 200 && xhr.status < 300) {
        // parse JSON
        const response = JSON.parse(xhr.responseText);
        console.log(response);
    }
};

// create a JSON object
const json = {
    "email": "abc@example.com",
};

// open request
xhr.open('POST', '/subscribes/emailSubscribe');

// set `Content-Type` header
xhr.setRequestHeader('Content-Type', 'application/json');

// send rquest with JSON payload
xhr.send(JSON.stringify(json));