[javascript]Espace insécable avec l'objet Option [Resolu]

Espace insécable avec l'objet Option [Resolu] [javascript] - HTML/CSS - Programmation

Marsh Posté le 25-08-2005 à 11:44:35    

Bonjour,
 
Je souhaite ajouter un espace insecable dans
ce qu'affiche une liste.
 
Le problème, c'est que:

   new Option('Paris','Paris',false,false);


donne le même resultat que :

   new Option('   Paris','   Paris',false,false);


 
et si je met :

    new Option(' Paris',' Paris',false,false);


alors   n'est pas interprété, mais affiché tel quel.
 
J'ai cherché un bon bout de temps sur le net, mais je n'ai trouvé aucune information.
 
Quelqu'un aurait une idée?
 
Merci d'avance


Message édité par elrond le 25-08-2005 à 15:00:23
Reply

Marsh Posté le 25-08-2005 à 11:44:35   

Reply

Marsh Posté le 25-08-2005 à 11:58:56    

pourquoi foutre un espace insécable dans les options de ton select ?
à partir du moment ou tu as stylé tout ca correctement ca t'obeit au doigt et à l'oeil
 
select {width:120px }
select option {text-align:center; margin:20px }
enfin voila tu dois aimer te compliquer la vie

Reply

Marsh Posté le 25-08-2005 à 12:00:08    

et ta fonction Option c'est une classe que tu as créé car je me rappelle pas l'avoir vu en JS

Reply

Marsh Posté le 25-08-2005 à 12:29:39    

L'espace insécable c'est pour pouvoir indenter la liste
par exemple avoir :  


France
  Essone
    Massy
    Palaiseau
  Paris
Espagne


 
L'objet Option permet de rajouter de élement à une liste <select>
http://www.devguru.com/technologie [...] /11258.asp

Reply

Marsh Posté le 25-08-2005 à 13:45:18    

ben malheureusement ton problème est que option te rajoute bien un élément, mais le text, c'est du texte brut et non du HTML, donc ca te vautre ce que tu veux faire.
 
alors deux techniques s'offre à toi :  
crééer une fonction option
qui te rajoute une option avec du JDOM :  
 

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <title></title>
  5. <script>
  6. function SelectInit(SelectId) {
  7.  var mySelect = document.getElementById(SelectId);
  8.  mySelect.newOption = function(text,value,defaultSelected, selected){
  9.  var newOpt = this.appendChild(document.createElement("OPTION" ));
  10.   newOpt.innerHTML = text;
  11.   newOpt.value = value;
  12.   newOpt.defaultSelected = defaultSelected;
  13.   newOpt.selected = selected;
  14.  }
  15.  mySelect.newOption('&nbsp;&nbsp;&nbsp;Paris','Paris',false,false);
  16.  mySelect.style.width = "200px";
  17. }
  18. window.onload = function() {
  19.  SelectInit("monselect" );
  20. }
  21. </script>
  22. </head>
  23. <body>
  24. <select id="monselect">
  25. </select>
  26. </body>
  27. </html>


 
mais pour indenter un élément option pourquoi ne joue tu pas sur le padding-left ?
 
mySelect[1].style.paddingLeft = "20px";
 
et hop emballé  c'est pesé

Reply

Marsh Posté le 25-08-2005 à 14:59:47    

Merci pour ta réponse
 
J'ai opté pour la première. En effet mySelect[1].style.paddingLeft = "20px"; fonctionne très bien dans firefox, mais pas dans ie.
 
Au final j'utilise cette fonction :
 


function AddOptionSel(mySelect, text, value, defaultSelected, isselected){
 var newOpt = mySelect.appendChild(document.createElement("OPTION" ));
    newOpt.innerHTML = text;
    newOpt.value = value;
    newOpt.defaultSelected = defaultSelected;
    newOpt.selected = isselected;
}


Message édité par elrond le 26-08-2005 à 08:58:55
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed