hello community i am not able to display a form that i create in app.js into modal.html
async function getCurrentEntityInfo2() {
try {
const data = await client.data.get("sales_account");
console.log("je suis le sales account", data);
console.log("je suis le sales account", data.sales_account.id);
// clickCount++;
// atPosition2++;
let cmFields = {
nom: `Nom de l'annexe`,
adress1: `Adresse de site annexe (Ligne 1)`,
adress2: `Adresse de site annexe (Ligne 2)`,
adresse3: `Adresse de site annexe (Ligne 3)`,
zip: `Adresse de site annexe (Code postal)`,
ville: `Adresse de site annexe (Ville)`,
pays: `Adresse de site annexe (Pays)`,
email: `Email `,
tel: `Telephone`,
};
// let i;
var addMain = document.createElement("div");
addMain.setAttribute("id", "form-container");
var customFieldsSection2 = document.getElementById("customFieldsSectionUpdate");
customFieldsSection2.appendChild(addMain);
var myForm2 = document.createElement("fw-form");
myForm2.id = "fw-static-form2";
console.log(myForm2);
var formSchema = {
name: "Site Annexe",
fields: [
{
name: "nom_annexe",
label: cmFields.nom,
type: "TEXT",
position: atPosition * 10,
required: true,
placeholder: "Enter…",
hint: "Please provide a text of at max 100 characters",
},
{
name: "adresse_annex_1",
label: cmFields.adress1,
type: "TEXT",
position: atPosition * 10 + 1,
required: true,
placeholder: "Enter…",
hint: "Please provide a text of at max 100 characters",
},
{
name: "adresse_annex_2",
label: cmFields.adress2,
type: "TEXT",
position: atPosition * 10 + 2,
required: true,
placeholder: "Enter…",
hint: "Please provide a text of at max 100 characters",
},
{
name: "adresse_annex_3",
label: cmFields.adresse3,
type: "TEXT",
position: atPosition * 10 + 3,
required: true,
placeholder: "Enter…",
hint: "Please provide a text of at max 100 characters",
},
{
name: "adresse_code_postal",
label: cmFields.zip,
type: "TEXT",
position: atPosition * 10 + 4,
required: true,
placeholder: "Enter…",
hint: "Please provide a text of at max 100 characters",
},
{
name: "adresse_vill",
label: cmFields.ville,
type: "TEXT",
position: atPosition * 10 + 5,
required: true,
placeholder: "Enter…",
hint: "Please provide a text of at max 100 characters",
},
{
name: "adresse_pays",
label: cmFields.pays,
type: "TEXT",
position: atPosition * 10 + 6,
required: true,
placeholder: "Enter…",
hint: "Please provide a text of at max 100 characters",
},
{
name: "adresse_email",
label: cmFields.email,
type: "TEXT",
position: atPosition * 10 + 7,
required: true,
placeholder: "Enter…",
hint: "Please provide a text of at max 100 characters",
},
{
name: "adresse_tel",
label: cmFields.tel,
type: "TEXT",
position: atPosition * 10 + 8,
required: true,
placeholder: "Enter…",
hint: "Please provide a text of at max 100 characters",
},
],
};
var initialValues = {
is_indian_citizen: true,
};
addMain.appendChild(myForm2);
const fields = formSchema?.fields?.map((field) => {
// select expects `text` and `value` prop
return field;
});
const formSchema1 = {
...formSchema,
fields: fields,
};
myForm2.formSchema = formSchema1;
myForm2.initialValues = initialValues;
var addSubmit = document.createElement("fw-button");
addSubmit.textContent = "Submit";
addSubmit.setAttribute("id", "submit");
addMain.appendChild(addSubmit);
var addReset = document.createElement("fw-button");
addReset.textContent = "Reset";
addReset.setAttribute("id", "reset");
addMain.appendChild(addReset);
document.querySelector("#submit").addEventListener("click", async (e) => {
const { values, isValid } = await myForm2.doSubmit(e);
console.log({ values, isValid });
console.log("nous sommes les valeurs de l'utilisateur", values);
console.log(values.nom_annexe);
});
document.querySelector("#reset").addEventListener("click", (e) => {
myForm2.doReset(e);
});
} catch (error) {
console.log(error);
}
}