Hello all,
I have to modify a form made with Chronoforms5. This one can have two statements : small or big. For select statement, there is a combobox, and a necessary function to make the form modifications. But I can't find the file of this function ! Is there a default folder for this kind of file ? Thank you !
I have to modify a form made with Chronoforms5. This one can have two statements : small or big. For select statement, there is a combobox, and a necessary function to make the form modifications. But I can't find the file of this function ! Is there a default folder for this kind of file ? Thank you !
Hi Mathieu1234 ,
Sorry I don't understand your question :-(
What is the function? Can you post a link to the form and tell us where the combo-box is?
Bob
Sorry I don't understand your question :-(
What is the function? Can you post a link to the form and tell us where the combo-box is?
Bob
Hi GreyHead,
thank you for your reply !
I'll try to be more explicit :
I have this code for the form :
There are two main classes : TriathlonInputs and TeamInputs. If the first combobox at top is "Equipe", the form show TeamInputs and hide TriathlonInputs. Else, the form show TriathlonInputs and hide TeamInputs.
Therefore there is necessarily a JS or PHP code for make those changes. So I searched in the "setup", and I found a "load javascript", with two JS files inside : "jquery" and "script.js"
So I searched for the "script.js", and I found it in web\libraries\cegcore\assets\js. Its code is the following :
I've tried to modify this code, but there is no effect !
So I haven't idea where is the real code...
I hope to have been clear enough!
EDIT: I've tried to remove commentaries in the code above, and now there is'nt anything when I change the "type" combobox value ! And I handed over the old code, no effect !?!
thank you for your reply !
I'll try to be more explicit :
I have this code for the form :
<div class="form-group gcore-form-row" id="form-row-1"
><label for="type" class="control-label gcore-label-left">Type</label>
<div class="gcore-input gcore-display-table" id="fin-type">
<select name="type" id="type" size="" class="inputForm validate['required'] form-control A" title="" style="" data-load-state="" data-tooltip="">
<option value="">-- Sélectionnez un type --</option>
<option value="equipe">equipe</option>
<option value="solo">solo</option>
<option value="decouverte">decouverte</option>
</select>
</div>
</div>
<div class="TriathlonInputs" id="TriathlonInputs">
<div class="form-group gcore-form-row" id="form-row-4">
<label for="form-row-3" class="control-label gcore-label-left">Nom</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-3">
<input name="nom-triathlon" id="form-row-3" value="" placeholder="" maxlength="" size="" class="validate['required'] form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-6">
<label for="form-row-5" class="control-label gcore-label-left">Prénom</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-5">
<input name="prenom-triathlon" id="form-row-5" value="" placeholder="" maxlength="" size="" class="form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-42">
<label for="form-row-42" class="control-label gcore-label-left">Sexe</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-42">
<select name="sexe-triathlon" id="form-row-42" size="" class="inputForm validate['required'] form-control A" title="" style="" data-load-state="" data-tooltip="">
<option value="">-- Sélectionnez votre sexe --</option>
<option value="Femme">Femme</option>
<option value="Homme">Homme</option>
</select>
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-8">
<label for="form-row-7" class="control-label gcore-label-left">Adresse</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-7">
<input name="adresse-triathlon" id="form-row-7" value="" placeholder="" maxlength="" size="" class="form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-10">
<label for="form-row-9" class="control-label gcore-label-left">Localité, NPA</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-9">
<input name="localite-triathlon" id="form-row-9" value="" placeholder="" maxlength="" size="" class="form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-12">
<label for="form-row-11" class="control-label gcore-label-left">Date de naissance</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-11">
<input name="naissance-triathlon" id="form-row-11" value="" placeholder="" maxlength="" size="" class="form-control A" title="" style="" data-inputmask="'alias' : 'dd/mm/yyyy'" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-40">
<label for="form-row-40" class="control-label gcore-label-left">E-mail</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-13">
<input name="email-triathlon" id="form-row-13" value="" placeholder="" maxlength="" size="" class="validate['required'] form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
</div>
<div class="TeamInputs" id="TeamInputs">
<h3>Nageur</h3>
<div class="form-group gcore-form-row" id="form-row-16">
<label for="form-row-15" class="control-label gcore-label-left">Nom</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-3">
<input name="nom-natation" id="form-row-3" value="" placeholder="" maxlength="" size="" class="validate['required'] form-control A" title="" style="" data-inputmask="testests" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-18">
<label for="form-row-17" class="control-label gcore-label-left">Prénom</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-5">
<input name="prenom-natation" id="form-row-5" value="" placeholder="" maxlength="" size="" class="form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-43">
<label for="form-row-43" class="control-label gcore-label-left">Sexe</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-43">
<select name="sexe-natation" id="form-row-43" size="" class="inputForm validate['required'] form-control A" title="" style="" data-load-state="" data-tooltip="">
<option value="">-- Sélectionnez votre sexe --</option>
<option value="Femme">Femme</option>
<option value="Homme">Homme</option>
</select>
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-20">
<label for="form-row-19" class="control-label gcore-label-left">Adresse</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-7">
<input name="adresse-natation" id="form-row-7" value="" placeholder="" maxlength="" size="" class="form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-22">
<label for="form-row-21" class="control-label gcore-label-left">Localité, NPA</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-9">
<input name="localite-natation" id="form-row-9" value="" placeholder="" maxlength="" size="" class="form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-23">
<label for="form-row-23" class="control-label gcore-label-left">Date de naissance</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-11">
<input name="naissance-natation" id="form-row-11" value="" placeholder="" maxlength="" size="" class="form-control A" title="" style="" data-inputmask="'alias' : 'dd/mm/yyyy'" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-41">
<label for="form-row-41" class="control-label gcore-label-left">E-mail</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-13">
<input name="email-natation" id="form-row-13" value="" placeholder="" maxlength="" size="" class="validate['required'] form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<h3>Coureur</h3>
<div class="form-group gcore-form-row" id="form-row-24">
<label for="form-row-24" class="control-label gcore-label-left">Nom</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-3">
<input name="nom-course" id="form-row-3" value="" placeholder="" maxlength="" size="" class="validate['required'] form-control A" title="" style="" data-inputmask="testests" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-25">
<label for="form-row-25" class="control-label gcore-label-left">Prénom</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-5">
<input name="prenom-course" id="form-row-5" value="" placeholder="" maxlength="" size="" class="form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-44">
<label for="form-row-44" class="control-label gcore-label-left">Sexe</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-44">
<select name="sexe-course" id="form-row-44" size="" class="inputForm validate['required'] form-control A" title="" style="" data-load-state="" data-tooltip="">
<option value="">-- Sélectionnez votre sexe --</option>
<option value="Femme">Femme</option>
<option value="Homme">Homme</option>
</select>
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-26">
<label for="form-row-26" class="control-label gcore-label-left">Adresse</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-7">
<input name="adresse-course" id="form-row-7" value="" placeholder="" maxlength="" size="" class="form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-27">
<label for="form-row-27" class="control-label gcore-label-left">Localité, NPA</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-9">
<input name="localite-course" id="form-row-9" value="" placeholder="" maxlength="" size="" class="form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-28">
<label for="form-row-28" class="control-label gcore-label-left">Date de naissance</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-11">
<input name="naissance-course" id="form-row-11" value="" placeholder="" maxlength="" size="" class="form-control A" title="" style="" data-inputmask="'alias' : 'dd/mm/yyyy'" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-39">
<label for="form-row-39" class="control-label gcore-label-left">E-mail</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-13">
<input name="email-course" id="form-row-13" value="" placeholder="" maxlength="" size="" class="validate['required'] form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<h3>Cycliste</h3>
<div class="form-group gcore-form-row" id="form-row-29">
<label for="form-row-29" class="control-label gcore-label-left">Nom</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-3">
<input name="nom-velo" id="form-row-3" value="" placeholder="" maxlength="" size="" class="validate['required'] form-control A" title="" style="" data-inputmask="testests" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-30">
<label for="form-row-30" class="control-label gcore-label-left">Prénom</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-5">
<input name="prenom-velo" id="form-row-5" value="" placeholder="" maxlength="" size="" class="form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-45">
<label for="form-row-45" class="control-label gcore-label-left">Sexe</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-45">
<select name="sexe-velo" id="form-row-45" size="" class="inputForm validate['required'] form-control A" title="" style="" data-load-state="" data-tooltip="">
<option value="">-- Sélectionnez votre sexe --</option>
<option value="Femme">Femme</option>
<option value="Homme">Homme</option>
</select>
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-31">
<label for="form-row-31" class="control-label gcore-label-left">Adresse</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-7">
<input name="adresse-velo" id="form-row-7" value="" placeholder="" maxlength="" size="" class="form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row32">
<label for="form-row-32" class="control-label gcore-label-left">Localité, NPA</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-9">
<input name="localite-velo" id="form-row-9" value="" placeholder="" maxlength="" size="" class="form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-33">
<label for="form-row-33" class="control-label gcore-label-left">Date de naissance</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-11">
<input name="naissance-velo" id="form-row-11" value="" placeholder="" maxlength="" size="" class="form-control A" title="" style="" data-inputmask="'alias' : 'dd/mm/yyyy'" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-38">
<label for="form-row-38" class="control-label gcore-label-left">E-mail</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-13">
<input name="email-velo" id="form-row-13" value="" placeholder="" maxlength="" size="" class="validate['required'] form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" />
</div>
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-15">
<label for="form-row-34" class="control-label gcore-label-left">Message</label>
<div class="gcore-input gcore-display-table" id="fin-form-row-34">
<textarea name="message" id="form-row-34" placeholder="" rows="3" cols="40" class="form-control A" title="" style="" data-wysiwyg="0" data-load-state="" data-tooltip=""></textarea>
</div>
</div>
<div class="form-group gcore-form-row" id="form-row-21">
<label for="fld16" class="control-label gcore-label-left">Captcha</label>
<div class="gcore-subinput-container-wide" id="fitem18">
<div class="gcore-input pull-left gcore-sub-input gcore-display-table" id="fin-fld17"><input placeholder="" maxlength="" size="5" class="validate['required'] form-control A" title="" style="" type="text" name="captcha" id="fld17" />
</div>
</div>
<div class="gcore-subinput-container-wide" id="fitem20">
<div class="gcore-input pull-left gcore-sub-input gcore-display-table" id="fin-fld19">{captcha_img}</div>
</div>
</div>
<p>Un email de confirmation sera envoyé à tous les inscrits</p>
<div class="form-group gcore-form-row" id="form-row-22">
<div class="gcore-input gcore-display-table" id="fin-button10">
<input name="button10" id="button10" type="submit" value="s'inscrire" class="form-control A" style="" data-load-state="" /></div></div>
</div>There are two main classes : TriathlonInputs and TeamInputs. If the first combobox at top is "Equipe", the form show TeamInputs and hide TriathlonInputs. Else, the form show TriathlonInputs and hide TeamInputs.
Therefore there is necessarily a JS or PHP code for make those changes. So I searched in the "setup", and I found a "load javascript", with two JS files inside : "jquery" and "script.js"
So I searched for the "script.js", and I found it in web\libraries\cegcore\assets\js. Its code is the following :
function showTeamInputs(){
/*var teamInputs = [
$('#nom-natation').parent().parent(),
$('#prenom-natation').parent().parent(),
$('#adresse-natation').parent().parent(),
$('#localite-natation').parent().parent(),
$('#naissance-natation').parent().parent(),
$('#email-natation').parent().parent(),
$('#nom-course').parent().parent(),
$('#prenom-course').parent().parent(),
$('#adresse-course').parent().parent(),
$('#localite-course').parent().parent(),
$('#naissance-course').parent().parent(),
$('#email-course').parent().parent(),
$('#nom-velo').parent().parent(),
$('#prenom-velo').parent().parent(),
$('#adresse-velo').parent().parent(),
$('#localite-velo').parent().parent(),
$('#naissance-velo').parent().parent(),
$('#email-velo').parent().parent()
];
$.each(teamInputs, function(index, element){
element.css('display', 'block');
});*/
//$('#equipe').css('display', 'block');
document.getElementById('equipe').style.display = "block";
}
function hideTeamInputs(){
/*var teamInputs = [
$('#nom-natation').parent().parent(),
$('#prenom-natation').parent().parent(),
$('#adresse-natation').parent().parent(),
$('#localite-natation').parent().parent(),
$('#naissance-natation').parent().parent(),
$('#email-natation').parent().parent(),
$('#nom-course').parent().parent(),
$('#prenom-course').parent().parent(),
$('#adresse-course').parent().parent(),
$('#localite-course').parent().parent(),
$('#naissance-course').parent().parent(),
$('#email-course').parent().parent(),
$('#nom-velo').parent().parent(),
$('#prenom-velo').parent().parent(),
$('#adresse-velo').parent().parent(),
$('#localite-velo').parent().parent(),
$('#naissance-velo').parent().parent(),
$('#email-velo').parent().parent()
];
$.each(teamInputs, function(index, element){
element.css('display', 'none');
});*/
//$('#equipe').css('display', 'none');
document.getElementById('equipe').style.display = "none";
}
function showTriathlonInputs(){
/*var triathlonInputs = [
$('#nom-triathlon').parent().parent(),
$('#prenom-triathlon').parent().parent(),
$('#adresse-triathlon').parent().parent(),
$('#localite-triathlon').parent().parent(),
$('#naissance-triathlon').parent().parent(),
$('#email-triathlon').parent().parent()
];
$.each(triathlonInputs, function(index, element){
element.css('display', 'block');
});*/
//$('#personne-simple').css('display', 'block');
document.getElementById('personne-simple').style.display = "block";
}
function hideTriathlonInputs(){
/*var triathlonInputs = [
$('#nom-triathlon').parent().parent(),
$('#prenom-triathlon').parent().parent(),
$('#adresse-triathlon').parent().parent(),
$('#localite-triathlon').parent().parent(),
$('#naissance-triathlon').parent().parent(),
$('#email-triathlon').parent().parent()
];
$.each(triathlonInputs, function(index, element){
element.css('display', 'none');
});*/
//$('#personne-simple').css('display', 'none');
document.getElementById('personne-simple').style.display = "none";
}
/*
function validation(){
var valid = true;
if($('#equipe').css('display') == "none"){
//Test les champs obligatoires
if($('#nom-triathlon').val() == ""){
valid = false;
$('#nom-triathlon').parent().parent().addClass('has-error');
$('#nom-triathlon').attr('placeholder', 'Champ requis !');
}
if($('#prenom-triathlon').val() == ""){
valid = false;
$('#prenom-triathlon').parent().parent().addClass('has-error');
$('#prenom-triathlon').attr('placeholder', 'Champ requis !');
}
if($('#adresse-triathlon').val() == ""){
valid = false;
$('#adresse-triathlon').parent().parent().addClass('has-error');
$('#adresse-triathlon').attr('placeholder', 'Champ requis !');
}
if($('#localite-triathlon').val() == ""){
valid = false;
$('#localite-triathlon').parent().parent().addClass('has-error');
$('#localite-triathlon').attr('placeholder', 'Champ requis !');
}
if($('#naissance-triathlon').val() == ""){
valid = false;
$('#naissance-triathlon').parent().parent().addClass('has-error');
$('#naissance-triathlon').attr('placeholder', 'Champ requis !');
}
}else{
//Test les champs obligatoires
if($('#nom-natation').val() == ""){
valid = false;
$('#nom-natation').parent().parent().addClass('has-error');
$('#nom-natation').attr('placeholder', 'Champ requis !');
}
if($('#prenom-natation').val() == ""){
valid = false;
$('#prenom-natation').parent().parent().addClass('has-error');
$('#prenom-natation').attr('placeholder', 'Champ requis !');
}
if($('#adresse-natation').val() == ""){
valid = false;
$('#adresse-natation').parent().parent().addClass('has-error');
$('#adresse-natation').attr('placeholder', 'Champ requis !');
}
if($('#localite-natation').val() == ""){
valid = false;
$('#localite-natation').parent().parent().addClass('has-error');
$('#localite-natation').attr('placeholder', 'Champ requis !');
}
if($('#naissance-natation').val() == ""){
valid = false;
$('#naissance-natation').parent().parent().addClass('has-error');
$('#naissance-natation').attr('placeholder', 'Champ requis !');
}
if($('#nom-course').val() == ""){
valid = false;
$('#nom-course').parent().parent().addClass('has-error');
$('#nom-course').attr('placeholder', 'Champ requis !');
}
if($('#prenom-course').val() == ""){
valid = false;
$('#prenom-course').parent().parent().addClass('has-error');
$('#prenom-course').attr('placeholder', 'Champ requis !');
}
if($('#adresse-course').val() == ""){
valid = false;
$('#adresse-course').parent().parent().addClass('has-error');
$('#adresse-course').attr('placeholder', 'Champ requis !');
}
if($('#localite-course').val() == ""){
valid = false;
$('#localite-course').parent().parent().addClass('has-error');
$('#localite-course').attr('placeholder', 'Champ requis !');
}
if($('#naissance-course').val() == ""){
valid = false;
$('#naissance-course').parent().parent().addClass('has-error');
$('#naissance-course').attr('placeholder', 'Champ requis !');
}
if($('#nom-velo').val() == ""){
valid = false;
$('#nom-velo').parent().parent().addClass('has-error');
$('#nom-velo').attr('placeholder', 'Champ requis !');
}
if($('#prenom-velo').val() == ""){
valid = false;
$('#prenom-velo').parent().parent().addClass('has-error');
$('#prenom-velo').attr('placeholder', 'Champ requis !');
}
if($('#adresse-velo').val() == ""){
valid = false;
$('#adresse-velo').parent().parent().addClass('has-error');
$('#adresse-velo').attr('placeholder', 'Champ requis !');
}
if($('#localite-velo').val() == ""){
valid = false;
$('#localite-velo').parent().parent().addClass('has-error');
$('#localite-velo').attr('placeholder', 'Champ requis !');
}
if($('#naissance-velo').val() == ""){
valid = false;
$('#naissance-velo').parent().parent().addClass('has-error');
$('#naissance-velo').attr('placeholder', 'Champ requis !');
}
}
}*/
function individualValidation(element){
if(document.getElementById('personne-simple').style.display != "none"){
if($(element).val() != ""){
return true;
}
return false;
}
return true;
}
function teamValidation(element){
if(document.getElementById('equipe').style.display != "none"){
if($(element).val() != ""){
return true;
}
return false;
}
return true;
}
$(document).ready(function(){
if(document.getElementById('type').value == 'equipe'){
showTeamInputs();
hideTriathlonInputs();
}else{
hideTeamInputs();
showTriathlonInputs();
}
});
I've tried to modify this code, but there is no effect !
So I haven't idea where is the real code...
I hope to have been clear enough!
EDIT: I've tried to remove commentaries in the code above, and now there is'nt anything when I change the "type" combobox value ! And I handed over the old code, no effect !?!
This topic is locked and no more replies can be posted.
