Workflow Trigger Code 202211

DEMO




Workflow App example

Trigger Code

<form id="email_verification_trigger">
  <label for="qEmail"><strong>Registered Email Address ／ ご登録メールアドレス</strong>:</label><br>
  <input  id="qEmail" type="email" name="q_Email"
    placeholder="you@example.com" required size="32" maxlength="64" autocomplete="on" autofocus><br>
  <label for="qProcedure"><strong>Procedures ／ お手続き</strong>:</label><br>
  <select id="qProcedure" name="q_Procedure">
    <option value="">--Please choose an option--</option>
    <option value="password">Reset Password (Forget Password)</option>
    <option value="magazine">Stop Mail Magazine</option>
    <option value="payment">Change Payment Method</option>
  </select>
  <input type="submit" value="Send">
</form>
<div id="email_verification_log"></div>

<script>
const strStartUrl = "https://example.questetra.net/System/Event/MessageStart/99/0/start"; // ★★
const strKey      = "ZaMvJs9YA27pybqKgvFmlczTDfEEoKVL"; // ★★See your workflow app★★
const strIdForm   = "#email_verification_trigger";      // ★must be same as Trigger form id★
const strIdLog    = "#email_verification_log";          // ★must be same as Log div id★

const elTriggerForm = document.querySelector ( strIdForm );
elTriggerForm.addEventListener ( 'submit', function(ev) {
  ev.preventDefault();
  let elOutput = document.querySelector( strIdLog );
  let objFormData = new FormData( elTriggerForm );
  objFormData.append ( 'key', strKey );

  fetch( strStartUrl, {	method: 'POST', mode: 'cors', body: objFormData } ).then( response => {
    console.log( 'response: ' + response.ok + " " + response.status + " " + response.statusText );
      // https://developer.mozilla.org/docs/Web/API/Response
    if ( !response.ok ) { throw new Error( "response was not ok" ); } // go "catch"
    return response.text(); // QBPMS responces the string PID.
  })
  .then( (text) => {
    elOutput.innerHTML = "Accepted (ID: " + text + "). A URL will be sent to you.";
    elTriggerForm.reset();
      // https://developer.mozilla.org/docs/Web/API/HTMLFormElement/reset
  })
  .catch( (error) => {
    elOutput.innerHTML = error;
  });
}, false);
</script>
%d