Hintergrund färben nach Event "onblur" (Steuerelement "asp:textbox")

Question

Hallo Leute,

ich möchte eine Prüfung für Textboxen einzubauen. Dabei soll nach der Eingabe der Inhalt auf eine Ganzzahl geprüft werden. Das funktioniert mit der Methode int.TryParse().

protected bool PruefeBox(TextBox tb)
{
  int d;
  NumberStyles style = NumberStyles.AllowDecimalPoint | NumberStyles.AllowThousands;
  CultureInfo culture = CultureInfo.CreateSpecificCulture("de-DE");
  if (int.TryParse(tb.Text, style, culture, out d))
  {
   tb.BackColor = Color.White;
   return true;
  }
  else
  {
    tb.BackColor = Color.Red;
    return false;
  }

Die Textbox wird also rot gefärbt, wenn der Benutzer einen falschen Datentyp einträgt. Die Textboxen werden zur Eingabe von Geldbeträgen genutzt. Deshalb sind Tausendertrennzeichen und Kommas erlaubt. Centwerte sind zu vernachlässigen, deshalb wird auf den Datentyp Integer geprüft. 

In der ASPX-Datei habe ich das Javascript-Event festgelegt.

<asp:TextBox ID="DBestandKuh" runat="server" Width="80px" AutoPostBack="true" onblur="__doPostBack(this.id, 'testIt');"></asp:TextBox>

 In meiner Page_Load_Methode prüfe ich, ob das Event ausgelöst wurde.

<pre lang="x-c#">protected void Page_Load(object sender, EventArgs e)
{    
  string eventArgument = Request.Params["__EVENTARGUMENT"];
  if (eventArgument == "testIt")
  {
  ContentPlaceHolder cph = this.Form.FindControl("ContentPlaceHolder1") as ContentPlaceHolder;
  TextBox tb = (TextBox)cph.FindControl(Request.Params["__EVENTTARGET"].Remove(0, 20));
  PruefeBox(tb);
  }
}

Wenn ich einen Wert in die Textbox eingetragen habe und ein anderes Steuerelement anwähle, wird die Seite neu geladen und die Prüfung durchgeführt sowie die Hintergrundfarbe "intern" festgelegt. Leider färben sich die Textboxen nicht direkt, sondern erst, wenn die Seite erneut aufgerufen wird. Ich denke das hängt mit dem Websiten-Lebenszyklus zusammen.

Muss ich eine "DrawControl", "RenderControl", "Page_Init"-Methode aufrufen, um die Hintergrundfarbe der Textbox direkt zu ändern? Wenn ja, wie mache ich das?

Was verspricht es mir, wenn ich die Prüfung komplett mit Javascript entwickle. Ich möchte weitestgehend auf <script> ... </script> verzichten, weil die Funktionalität in den CodeBehind-Dateien ausgelagert sein soll.

Thx 4 Help,

Christian

 

---

VS 2010, ASP.NET 4.0, MS SQL Server 2005

Answer 1

Hallo Christian,

Wenn ich einen Wert in die Textbox eingetragen habe und ein anderes Steuerelement anwähle, wird die Seite neu geladen und die Prüfung durchgeführt sowie die Hintergrundfarbe "intern" festgelegt. Leider färben sich die Textboxen nicht direkt, sondern erst, wenn die Seite erneut aufgerufen wird. Ich denke das hängt mit dem Websiten-Lebenszyklus zusammen.

Muss ich eine "DrawControl", "RenderControl", "Page_Init"-Methode aufrufen, um die Hintergrundfarbe der Textbox direkt zu ändern? Wenn ja, wie mache ich das?

Was verspricht es mir, wenn ich die Prüfung komplett mit Javascript entwickle. Ich möchte weitestgehend auf <script> ... </script> verzichten, weil die Funktionalität in den CodeBehind-Dateien ausgelagert sein soll.

solche Sachen macht man sinnvollerweise clientseitig. Du kannst die Prüfung zusätzlich auch noch serverseitig machen, bevor die Daten gespeichert werden. Um die Controls aber einzufärben macht es wenig Sinn, bei onblur was serverseitiges aufzurufen.

<asp:TextBox id="MyTextBox" ... />

MyTextBox.Attributes.Add( "onblur", "return checkValue( this );" )

Clientseitig sieht das dann in etwa so aus:

function checkValue( control )
{
    if( !<Prüfroutine )
    {
        control.style.backgroundColor  = '#FF0000';
        return false;
    }
}

Ggfs. willst Du ja auch auch gleich im Control bleiben und den Inhalt ggfs. auch markieren. All das ist clientseitig doch besser aufgehoben.

 

---

Gruß, Stefan
Microsoft MVP - Visual Developer ASP/ASP.NET
http://www.asp-solutions.de/ - Consulting, Development
http://www.aspnetzone.de/ - ASP.NET Zone, die ASP.NET Community

Answer 2

Hallo Stefan,

ich danke dir für deine Antwort.

 

Ich habe die AutoPostBack- und die onblur-Eigenschaft der TextBox entfernt.

<asp:TextBox ID="DBestandKuh" runat="server" Width="80px"></asp:TextBox>

 

Das Hinzufügen des Events schreibe ich in die Page_Load-Methode.

DBestandKuh.Attributes.Add("onblur", "return checkValue(this);");

Ist das der richtige Platz? Das Event wird nun bei jedem Seitenaufruf festgelegt.

 

Die Prüffunktion ist Javascript und muss deshalb in die ASPX-Datei. Ich habe auf meiner Master-Site einen PlaceHolder für den Header und einen weiteren PlaceHolder für den Body. Die Funktion checkValue schreibe ich in den Header.

<asp:Content ID="Content2" ContentPlaceHolderID="head" runat="Server">
 <script language="javascript" type="text/javascript">
  function checkValue( control )
  {
   if (parseInt(control.text) == NaN)
   {
    control.style.backgroundColor = '#FF0000';
    return false;
   }
   else 
   {
    control.style.backgroundColor = '#FFFFFF';
    control.text = parseInt(control.text).toString();
    return true;
   }
  }
 </script>
</asp:Content>

Mit dieser Lösung habe ich die Prüfroutine nicht in der CodeBehind-Datei ausgelagert. Das ist schade, aber ich stimme zu diese Aufgabe clientseitig auszuführen. Bevor ich die Textboxen auslese und die Werte in meine Datenbank schreibe, muss ich eine Prüfung über alle Textboxen durchführen. Das kann serverseitig geschehen, richtig?

Leider funktioniert das Einfärben der Textbox noch nicht. 

 

Gruß,

Christian

---

VS 2010, ASP.NET 4.0, MS SQL Server 2005

Answer 3

Der Zugriff auf den Inhalt der Textbox ist mit control.value möglich. Die Prüffunktion sieht also folgendermaßen aus:

<asp:Content ID="Content2" ContentPlaceHolderID="head" runat="Server">
  <script language="javascript" type="text/javascript">
    function checkValue( control )
    {
      if (isNaN(parseInt(control.value,10)))
      {
        control.style.backgroundColor = '#FF0000';
        return false;
      }
      else 
      {
        control.style.backgroundColor = '#FFFFFF';
        control.value = parseInt(control.value).toString();
        return true;
      }
    }
  </script>
</asp:Content>

 

Gruß,

Christian

---

VS 2010, ASP.NET 4.0, MS SQL Server 2005