web-dev-qa-db-fra.com

Les sauts de ligne dans l'élément textarea

C'est du HTML pur. (pas de php ou quelque chose comme ça, si vous voulez connaitre l’arrière-plan, c’est une application C # avec HTML dans une vue web).

Tous mes fichiers HTML sont bien formatés et correctement mis en retrait pour des raisons de maintenabilité et autres.

Voici un extrait:

<tr>
    <td class="label">Clinic Times:</td>
    <td><textarea name="familyPlanningClinicSessionsClinicTimes">Monday:
    Tuesday:
    Wednesday:
    Thursday:
    Friday:
    Saturday:
    Sunday:</textarea></td>
</tr>

Les sauts de ligne dans l’élément <textarea></textarea> permettent d’obtenir les sauts de ligne sur la page. Cependant, il inclut également l'indentation dans l'élément textarea.

par exemple.

example

La seule façon pour moi de résoudre ce problème consiste à supprimer l'indentation. Ce n'est pas la fin du monde, mais existe-t-il un autre moyen de conserver le formatage Nice? Merci.

htmlcssinternet-explorertextarea
24
Thomas Clayson

Vous pouvez utiliser le &#10; (cela signifie nouvelle ligne en HTML) mais peut-être que ce n'est pas une mise en forme agréable, comme vous l'avez dit ...

La seule façon pour moi de résoudre ce problème consiste à supprimer l'indentation. Ce n'est pas la fin du monde, mais existe-t-il un autre moyen de conserver le formatage Nice?

<tr>
  <td class="label">Clinic Times:</td>
  <td><textarea name="familyPlanningClinicSessionsClinicTimes">Monday:&#10;Tuesday:&#10;Wednesday:&#10;Thursday:&#10;Friday:&#10;Saturday:&#10;Sunday:</textarea></td>
</tr>
62
Marcx

Il n'y a pas de solution HTML pure à votre problème. Textareas affiche toujours les espaces dans leur contenu.

Dans un monde parfait, vous pourrez tirer parti de la propriété CSS white-space; malheureusement, cela ne s'applique pas non plus à textareas.

7
derekerdmann

Vous pouvez utiliser <div> avec l'attribut contenteditable:

<div contenteditable="true" style="width: 450px; height: 300px; white-space: pre-line;" name="familyPlanningClinicSessionsClinicTimes">Monday:
                            Tuesday:
                            Wednesday:
                            Thursday:
                            Friday:
                            Saturday:
                            Sunday:</div>

Mais dans votre cas, je pense que la solution idéale consiste à utiliser plusieurs zones de texte ordinaires, une pour chaque jour

Monday: <input type="text" name="familyPlanningClinicSessionsClinicTimesMonday" /><br />
Tuesday: <input type="text" name="familyPlanningClinicSessionsClinicTimesTuesday" /><br />
...
0
Shadow Wizard

En C #, si vous souhaitez envoyer une nouvelle ligne à une zone de texte, vous pouvez utiliser Environment.NewLine.

0
VinnyG

Si vous voulez simplement une liste d’articles, vous pouvez utiliser <ul> <li>"Monday"</li> <li>"Tuesday"</li>...</ul> 
Utiliser <ul><li></li></ul> démarrera une liste préformatée avec <ul> à partir de la liste et <li> à partir de chaque élément de la liste. Cette méthode ne nécessite pas de Java ou de CSS et sera indentée automatiquement.

0
Confederate 3320

Nan; un textarea crache tout ce qu’il a réellement.

Vous pouvez injecter la valeur de JavaScript, mais cela semble beaucoup de travail pour une chose isolée.

0
Dave Newton