getParameter возвращает NULL, а getPart не распознается, запрос не содержит multipart / form-data или multipart / mixed поток

Question

У меня две проблемы.Мой сервлет изначально работал, где у меня есть HTML-страница, которая позволяет пользователям вводить свое имя и загружать 2 файла.Однако после того, как мой коллега добавил несколько JS-кодов, кажется, что вся страница ломается

Проблема 1: Главный инженер и офицер баржи возвращают ноль, несмотря на ввод значений.

Проблема 2: signatureFilePartCE выбрасываетЗапрос об ошибке не содержит multipart / form-data.СОП после этой строки тоже не появляется

Я пытался добавить @MultipartConfig в свой сервлет.На входе я попытался настроить код JS, добавив enctype: 'multipart/form-data' и contentType: false, но безрезультатно.

Сервлет

String chiefEngineerName = request.getParameter("chiefName");
String bargeOfficerName = request.getParameter("bargeName");

if (chiefEngineerName != null) {
  boolean check = ExternalUserDAO.checkIfExternalUserRecordExist(jobRefNo, chiefEngineerName);
  System.out.println("Check is: " + check);
  if (!check) {
    chiefEngineer = new ExternalUser(jobRefNo, chiefEngineerName, null, null, "Chief Engineer");
    ExternalUserDAO.insertExternalUser(chiefEngineer);
  }
}
System.out.println("Chief Engineer is: " + chiefEngineerName);
System.out.println("Barge Officer is: " + bargeOfficerName);
Part signatureFilePartForCE = null;

//Retrieving filePart using JS?
try {
  signatureFilePartForCE = request.getPart("chiefSign");
  System.out.println("Hello");
} catch(Exception e) {
  System.out.println(e.getMessage());
}

JS

$("form").submit(function(e) {
  e.preventDefault();

  $.ajax({
    type: "POST",
    //url: domain + '/The_Sailors_Application/UploadExternalUserInfoServlet?referenceNumber' + referenceNo,
    url: domain + '/The_Sailors_Application/TestingServlet?referenceNumber' + referenceNo,
    //data: $(this).serialize(),
    enctype: 'multipart/form-data',
    //contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
    //contentType: false,
    success: function() {
      // callback code here
      $('#errorMessageBox').css("display", "block");
      displayErrorMessage("success", "The changes made to this form had been saved.");
      $(window).scrollTop(0);
      //window.location.href = "timelog.html?referenceNo=" + referenceNo;
    },
    error: function(error) {
      $('#errorMessageBox').css("display", "block");
      displayErrorMessage("danger", "The changes made to this form had failed to be saved. Please try again.");
      $(window).scrollTop(0);
    }

  })
});

HTML

<form method="POST" class="form-horizontal" enctype='multipart/form-data'>
  <tbody>
    <tr>
      <td><input type="text" id="chiefName" name="" pattern="[A-Za-z]{1,50}" title="Only letters are allowed." onchange="chiefEngineerName(this);" placeholder="" class="form-control"><span id="cError" class="help-block"></span></td>
      <td>
        <input type="file" name="chiefSign" accept="image/*" onchange="chiefEngineerSign(this), readURL2(this);
                                                                        capture = camera"><br><br>
        <div id="chiefSign"> <img id="displayImg2" height="100" width="100" /></div>
      </td>
      <td>
        <input type="file" name="chiefStamp" accept="image/*" onchange="chiefEngineerStamp(this), readURL3(this);
                                                                        capture = camera"><br><br>
        <div id="chiefStamp"> <img id="displayImg3" height="100" width="100" /></div>
      </td>
    </tr>
  </tbody>
  <input type="submit" class="btn btn-primary" value="Save">
</form>