Jquery success function is not called after executing the rest url

Looking at https://api.jquery.com/trigger, I don't think you can pass a function as the second parameter to the "trigger" method. That argument should be an object or array containing some extra options which are then passed to the event handler function (which should be declared elsewhere). The anonymous function you've defined there runs. Therefore, the normal postback behaviour of the form carries on regardless, and there's no ajax call. That's why you appear to see a response, but don't get the "success" or "error" callbacks triggered - there's never an ajax call in the first place.

What you've done is not the correct way to define an event on an element. The "trigger" method is intended to trigger an event which has already been defined previously. It can't be used to define the event handler itself.

This should work - it creates an event handler for the "submit" event of the form, which suppresses the default postback behaviour and runs the ajax call instead:

$(document).ready(function() {
  $("#CreateAttachmentForm").submit(function(event) {
    event.preventDefault(); //stop default postback behaviour.
    $.ajax({
      url: 'http://HDDT0214:8080/pqawdTestWebApp/uploadFile',
      type: 'POST',
      data: formData,
      success: function (data) {
        alert("test");
        alert(JSON.stringify(data));
      },
      error: function(jqXHR, errorThrown, textStatus) {
        alert("Ajax error: " + jqXHR.status + " - " + jqXHR.statusText);
        console.log(jqXHR.responseText);
      },
      contentType: false,
      processData: false
    });
  });
});

You can then remove the createAttachmentRequest() function and all references to it.

N.B. This will work as long as whatever is renders an or