5370 sujets

Sémantique web et HTML

Bonjour,
Dans une page XHTML, je souhaite utiliser la balise input type="color" mais avec JSF.
Quelque chose comme :

<input type="color" 
          value="#{preference.couleur}" 
          onchange="#{preference.controler()}"/> 

Le color picker s'affiche bien, mais rien côté serveur.
Pouvez-vous m'aider SVP ?
Modifié par denisduval75 (28 Apr 2020 - 11:27)
Salut denisduval75
voici un petit code qui devrait t'aider

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <link href="/static/build/styles/samples.37902ba3b7fe.css" rel="stylesheet" type="text/css" />
        
        <title>&lt;input type=&#34;color&#34;&gt; - Exemples - code sample</title>
    </head>
    <body>
        
            <p>Un exemple qui illustre l'utilisation de <code>&lt;input type="color"&gt;</code>.</p>

<label for="colorWell">Couleur :</label>
<input type="color" value="#ff0000" id="colorWell">

<p>Vous pouvez ici voir que la couleur du premier paragraphe changer
   lorsqu'on ajuste la valeur dans le sélecteur. Pour cela, on 
   utilise l'évènement <code>input</code>. Lorsqu'on ferme le 
   sélecteur, l'évènement <code>change</code> est déclenché et on 
   applique la modification est appliquée à l'ensemble des paragraphes.</p>
        
        
            <script>
                var colorWell
var defaultColor = "#0000ff";

window.addEventListener("load", startup, false);
 function startup() {
  colorWell = document.querySelector("#colorWell");
  colorWell.value = defaultColor;
  colorWell.addEventListener("input", updateFirst, false);
  colorWell.addEventListener("change", updateAll, false);
  colorWell.select();
}
 function updateFirst(event) {
  var p = document.querySelector("p");

  if (p) {
    p.style.color = event.target.value;
  }
} function updateAll(event) {
  document.querySelectorAll("p").forEach(function(p) {
    p.style.color = event.target.value;
  });
}

            </script>
        
    </body>
</html>


j'espère avoir pu t'aider Smiley biggrin