JSFiddle - React, Tailwind, and code Playground

by brendanbond

HTML

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.form.io/formiojs/4.14.13/formio.full.min.css" />

<div class="container">
<div id="formio"></div>
</div>
<script src="https://cdn.form.io/formiojs/4.14.13/formio.full.js"></script>

JavaScript

var defaultTranslationDict = {
  'Please enter a valid email address': 'Please enter a valid email address',
};

var baseUrl = 'https://webforms.alludo.co';
var projectUrl = 'https://webforms.alludo.co/authoring-zgbzrtfswqjmgsj/';
var formUrl =
  'https://webforms.alludo.co/authoring-zgbzrtfswqjmgsj/parallelsRasForm';
// Reproduce issue: Form always loads resource with data.formLanguage=en first

Formio.setBaseUrl(baseUrl);
Formio.setProjectUrl(projectUrl);

Formio.fetch(projectUrl + 'language/submission?data.language=' + 'kr')
  .then(function (resp) {
    return resp.json();
  })
  .then(([krSubmission]) => {
    Formio.createForm(document.getElementById('formio'), formUrl, {
      language: krSubmission.data.language,
      i18n: {
        kr: krSubmission.data.translations,
      },
    });
  });