Logo 1001 tips

Gratiszoekertjes.com

Vorige pagina

Lange veldnamen in een formulier afbreken

  1. Startpagina Sharepoint oplossingen en handleidingen
  2. Top 10 verbeteringen en vernieuwingen in Sharepoint 2010
  3. Werken met het webonderdeel Inhoudseditor (CEWP)
  4. Onderdelen van een Sharepoint pagina verbergen
  5. Dynamische KPI-lijst met Google charts
  6. Lijst met grote tekstvelden inklappen en uitklappen
  7. Lange veldnamen in een formulier afbreken
  8. Een bevraging of enquête gebruiksvriendelijker maken
  9. Gratis Sharepoint Designer!

Het gebeurt wel eens dat je een lijst hebt met velden (of kolommen zo je wil), met uitzonderlijk lange namen. Een gewone veldnaam kan tot 255 karakters bedragen in Sharepoint! Dan heb je een vervelende situatie wanneer je het invulformulier (NewForm.aspx) of het wijzigformulier (EditForm.aspx) wil gebruiken om gegevens in te voeren of te wijzigen. De lange veldnamen worden niet afgebroken, zodat je constant van links naar rechts moet scrollen. Zie afbeelding 1.

afbeelding 1

Afbeelding 1: je moet van links naar rechts scrollen om in te vullen en om de knoppen te zien

Daar is een vrij eenvoudige oplossing voor.
Als we de pagina openen met Firefox en we hebben de add-on Firebug geïnstalleerd, dan kan je vrij snel zien waar de veldnamen zich bevinden.  (zie afbeelding 2 en 3)

afbeelding 2

Afbeelding 2: zoek de tag met de tekst

afbeelding 3

Afbeelding 3: de tekst bevindt zich in de <nobr> tag

Onze eerste veldnaam (“Eerste veld van een lijst met een zeer lange naam omdat ik niet weet hoe ik de veldnaam moet inkortenĒ) bevindt zich in de niet zo gekende tag <nobr></nobr>.

Deze tag is overigens niet conform de W3C specificatie. De <nobr> tag zegt eigenlijk niks anders dan “niet afbreken” ook als de tekst breder is dan het scherm.

Als we nu met CSS een equivalente oplossing zouden vinden, dan kunnen we verder. En die is er als volgt:

<style type= "text/css">
nobr {white-space: normal}
</style>

Als we bovendien de breedte van de tekst willen vast leggen, dan kunnen we er een width attribuut aan toevoegen:

<style type="text/css">
nobr {white-space: normal; width:300px;}
</style>

Hoe ga je tewerk?

  • Open het formulier om een nieuw item toe te voegen (NewForm.aspx)
  • Typ in het adres achteraan &toolpaneview=2 (of ?toolpaneview=2 als er nog geen andere querystrings staan). Je krijgt het formulier nu te zien in de bewerkingsmodus
  • Voeg een nieuw webonderdeel toe van het type Inhoudseditor (CEWP of Content Editor Web Part)
  • Voeg via de broneditor deze tekst toe (pas eventueel de width aan naar uw eigen voorkeur):
  • <style type="text/css">
    nobr {white-space: normal; width:300px;}
    </style>
  • Bewaar en verlaat de bewerkingsmodus
    Ga op dezelfde manier tewerk voor het wijzigformulier (EditForm.aspx). Voer eerst een item in en open het dan in het bewerkingsformulier.

Dit is het resultaat:

afbeelding 4

Afbeelding 4: scrollen is niet meer nodig, het formulier ziet er veel beter uit

Share to Facebook Share to Twitter Blogger Wordpress LinkedIn Myspace Email Meer...
Laatste aanpassing op zaterdag 26 juni 2010 om 15:13u
Auteur: Dries Hauwaert