Bonjour,
Actuellement, le bouton changer n’apparait qu’après la sélection d’un statut différent de l’actuel.
Et ce bouton apparait en dessous.
Je constate en formation que beaucoup de gens oublient de cliquer sur changer.
Je propose le changement suivant :
- afficher le bouton [Changer] en style désactivé dès le chargement de la page (classe .btn_desactive)
- l’afficher à droite de la liste et non en dessous
Voici ce que ça pourrait donner :
Et actif :
Et voici le code que j’ai mis dans spip/spip: Dépôt officiel du core SPIP * Anciennement présent sur svn://trac.rezo.net/spip * Les plugins-dist faisant partie de la distribution SPIP sont présents dans https://git.spip.net/SPIP/[nom du plugin dist] - prive/formulaires/instituer_objet.html at master - spip - SPIP on GIT pour obtenir ce résultat.
C’est assez crade avec les styles inline.
Mais ça permet de tester.
<div class="instituer_objet">
[(#ENV{_publiable}|non|et{#ENV{statut}|=={prepa}|oui})
<p class="small"><:texte_proposer_publication:></p>
]
<div class="formulaire_spip formulaire_editer formulaire_instituer[ formulaire_#FORM formulaire_#FORM-(#ENV{_objet})][ formulaire_#FORM-#ENV{_objet}-(#ENV{_id_objet})]">
[<p class="reponse_formulaire reponse_formulaire_ok" role="status">(#ENV**{message_ok})</p>]
[<p class="reponse_formulaire reponse_formulaire_erreur" role="alert">(#ENV*{message_erreur})</p>]
[(#ENV{editable})
<form method='post' action='#ENV{action}'><div>
[(#REM) declarer les hidden qui declencheront le service du formulaire
parametre : url d'action ]
#ACTION_FORMULAIRE
]
#SET{name,statut}#SET{obli,'obligatoire'}#SET{erreurs,#ENV**{erreurs}|table_valeur{#GET{name}}}
<div class="editer-groupe">
<div class="editer editer_[(#GET{name})] statut_#ENV{#GET{name}}[ (#GET{obli})][ (#GET{erreurs}|oui)erreur]">
<label for="formulaire_#FORM-#ENV{_objet}-#ENV{_id_objet}-#GET{name}">[(#ENV{_label}|_T)][(#ENV{_aide}|oui)#AIDER{#ENV{_aide}}]</label>[
<span class='erreur_message'>(#GET{erreurs})</span>
]<span class="show" style="display:flex;">
[(#ENV{editable})
<span class="gauche"><select style="width:auto;" class="select statut" name="#GET{name}" id="formulaire_#FORM-#ENV{_objet}-#ENV{_id_objet}-#GET{name}">
[(#ENV{_statuts}|table_valeur{#ENV{#GET{name}}}|non)
<option value="#ENV{#GET{name}}"> #ENV{#GET{name}}</option>
]
]
<BOUCLE_choix(DATA){source table, #ENV{_statuts}}{si #ENV{editable}}>
<option value="#CLE"[(#ENV{#GET{name}}|=={#CLE}|oui)selected="selected"]
style="background-image:url([(#CLE|puce_statut{#ENV{_objet}}|extraire_attribut{src})]);"> [(#VALEUR|_T)]</option>
</BOUCLE_choix>
[(#ENV{editable})
</select></span>
<span class="droite" style="padding-left:1em;"><input type='submit' class='btn submit btn_desactive' value='<:bouton_changer:>' /></span>
]
[(#ENV{editable}|non)
<span class="show">
<span class="statut">[(#ENV{#GET{name}}|puce_statut{#ENV{_objet}})] [(#ENV{_statuts}|table_valeur{#ENV{#GET{name}}}|_T)]</span>
</span>
]
</div>
</div>
<!--extra-->
[(#ENV{editable})
</div></form>
]
</div>
</div>
<script type="text/javascript">
function update_select(statut_default){
var selected = this.options[this.selectedIndex];
var boutons = jQuery(this).attr('style',jQuery(selected).attr('style')).closest('form').find('.btn');
if (selected.value!=statut_default)
boutons.removeClass('btn_desactive ');
else
boutons.addClass('btn_desactive ')
}
jQuery(function($){
$(".formulaire_#FORM .show select")
.each(function(){update_select.apply(this,['#ENV{#GET{name}}']);})
.on('change',function(){update_select.apply(this,['#ENV{#GET{name}}']);})
.on('keyup',function(){update_select.apply(this,['#ENV{#GET{name}}']);});
});
</script>
