Asp.Net Ajax ValidatorCalloutExtender Kullanımı ve Örneği

İLk olarak ValidatorCalloutExtender nedir ve niye kullanılır hemen onu açıklayalım. ValidatorCalloutExtender VisualStudio ile kullandığımız doğrulama (validation) nesnelerini standart görünümünden çıkarıp göze daha hoş bir görünüme sokarak kullanıcıların dikkati çekmek için kullanılır hemen lafı fazla uzatmadan örneğimize geçelim. Aşağıda Normal Validation ve ValidatorCalloutExtender nesneleri arasındaki kullanım farklarını görebilirsiniz.
onay
Uygulamamızda ValidatorCalloutExtender kullanabilmek için projemize Ajax Control Toolkit eklememiz gerekiyor nasıl yapılacak ki diyorsanız AJAX Control Toolkit Kurulumu konusuna bakalım.
Uygulamamızda normal validation kullanarak yapalım

<table>
    <tr><td>Adınız</td>
        <td><asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
                ErrorMessage="Lüten Adınızı Girin" ControlToValidate="TextBox1"></asp:RequiredFieldValidator>
                   </td>
        </tr>
        <tr>
       <td> Soyadınız</td><td><asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server"  
                ErrorMessage="Soyadınızı Girin" ControlToValidate="TextBox2"></asp:RequiredFieldValidator>
                       </td>
        </tr>
        <tr>
        <td colspan="2" align="center">
            <asp:Button ID="Button1" runat="server" Text="Kaydet" /></td></tr>
        </table>

Şimdi uygulamamızı biraz daha geliştirelim bunu için ilk olarak sayfamıza bir ScriptManager ekliyoruz daha sonra, RequiredFieldValidator nesnelerine Display=”None” özelliği ekliyoruz ve her RequiredFieldValidator nesnesinin yanına bir ValidatorCalloutExtender ekleyip TargetControlID özelliklerine sırası ile RequiredFieldValidator1 ve RequiredFieldValidator2 yapıyoruz, evet artık uyarı mesajlarımız bir baloncuk içinde kullanıcın dikkatini çekecek hale geldi kodlarımız ve ekran görüntüsü aşağıda…

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
   <title>www.aspnetornekleri.com</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <table>
    <tr><td>Adınız</td>
        <td><asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" Display="None"
                ErrorMessage="Lüten Adınızı Girin" ControlToValidate="TextBox1"></asp:RequiredFieldValidator>
            <asp:ValidatorCalloutExtender ID="ValidatorCalloutExtender1" TargetControlID="RequiredFieldValidator1" runat="server">
            </asp:ValidatorCalloutExtender>

<!-- www.aspnetornekleri.com -->
        </td>
        </tr>
        <tr>
       <td> Soyadınız</td><td><asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server"  Display="None"
                ErrorMessage="Soyadınızı Girin" ControlToValidate="TextBox2"></asp:RequiredFieldValidator>
           <asp:ValidatorCalloutExtender ID="ValidatorCalloutExtender2" TargetControlID="RequiredFieldValidator2" runat="server">
           </asp:ValidatorCalloutExtender>

            </td>
        </tr>
        <tr>
        <td colspan="2" align="center">
            <asp:Button ID="Button1" runat="server" Text="Kaydet" /></td></tr>
<!-- www.aspnetornekleri.com -->
        </table>
    </div>
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    </form>
</body>
</html>

onay

  • ASP.NET

    Örnekler çok faydalı oldu, teşekkürler