Communardo Software GmbH, Kleiststraße 10 a, D-01129 Dresden
0800 1 255 255

Clientseitige Validierung mit dem CustomValidator

In ASP.NET gibt es die doch sehr nütz­li­chen Validator-Controls. Diese bie­ten die Möglichkeit, Werte von Web-Formularen zu prü­fen. Besonders sinn­voll ist aus mei­ner Sicht die cli­ent­sei­tige Valisierung, weil hier Postbacks zum Server schon im Vorab unter­bun­den wer­den. Allerdings gibt es hier beson­ders beim CustomValidator eini­ges zu beach­ten, wor­auf ich in die­sem Blog-Eintrag etwas ein­ge­hen möchte.

Mein kon­kre­ter Anwendungsfall war, zu prü­fen, ob in einem TreeView mit Checkboxen min­des­tens 1 Knoten ange­hakt ist.

Wenn man sich die ver­füg­ba­ren Eigenschaften des CustomValidators anschaut, ist man ver­sucht
a) in ControlToValidate den Namen des zu vali­die­ren­den Controls anzu­ge­ben und
b) unter ClientValidationFunction eine JavaScript-Funktion anzu­ge­ben, die true zurück­gibt, wenn die Validierung erfolg­reich war und false, wenn nicht

Das funk­tio­niert aber lei­der nicht 🙁

Wichtig sind fol­gende Sachverhalte:

  1. Die Signatur der JavaScript-Funktion:
    Es wird eine Funktion benö­tigt, die 2 Parameter erwar­tet. Der erste Parameter (sen­der) ist der Validator selbst, der uns hier erst­mal nicht wei­ter inter­es­siert. Der zweite Parameter (args) sind die EventArgs. Und hier müs­sen wir ein­ha­ken, denn diese haben eine Eigenschaft IsValid, die im Verlauf unse­rer Funktion auf true bzw. auf false gesetzt wer­den kann.
  2. Kein ControlToValidate fest­le­gen. Der Zugriff auf die Controls erfolgt inner­halb der JavaScript-Funktion

Hier die Beispiel-JavaScript-Funktion:

<script type="text/javascript">
func­tion ValidateTreeview(src, args)
{
args.IsValid = IsTreeviewNodeChecked()
}
func­tion IsTreeviewNodeChecked()
{
var treeView = document.getElementById('<% =MyTreeView.ClientID %>');
var check­bo­xes = treeView.getElementsByTagName('input');
for (var i=0; i<checkboxes.length;i++)
{
if (checkboxes[i].checked)
{
return true;
}
}
return false;
}
</script>

Dem CustomValidator muss nun nur ValidateTreeview als ClientValidationFunction und eine pas­sende ErrorMessage hin­ter­legt wer­den und fer­tig ist die cli­ent­sei­tige Validierung.

6. November 2007
|

Related Posts

Pin It on Pinterest