27,20 → 27,56 |
// Il est possible de supprimer un fichier |
// donc on vérifie que le 'change' est un ajout ou modificationis-defaut-value |
if( !$.isEmptyObject( event.target.files[0] ) ) { |
|
var file = event.target.files[0], |
$theReturn = $( '.' + $( this ).attr( 'id' ) ); |
fileInputId = $( this ).attr( 'id' ), |
$theReturn = $( '.' + fileInputId ); |
// Affichage du nom du fichier |
$theReturn.text( file.name ); |
// Si le fichier est une image on l'affiche |
if( file.type.match( 'image/*' ) ) { |
$theReturn.text( file.name ).removeClass( 'hidden') ; |
|
if( 5242880 < file.size ) { |
$theReturn.append( |
'<p class="message">'+ |
'<i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i> '+ |
'La taille du fichier ne doit pas dépasser 5Mo'+ |
'</p>' |
) |
.addClass( 'invalid' ); |
// lib : https://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js |
$( this ).clearInputs(); |
console.log(file); |
|
} else if( file.type.match( 'image/*' ) && 'especes' !== fileInputId ) { |
// Si le fichier est une image (et qu'on est pas sur "especes") on l'affiche |
// Chemin temporaire de l'image et affichage |
var tmppath = URL.createObjectURL( file ); |
$theReturn.removeClass( 'hidden' ).append( '<img src="' + tmppath + '" width="50%">' ); |
} else { |
$theReturn.removeClass( 'hidden' ).append( '<p>Le fichier doit être au format image (jpg, png, etc.)</p>' ); |
$theReturn.append( '<img src="' + tmppath + '" width="50%">' ).removeClass( 'invalid' );; |
|
} else if ( !( 'especes' === fileInputId && file.type.match( 'text/csv' ) ) ) { |
// on a pas un type image, ou on est sur une liste d'espèces mais on a pas un csv |
|
if( 'especes' === fileInputId ) {// cas où on demandait un csv |
$theReturn.append( |
'<p class="message">'+ |
'<i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i> '+ |
'Le fichier doit être au format csv'+ |
'</p>' |
) |
.addClass( 'invalid' ); |
} else { // cas où on demandait un format image |
$theReturn.append( |
'<p class="message">'+ |
'<i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i> '+ |
'Le fichier doit être au format image (jpg, png, etc.)'+ |
'</p>' |
) |
.addClass( 'invalid' ); |
} |
// lib : https://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js |
$( this ).clearInputs(); |
console.log(file); |
} else {// file "especes" csv ok |
$theReturn.append( ' <i class="fa fa-check-circle" aria-hidden="true" style="color:#B3C954;font-size:1.3rem"></i>' ).removeClass( 'invalid' ); |
} |
} |
}); |
107,12 → 143,12 |
'<h3>Nouveau champ :<br><strong class="field-title" data-id="' + fieldIndex + '"></strong></h3>'+ |
// Nom du champ |
'<label for="field-name" title="Donnez un titre à votre champ">Nom du champ *</label>'+ |
'<input type="text" name="field-name" data-id="' + fieldIndex + '" class="field-name" placeholder="Titre de votre champ" title="Donnez un titre à votre champ" required>'+ |
'<input type="text" name="field-name" data-id="' + fieldIndex + '" class="field-name" placeholder="Titre de votre champ" title="Le titre du champ" required>'+ |
// Clé du champ |
'<label for="field-key" title="Nom du champ dans la base de données">'+ |
'Clé du champ *'+ |
'</label>'+ |
'<input type="text" name="field-key" data-id="' + fieldIndex + '" class="field-key" placeholder="Clé du champ" Pattern="^(?:[a-z]+(?:(?:[A-Z][a-z]+)+)?|[a-z]+(?:(?:-[a-z]+)+)?)$" title="Clé Unique en Camelcase ou minuscule séparés par tirets, pas d\'accents pas de caractères spéciaux." required>'+ |
'<input type="text" name="field-key" data-id="' + fieldIndex + '" class="field-key" placeholder="Clé du champ" pattern="^(?:[a-z]+(?:(?:[A-Z]+[a-z]+)+)?|[a-z]+(?:(?:-[a-z]+)+)?)$" title="Clé Unique en Camelcase ou minuscule séparés par tirets, pas d\'accents pas de caractères spéciaux." required>'+ |
'<p class="message">' + |
'<i class="fa fa-exclamation-triangle" aria-hidden="true" style="color:#ff5d55"></i> '+ |
'Une clé doit être unique<br>' + |
331,7 → 367,7 |
if( '' !== $( this ).val() ) { |
$( '.is-defaut-value', thisValue ).removeAttr( 'disabled' ); |
} else { |
$( '.is-defaut-value', thisValue ).attr( 'disabled', true ).removeAttr( 'checked' ); |
$( '.is-defaut-value', thisValue ).attr( 'disabled', true ).attr( 'checked' , false ); |
} |
}); |
} |
342,9 → 378,9 |
|
if( selectedFieldElement === 'select' || selectedFieldElement === 'radio' ) { |
$( '.is-defaut-value[data-id="' + fieldIndex + '"]' ).click( function() { |
if( $( this ).attr( 'checked' ) ) { |
if( $( this ).is( ':checked' ) ) { |
// Décocher tous les autres |
$( '.is-defaut-value[data-id="' + fieldIndex + '"]:checked' ).not( $( this) ).removeAttr( 'checked' ); |
$( '.is-defaut-value[data-id="' + fieldIndex + '"]:checked' ).not( $( this) ).attr( 'checked' , false ); |
} |
}); |
} |
566,8 → 602,6 |
datasToSubmit[ resultArrayIndex ].unit = $( '.field-unit' , thisFieldset ).val() || null; |
// Ajout du tooltip au tableau de resultats |
datasToSubmit[ resultArrayIndex ].description = $( '.field-description' , thisFieldset ).val() || null; |
// Ajout du nom du document d'aide au tableau de resultats |
datasToSubmit[ resultArrayIndex ].help = $( '.file-return.help-doc-' + index ).text() || null; |
// Collecte les des données dépendantes de l'élément choisi |
// sous forme d'un tableau de resultats |
onSelectCollectDataValuesToSubmit( datasToSubmit[ resultArrayIndex ] , thisFieldset ); |
576,16 → 610,38 |
delete datasToSubmit[ resultArrayIndex ].fieldValues; |
} |
// Copie d'un champ de fichier d'aide dans le bloc d'envoi |
if( '' !== $( '.field-help' , thisFieldset ).val() ) { |
if( 0 < $( '.field-help' , thisFieldset ).get(0).files.length ) { |
console.log( $( '.field-help' , thisFieldset ).get(0).files[0].type ); |
// Présence d'un document d'aide |
datasToSubmit[ resultArrayIndex ].help = $( '.field-help' , thisFieldset ).get(0).files[0].type; |
$( '.field-help' , thisFieldset ).clone() |
.attr( 'name' , 'help-' + datasToSubmit[ resultArrayIndex ].key )// l'attribut name prend la valeur de la clé |
.appendTo( '#help-doc-submit' ); |
} else { |
datasToSubmit[ resultArrayIndex ].help = null; |
} |
resultArrayIndex++; |
} |
} |
var resultsArrayJson = JSON.stringify( datasToSubmit ); |
console.log(resultsArrayJson); |
|
var resultsArrayJson = JSON.stringify( datasToSubmit , replacer ); |
|
// JSON.strigify : Gestion des apostrophes dans les valeurs : |
function replacer( key , value ) { |
if ( 'fieldValues' === key && 'object' === typeof value ) { |
for ( var i in value ) { |
if ( typeof value[i] === 'string' ) { |
value[i] = value[i].replace( /\u0027/g, "''" ); |
} |
} |
} else if ( typeof value === 'string' ) { |
value = value.replace( /\u0027/g, "''" ); |
} |
return value; |
} |
|
console.log( resultsArrayJson ); |
|
// Désactivation de tous les champs et boutons (nouveaux champs) |
$( '#new-fields, #new-fields .button , #add-fields , #preview-field' ).addClass( 'disabled' ); |
$( '#validate-new-fields' ).addClass( 'validated' ); |
592,7 → 648,8 |
$( '.validate-new-fields' ).text( 'Champs validés' ); |
// Mise à disposition des données pour le bouron submit |
$( '#submit-button' ).before( |
'<input type="hidden" name="champs-supp" id="champs-supp" value="' + resultsArrayJson + '">' |
//la value est passée avec des apostrophes pour que les guillemets de la string json passent bien en string de l'attribut |
'<input type="hidden" name="champs-supp" id="champs-supp" value=\'' + resultsArrayJson + '\'>' |
); |
} |
|
608,7 → 665,7 |
// Ajout des valeurs de liste |
onChangeStoreListValueLabel( datasToSubmitObject , thisFieldset ); |
// S'il y a une valeur 'autre' on l'indique à la fin de la liste |
if( $( '.option-other-value' , thisFieldset ).attr( 'checked' ) && -1 === datasToSubmitObject.fieldValues.listValue.indexOf( 'other' ) ) { |
if( $( '.option-other-value' , thisFieldset ).is( ':checked' ) && -1 === datasToSubmitObject.fieldValues.listValue.indexOf( 'other' ) ) { |
datasToSubmitObject.fieldValues.listValue.push( 'other' ); |
} |
break; |
653,7 → 710,7 |
|
if( $( this ).val() ){ |
// Is-default-value non cochée |
if( !$( '.is-defaut-value[data-list-value-id="' + $( this ).data( 'list-value-id' ) + '"]' , thisFieldset ).attr( 'checked' ) ) { |
if( !$( '.is-defaut-value[data-list-value-id="' + $( this ).data( 'list-value-id' ) + '"]' , thisFieldset ).is( ':checked' ) ) { |
datasToSubmitObject.fieldValues.listValue.push( $( this ).val() ); |
// Is-default-value cochée pour select/radio |
} else if( 'select' === selectedFieldElement || 'radio' === selectedFieldElement ) { |
756,6 → 813,10 |
listFieldsHtml = {},//chaînes & html pour les listes mais non spécifiques |
listFieldsHtml = {},//chaînes & html spécifiques aux listes |
count = fieldOptions.length;//nombre d'options, pour les boucles for |
fieldLabel = fieldLabel.replace( /(')/gm, '''' ).replace( /(")/gm, '""' ); |
fieldTooltip = fieldTooltip.replace( /(')/gm, '''' ).replace( /(")/gm, '""' ); |
fieldPlaceholder = fieldPlaceholder.replace( /(')/gm, '''' ).replace( /(")/gm, '""' ); |
|
//valeurs initiales des chaînes de caractères |
//Éléments simples ou chaînes communes aux "listes" |
commonFieldsHtml = { |
878,7 → 939,7 |
// Name |
commonFieldsHtml.fieldInput.nameAttr + |
// Value |
' value="' + fieldOption.optionValue + '"' + |
' value="' + fieldOption.optionValue.replace( /(')/gm, '''' ).replace( /(")/gm, '""' ) + '"' + |
// Checked |
listFieldsHtml.defaultAttr + |
// Class="nom du champ" |
885,7 → 946,7 |
commonFieldsHtml.fieldInput.classAttr + |
'>' + |
// Label de l'option |
fieldOption.optionText + |
fieldOption.optionText.replace( /(')/gm, '''' ).replace( /(")/gm, '""' ) + |
'</label>'; |
} |
// Si valeur "autre" est cochée |
946,9 → 1007,9 |
// Type="checkbox" |
commonFieldsHtml.fieldInput.typeAttr = ' type="checkbox"'; |
// Id |
listFieldsHtml.inputIdAttr = ' id="' + fieldOption.optionValue.toLowerCase() + '"'; |
listFieldsHtml.inputIdAttr = ' id="' + fieldOption.optionValue.replace( /(')/gm, '''' ).replace( /(")/gm, '""' ).toLowerCase() + '"'; |
// For |
listFieldsHtml.forAttr = ' for="' + fieldOption.optionValue.toLowerCase() + '"'; |
listFieldsHtml.forAttr = ' for="' + fieldOption.optionValue.replace( /(')/gm, '''' ).replace( /(")/gm, '""' ).toLowerCase() + '"'; |
// Default |
listFieldsHtml.defaultAttr = '';//réinitialisation |
if( fieldOption.isDefault ) { |
974,7 → 1035,7 |
// Name |
commonFieldsHtml.fieldInput.nameAttr + |
// Value |
' value="' + fieldOption.optionValue + '"' + |
' value="' + fieldOption.optionValue.replace( /(')/gm, '''' ).replace( /(")/gm, '""' ) + '"' + |
// Checked |
listFieldsHtml.defaultAttr + |
// Class="nom du champ" |
983,7 → 1044,7 |
commonFieldsHtml.dataIdAttr + |
'>' + |
// Label de l'option |
fieldOption.optionText + |
fieldOption.optionText.replace( /(')/gm, '''' ).replace( /(")/gm, '""' ) + |
'</label>'; |
} |
// Si valeur "autre" est cochée |
1054,7 → 1115,7 |
fieldHtml += |
'<option' + |
// Value |
' value="' + fieldOption.optionValue + '"' + |
' value="' + fieldOption.optionValue.replace( /(')/gm, '''' ).replace( /(")/gm, '""' ) + '"' + |
// Value-id |
listFieldsHtml.optionIdAttr + |
// Selected |
1061,7 → 1122,7 |
listFieldsHtml.defaultAttr + |
'>' + |
// Option |
fieldOption.optionText + |
fieldOption.optionText.replace( /(')/gm, '''' ).replace( /(")/gm, '""' ) + |
'</option>'; |
} |
// Si valeur "autre" est cochée |
1281,7 → 1342,7 |
commonFieldsHtml.fieldInput.classAttr + |
// Info-bulle |
commonFieldsHtml.titleAttr + |
// Info-bulle |
// Placeholder |
commonFieldsHtml.fieldInput.placeholderAttr + |
// Required |
commonFieldsHtml.fieldInput.mandatoryAttr + |