Vous utilisez un navigateur obsolète, veuillez le mettre à jour.
Veuillez utiliser un navigateur internet moderne avec JavaScript activé pour naviguer sur OpenClassrooms.com
Une question ? Pas de panique, on va vous aider !
Bonsoir,
J'ai un formulaire html avec des input et des textarea et j'utilise summernoteJ'arrive à bloquer l'écriture pour les input mais pas pour les textarea avec readonlyMon code
<!-- Ajouter une bordure via CSS --> <!--<style> .note-editable { border: 1px solid #ccc; /* Bordure autour du contenu */ padding: 20px; min-height: 200px; text-align: left; box-sizing: border-box; /* Inclure la bordure et le padding dans la largeur/hauteur totale */ } /* Style pour le conteneur de l'éditeur */ .note-wrapper { border: 1px solid #ccc; /* Bordure autour de l'éditeur */ padding: 10px; /* Padding pour le conteneur */ border-radius: 5px; /* Arrondir les bords du conteneur */ background-color: #fff; /* Fond blanc */ } /* Appliquer un padding au contenu */ .note-editable p { margin: 0; /* Retirer les marges par défaut */ padding: 10px; /* Ajouter du padding au paragraphe */ } </style>--> <div class="container container-center margin-small-top"> <h3 class="text-center">Bienvenue <b><?=$user_items->pseudo?></b> sur votre espace administrateur</h3><br /> <p class="text-center">Cliquez <a href="/fr/BO/Plantgenders/index"><b>Ici</b> </a>Pour Revenir au Menu ou <a href="/fr/BO/Plantgenders/selection"><b>Ici</b> </a>Pour une autre sélection</p> <p class="text-center"><a href="/fr/BO/Plantgenders/edit/<?= $plantgender->id; ?>" class="btn btn-success">Vers Modif</a></p> <div class="card card-default card-body text-center"> <div class="col-sm-6 offset-sm-3 text-center <!--was-validated-->"> <form" id="form_show" name="form_show" method="post" > <fieldset> <legend >Vue Genre Plantes</legend> <div class="form-group row"> <label for="id" class="col-sm-4 col-form-label">Index</label> <input class="col-sm-3 col-form-label" type="text" name="id" id="id" value="<?=$plantgender->id;?>" disabled> </div> <div class="form-group row"> <label for="name" class="col-sm-4 col-form-label">Nom</label> <input class="col-sm-7 col-form-label" type="text" name="name" id="name" value="<?=$plantgender->gendername?>/<?= $plantgender->commonname;?>" disabled > </div> <div class="form-group row"> <label for="specificities"class="col-sm-4 col-form-label">Spécificités</label> <textarea class="uk-textarea" type="text" name="specificities" id="specificities" cols="250" rows="15" disabled="disabled"><?=$plantgender->specificities?></textarea> </div> <div class="form-group row"> <label for="plantationdate" class="col-sm-4 col-form-label">Date Plantation</label> <input class="col-sm-5 col-form-label" type="text" name="plantationdate" id="plantationdate" value="<?=$plantgender->seasonname;?>" disabled> </div> <div class="form-group row"> <label for="planting"class="col-sm-4 col-form-label">Plantation</label> <textarea class="uk-textarea" type="text" name="planting" id="planting" cols="300" rows="15" readonly="readonly"><?=$plantgender->planting?></textarea> </div> <div class="form-group row"> <label for="maintenance"class="col-sm-4 col-form-label">Entretien</label> <textarea class="uk-textarea" type="text" name="maintenance" id="maintenance" cols="180" rows="15" readonly="readonly"><?=$plantgender->maintenance?></textarea> </div> <div class="form-group row"> <label for="cutting"class="col-sm-4 col-form-label">Taille</label> <textarea class="uk-textarea" type="text" name="cutting" id="cutting" cols="180" rows="15" ><?=$plantgender->cutting;?></textarea> </div> <div class="form-group row"> <label for="feeding"class="col-sm-4 col-form-label">Engrais/Paillage</label> <textarea class="uk-textarea" type="text" name="feeding" id="feeding" cols="180" rows="15" readonly="readonly"><?=$plantgender->feeding;?></textarea> </div> <div class="form-group row"> <label for="disease"class="col-sm-4 col-form-label">Maladies</label> <textarea class="uk-textarea" type="text" name="disease" id="disease" cols="180" rows="15" readonly="readonly"><?=$plantgender->disease;?></textarea> </div> <div class="form-group row"> <label for="associations"class="col-sm-4 col-form-label">Associations Plante</label> <textarea class="uk-textarea" type="text" name="associations" id="associations" cols="180" rows="15" readonly="readonly"><?=$plantgender->associations;?></textarea> </div> <div class="form-group row"> <label for="interesting"class="col-sm-4 col-form-label">Variétés Intéressantes</label> <textarea class="uk-textarea" type="text" name="interesting" id="interesting" cols="180" rows="15" readonly="readonly"><?=$plantgender->interesting;?></textarea> </div> <div class="form-group row"> <label for="interesting"class="col-sm-4 col-form-label">Remarques</label> <textarea class="uk-textarea" type="text" name="remarks" id="remarks" cols="180" rows="15" readonly="readonly"><?=$plantgender->remarks;?></textarea> </div> </fieldset> </form> <p><a href="/fr/BO/Plantgenders/edit/<?= $plantgender->id; ?>" class="btn btn-success">Vers Modif</a></p> </div> </div> </div> <!-- Initialisation de Summernote --> <script> $(document).ready(function() { $('#summernote').summernote(); }); </script> <script> $(document).ready(function() { // Initialiser Summernote sur tous les textarea avec alignement à gauche par défaut $('textarea').summernote({ height: 200,// Hauteur uniforme pour tous les textarea width : 500,// Largeur uniforme pour tous les textarea toolbar: false, // Désactiver la barre d'outils airMode: false, // Désactiver le mode flottant disableResizeEditor: true, // Désactiver le redimensionnement de l'éditeur focus: false, // Ne pas donner le focus à l'éditeur codeviewFilter: false, // Pour désactiver le filtrage HTML readonly: true, // Rendre l'éditeur en lecture seule callbacks: { // Lors de l'initialisation, aligner tout le contenu à gauche onInit: function() { $('.note-editable').css('text-align', 'left'); }, // Lors de la modification, maintenir l'alignement à gauche onChange: function(contents, $editable) { $editable.css('text-align', 'left'); } } }); $('.note-editable').css('text-align', 'left'); }); </script>
-Edité par HerveDunoyer 30 octobre 2024 à 18:37:56
Vous pouvez rédiger votre message en Markdown ou en HTML uniquement.