Comment mettre un caractère d'espace avant le texte de l'option dans un élément HTML select?

Je pense que vous voulez   ou  

, Donc une version fixe de votre exemple pourrait être...

<select>
  <option>&nbsp;&nbsp;Sample</option>
</select>

Ou

<select>
  <option>&#160;&#160;Sample</option>
</select>

Utilisez \xA0 avec une chaîne. Cela fonctionne parfaitement tout en liant les données du modèle C# à une liste déroulante...

  SectionsList.ForEach(p => { p.Text = "\xA0\xA0Section: " + p.Text; });

Comme Rob Cooper l'a souligné, il y a quelques problèmes de compatibilité avec les anciens navigateurs (IE6 affichera les lettres réelles "& nbsp;"

C'est comme ça que je le contourne ASP.Net (je N'ai pas VS ouvert donc je ne suis pas sûr de savoir à quels caractères cela se traduit réellement):

Server.HtmlDecode(" ") 

Vous pouvez également appuyer sur alt+espace (sur mac) pour un espace insécable. Je l'utilise pour un module Drupal car Drupal décode les entités html.

J'ai essayé plusieurs choses mais la seule chose qui a fonctionné pour moi était d'utiliser javascript. notez simplement que j'utilise le code unicode pour l'espace plutôt que l'entité html, car js doenst sait quelque chose sur les entités

$("#project_product_parent_id option").each(function(i,option){
  $option = $(option);
  $option.text($option.text().replace(/─/g,'\u00A0\u00A0\u00A0'))
});

Je suis presque certain que vous pouvez accomplir ceci avec le remplissage de CSS, aussi bien. Ensuite, vous ne serez pas marié aux caractères d'espace codés en dur dans toutes vos balises <option>.

@Brian

Je suis presque certain que vous pouvez accomplir ceci avec le remplissage de CSS, aussi bien. Ensuite, vous ne serez pas marié aux caractères spatiaux codés en dur dans toutes vos balises.

Bonne pensée - mais malheureusement, cela ne fonctionne pas dans (le navigateur préféré de tout le monde...) IE7:- (

Voici du code qui fonctionnera dans Firefox (et je suppose Op/Saf).

<select>
    <option style="padding-left: 0px;">Blah</option>
        <option style="padding-left: 5px;">Blah</option>
            <option style="padding-left: 10px;">Blah</option>
    <option style="padding-left: 0px;">Blah</option>
        <option style="padding-left: 5px;">Blah</option>
</select>

Suffit d'utiliser char 255 (type Alt+2+5+5 sur votre clavier numérique) avec une police à espacement fixe comme Courier New.

Server.HtmlDecode(" ") est le seul qui a travaillé pour moi.

Sinon les chr sont imprimés sous forme de texte.

J'ai essayé d'ajouter le remplissage en tant Qu'attribut pour le listitem, mais cela ne l'a pas affecté.

 

Tu peux essayer ça? Ou est-il le même?

J'avais aussi le même problème et je devais résoudre ce problème dès que possible. Bien que j'ai beaucoup googlé, Je n'ai pas été en mesure de trouver une solution rapide.

Au lieu de cela, j'ai utilisé ma propre solution, bien que je ne sois pas sûr si c'est approprié, cela fonctionne dans mon cas et exactement ce que j'étais tenu de faire.

Donc, lorsque vous ajoutez un ListItem dans la liste déroulante et que vous voulez ajouter de l'espace, utilisez ce qui suit: -

Appuyez sur ALT et tapez 0160 sur votre pavé numérique, il devrait donc être quelque chose comme ALT+0160. Il va ajouter un espace.

ListItem("ALT+0160 ALT+0160 TEST", "TESTVAL")

J'ai essayé plusieurs de ces exemples, mais la seule chose qui a fonctionné était d'utiliser javascript, un peu comme dabobert, mais pas jQuery, tout simplement vieux javascript vanille et Espaces:

for(var x = 0; x < dd.options.length; x++)
{
    item = dd.options[x];
    //if a line that needs indenting
    item.text = '     ' + item.text; //indent
}

C'est IE seulement. IE11 en fait. Ugh.

1.Articles retour à la liste

2.Boucle Foreach dans la liste

3..

foreach (var item in q)
{
    StringWriter myWriter = new StringWriter();

    myWriter.Lable = HttpUtility.HtmlDecode(item.Label.Replace(" ", " "));
}

Ce travail pour moi!!!