1st commit
This commit is contained in:
46
wco/formmanager/form_fr.mustache
Normal file
46
wco/formmanager/form_fr.mustache
Normal file
@@ -0,0 +1,46 @@
|
||||
<div class="contactform grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
|
||||
<div class="form-control">
|
||||
<input type="text" id="name" placeholder="Votre nom"
|
||||
class="input input-bordered bg-white" />
|
||||
<label for="name" class="label floating-label">Votre nom</label>
|
||||
</div>
|
||||
|
||||
<div class="form-control">
|
||||
<input type="email" id="mail" placeholder="Votre Email"
|
||||
class="input input-bordered bg-white" />
|
||||
<label for="mail" class="label floating-label">Votre Email</label>
|
||||
</div>
|
||||
|
||||
<div class="form-control">
|
||||
<input type="text" id="mobile" placeholder="Votre téléphone"
|
||||
class="input input-bordered bg-white" />
|
||||
<label for="mobile" class="label floating-label">Votre téléphone</label>
|
||||
</div>
|
||||
|
||||
<div class="form-control">
|
||||
<select class="select select-bordered bg-white" id="service">
|
||||
<option selected value="syndic">Un syndic</option>
|
||||
<option value="particulier">Un particulier</option>
|
||||
<option value="entreprise">Une entreprise</option>
|
||||
<option value="collectivité">Une collectivité</option>
|
||||
</select>
|
||||
<label for="service" class="label floating-label">Vous êtes:</label>
|
||||
</div>
|
||||
|
||||
<div class="form-control md:col-span-2">
|
||||
<textarea id="message" class="textarea textarea-bordered bg-white h-32"></textarea>
|
||||
<label for="message" class="label floating-label">Message</label>
|
||||
</div>
|
||||
|
||||
<div class="md:col-span-2 text-center">
|
||||
<button class="btn btn-primary w-full py-3"
|
||||
onclick="apx.sendform(...)">Envoyer votre demande</button>
|
||||
</div>
|
||||
|
||||
<!-- Messages de feedback -->
|
||||
<div class="answerok alert alert-success hidden"></div>
|
||||
<div class="answerko alert alert-error hidden">
|
||||
<p class="text-error-content">En maintenance, ré-essayez plus tard</p>
|
||||
</div>
|
||||
</div>
|
||||
35
wco/formmanager/formdata_fr.json
Normal file
35
wco/formmanager/formdata_fr.json
Normal file
@@ -0,0 +1,35 @@
|
||||
{
|
||||
"$schema": "https://json-schema.org/draft/2020-12/schema",
|
||||
"$id": "/schema/contact",
|
||||
"title": "Contact information ",
|
||||
"description": "A form submission data",
|
||||
"type": "object",
|
||||
"properties": {
|
||||
"contactid": {
|
||||
"title":"A unique string fromalias_fromuuid_toalias_touuid_timestamp",
|
||||
"type":"string",
|
||||
"default":"createcontactid",
|
||||
"formclass":"hidden"
|
||||
},
|
||||
"name":{
|
||||
"title":"Name",
|
||||
"description":"",
|
||||
"type":"string",
|
||||
"formclass":"input",
|
||||
"placeholder":"Votre nom"
|
||||
},
|
||||
"mailm":{
|
||||
"title":"Email",
|
||||
"description":"",
|
||||
"type":"string",
|
||||
"formclass":"input",
|
||||
"placeholder":"Votre nom"
|
||||
},
|
||||
"mobile":{
|
||||
"title":"",
|
||||
"description":"",
|
||||
"type":"string",
|
||||
"formclass":"input"
|
||||
}
|
||||
}
|
||||
}
|
||||
127
wco/formmanager/formmanager.js
Normal file
127
wco/formmanager/formmanager.js
Normal file
@@ -0,0 +1,127 @@
|
||||
var apx = apx || {};
|
||||
apx.form = {};
|
||||
|
||||
/**
|
||||
* Data form schema
|
||||
* {}
|
||||
*
|
||||
* Will produce a html expected:
|
||||
* <div class="formmanager">
|
||||
* <input data-name="keydata" data-format="checkJSON" value="defaultvalue" placeholder="" />
|
||||
* .. any other data field
|
||||
* <button class="getdata" onclick="apx.form.submit(this,cb)">save</button>
|
||||
* </div>
|
||||
*
|
||||
*/
|
||||
|
||||
|
||||
|
||||
apx.form.build = (elt,schema,data)=>{
|
||||
// Build in html a form with all prerequest and prefill by data into a DOM element elt
|
||||
|
||||
};
|
||||
apx.form.submit = (elt,cb)
|
||||
|
||||
/**
|
||||
* To install in html input onclick=apx.form.enter to simulate a senddata
|
||||
* @param {*} elt
|
||||
* @param {*} event
|
||||
*/
|
||||
apx.form.enter = (elt, event) => {
|
||||
if (event.keyCode === 13) {
|
||||
const getform = elt.closest(".contactform");
|
||||
event.preventDefault();
|
||||
getform.querySelector(".sendregister").click();
|
||||
}
|
||||
};
|
||||
// apx.sendform(this,{route:'actions/contact',order:'registercontact',srckey:'teasingwebpage',mlist:'getinform'},fctregisteremail)
|
||||
registerlist.check = {
|
||||
email:
|
||||
/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/,
|
||||
telephone: /^0[1-9][0-9]{8}$/,
|
||||
profil: /^(seeker|recruiter)$/,
|
||||
};
|
||||
registerlist.msg = {
|
||||
email: "Vérifier votre email ",
|
||||
telephone: "Verifier votre téléphone ",
|
||||
profil: "Choisir votre profil ",
|
||||
serverissue:
|
||||
"Désolé, un probléme empeche votre inscription, réessayer plus tard",
|
||||
register: "Vous êtes bien inscrits",
|
||||
alreadysent: "Vous avez déjà envoyé votre email ",
|
||||
};
|
||||
registerlist.send = async (elt) => {
|
||||
const formdata = {};
|
||||
// formdata.uuid = (localStorage.getItem('xuuid')) ? localStorage.getItem('xuuid'):"uuidunknown";
|
||||
const form = elt.closest(".contactform");
|
||||
form.querySelector(".answer").innerHTML = "";
|
||||
var valid = true;
|
||||
form.querySelectorAll("input,textarea,option:checked").forEach((e) => {
|
||||
if (!e.name) e.name = info.getAttribute("name");
|
||||
if (e.name == "email") formdata.typekey = "email";
|
||||
if (e.name == "telephone") formdata.typekey = "telephone";
|
||||
|
||||
if (!e.type || e.type !== "radio" || (e.type == "radio" && e.checked)) {
|
||||
//check value
|
||||
if (
|
||||
registerlist.check[e.name] &&
|
||||
!registerlist.check[e.name].test(e.value)
|
||||
) {
|
||||
form.querySelector(".answer").innerHTML +=
|
||||
registerlist.msg[e.name] + " ";
|
||||
form.querySelector(".answer").classList.remove("d-none");
|
||||
valid = false;
|
||||
}
|
||||
if (!formdata[e.name]) {
|
||||
formdata[e.name] = e.value;
|
||||
} else {
|
||||
// array case multi input with same name
|
||||
formdata[e.name] = [formdata[e.name]];
|
||||
formdata[e.name].push(e.value);
|
||||
}
|
||||
}
|
||||
});
|
||||
formdata.tribe=apxtri.headers.xtribe
|
||||
if (!formdata.profil || formdata.profil == "") {
|
||||
// Pas de choix
|
||||
formdata.profil = "both";
|
||||
//form.querySelector(".answer").innerHTML = registerlist.msg.profil;
|
||||
//form.querySelector(".answer").classList.remove("d-none");
|
||||
}
|
||||
//add phil
|
||||
|
||||
formdata.mlist += formdata.profil;
|
||||
console.log(formdata);
|
||||
if (
|
||||
valid &&
|
||||
formdata.profil &&
|
||||
formdata.srckey &&
|
||||
(formdata.email || formdata.telephone)
|
||||
) {
|
||||
form.querySelector(".submitbtn").classList.add("d-none");
|
||||
form.querySelector(".loaderbtn").classList.remove("d-none");
|
||||
const datasent = await axios.post(
|
||||
"/api/apxtri/notifications/registeranonymous",
|
||||
formdata,
|
||||
{ headers: apx.data.headers }
|
||||
);
|
||||
//console.log(datasent)
|
||||
if (datasent.data.status == 200) {
|
||||
form.querySelector(".answer").innerHTML = registerlist.msg.register;
|
||||
form.querySelector(".answer").classList.remove("d-none");
|
||||
form.querySelector(".loaderbtn").classList.add("d-none");
|
||||
elt.setAttribute(
|
||||
"onclick",
|
||||
`"alert('${registerlist.msg.alreadysent}');"`
|
||||
);
|
||||
//document.location.href = "thank-you.html";
|
||||
} else {
|
||||
form.querySelector(".answer").innerHTML = registerlist.msg.serverissue;
|
||||
form.querySelector(".answer").classList.remove("d-none");
|
||||
}
|
||||
} else {
|
||||
console.log(
|
||||
"Check your form it miss something profil or srckey or email or telephone"
|
||||
);
|
||||
}
|
||||
};
|
||||
Reference in New Issue
Block a user