My is code

index.html:

<form action="https://localhost:1000/rest/api/submit-job/testhtml" method="GET">
        <div id="name-group" class="form-group">
          <label for="texta">texta</label>
          <input
            type="text"
            class="form-control"
            id="texta"
            name="texta"
          />
        </div>          
        <button type="submit" class="btn btn-success">
        
          Generate PDF
        </button>

form.js:

$(document).ready(function () {
  $("form").submit(function (event) {
    var formData = {
      texta: $("#texta").val(),
    };

    $.ajax({
      type: "GET",
      url: "https://localhost:10000/rest/api/submit-job/testhtml",
      data: formData,
      dataType: "text",
      encode: true,
    }).done(function (data) {
      console.log(data);
      document.write("<embed width='1300px' height='1250px' src=" + data + ">");      
    });
    event.preventDefault();
  });
  
});

My api returns PDF in base64 and it works just fine, but is there a better way to do it? for example, those forms in index.html disappear and I don't want them to disappear. Thank you.