Компьютерный форум OSzone.net  

Компьютерный форум OSzone.net (http://forum.oszone.net/index.php)
-   Вебмастеру (http://forum.oszone.net/forumdisplay.php?f=22)
-   -   Стилизация валидаторов в АСП (http://forum.oszone.net/showthread.php?t=189633)

DaRiYs 28-10-2010 12:16 1529332

Стилизация валидаторов в АСП
 
Есть к примеру такая разметка

Код:

<table class="dataTable">
                    <tbody>
                        <tr>
                            <td>
                                <asp:Label ID="lblMinAmount" runat="server" Text="Minimum amount"></asp:Label>
                            </td>
                            <td>
                                <asp:TextBox ID="tbMinAmount" runat="server"></asp:TextBox>
                                <asp:RequiredFieldValidator ID="rfvMinAmount" runat="server" Display="Static" ErrorMessage="*"
                                    ControlToValidate="tbMinAmount"></asp:RequiredFieldValidator>
                            </td>
                        </tr>
                        <tr>
                            <td class="noSpacing">
                            </td>
                            <td class="noSpacing">
                                <asp:RegularExpressionValidator ID="revMinAmount" runat="server" Display="Dynamic"
                                    ErrorMessage="Enter in format: nnnn,nn" ValidationExpression="^\d+(\,\d\d)?$"
                                    ControlToValidate="tbMinAmount"></asp:RegularExpressionValidator>
                            </td>
                        </tr>
                        <tr>
                            <td class="noSpacing">
                            </td>
                            <td class="noSpacing">
                                <asp:CompareValidator ID="cvMinMaxAmount" runat="server" ErrorMessage="Minimum amount must be less then maximum"
                                    ControlToValidate="tbMinAmount" Display="Dynamic" ControlToCompare="tbMaxAmount"
                                    Type="Double" Operator="LessThan"></asp:CompareValidator>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <asp:Label ID="lblMaxAmount" runat="server" Text="Maximum amount"></asp:Label>
                            </td>
                            <td>
                                <asp:TextBox ID="tbMaxAmount" runat="server"></asp:TextBox>
                                <asp:RequiredFieldValidator ID="rfvMaxAmount" runat="server" Display="Static" ErrorMessage="*"
                                    ControlToValidate="tbMaxAmount"></asp:RequiredFieldValidator>
                            </td>
                        </tr>
                        <tr>
                            <td class="noSpacing">
                            </td>
                            <td class="noSpacing">
                                <asp:RegularExpressionValidator ID="revMaxAmount" runat="server" Display="Dynamic"
                                    ErrorMessage="Enter in format: nnnn,nn" ValidationExpression="^\d+(\,\d\d)?$"
                                    ControlToValidate="tbMaxAmount"></asp:RegularExpressionValidator>
                            </td>
                        </tr>
                        <tr>
                            <td class="noSpacing">
                            </td>
                            <td class="noSpacing">
                                <asp:CompareValidator ID="cvMaxLimit" runat="server" Display="Dynamic" Type="Double"
                                    ValueToCompare="1" ControlToValidate="tbMaxAmount" Operator="LessThanEqual" OnPreRender="cvMaxLimit_OnPreRender"></asp:CompareValidator>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <asp:Label ID="lblInterest" runat="server" Text="Interest, %"></asp:Label>
                            </td>
                            <td>
                                <asp:TextBox ID="tbInterest" runat="server"></asp:TextBox>
                                <asp:RequiredFieldValidator ID="rfvInterest" runat="server" Display="Static" ErrorMessage="*"
                                    ControlToValidate="tbInterest"></asp:RequiredFieldValidator>
                            </td>
                        </tr>
                        <tr>
                            <td class="noSpacing">
                            </td>
                            <td class="noSpacing">
                                <asp:RegularExpressionValidator ID="revInterest" runat="server" Display="Dynamic"
                                    ErrorMessage="Enter in format: nnnn,nn" ValidationExpression="^\d+(\,\d\d)?$"
                                    ControlToValidate="tbInterest"></asp:RegularExpressionValidator>
                            </td>
                        </tr>
                        <tr>
                            <td class="noSpacing">
                            </td>
                            <td class="noSpacing">
                                <asp:CompareValidator ID="cvInterest" runat="server" ControlToValidate="tbInterest"
                                    Display="Dynamic" ValueToCompare="100" Type="Double" Operator="LessThan" ErrorMessage="Interest must be less then 100%"></asp:CompareValidator>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <asp:Label ID="lblMinTerm" runat="server" Text="Minimum term, month &nbsp"></asp:Label>
                            </td>
                            <td>
                                <asp:TextBox ID="tbMinTerm" runat="server"></asp:TextBox>
                                <asp:RequiredFieldValidator ID="rfvMinTerm" runat="server" Display="Static" ErrorMessage="*"
                                    ControlToValidate="tbMinTerm"></asp:RequiredFieldValidator>
                            </td>
                        </tr>
                        <tr>
                            <td class="noSpacing">
                            </td>
                            <td class="noSpacing">
                                <asp:RegularExpressionValidator ID="revMinTerm" runat="server" Display="Dynamic"
                                    ErrorMessage="Enter only integer type" ValidationExpression="\d+" ControlToValidate="tbMinTerm"></asp:RegularExpressionValidator>
                            </td>
                        </tr>
                        <tr>
                            <td class="noSpacing">
                            </td>
                            <td class="noSpacing">
                                <asp:CompareValidator ID="cvMinMaxTerm" runat="server" Display="Dynamic" ControlToValidate="tbMinTerm"
                                    Type="Integer" ControlToCompare="tbMaxTerm" Operator="LessThan" ErrorMessage="Minimum term must be less then maximum"></asp:CompareValidator>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <asp:Label ID="lblMaxTerm" runat="server" Text="Maximum term, month &nbsp"></asp:Label>
                            </td>
                            <td>
                                <asp:TextBox ID="tbMaxTerm" runat="server"></asp:TextBox>
                                <asp:RequiredFieldValidator ID="rfvMaxTerm" runat="server" Display="Static" ErrorMessage="*"
                                    ControlToValidate="tbMaxTerm"></asp:RequiredFieldValidator>
                            </td>
                        </tr>
                        <tr>
                            <td class="noSpacing">
                            </td>
                            <td class="noSpacing">
                                <asp:RegularExpressionValidator ID="revMaxTerm" runat="server" Display="Dynamic"
                                    ErrorMessage="Enter only integer type" ValidationExpression="\d+" ControlToValidate="tbMaxTerm"></asp:RegularExpressionValidator>
                            </td>
                        </tr>
                        <tr>
                            <td class="noSpacing">
                            </td>
                            <td class="noSpacing">
                                <asp:RangeValidator ID="rvMaxTerm" runat="server" Display="Dynamic" MinimumValue="1"
                                    MaximumValue="300" ControlToValidate="tbMaxTerm" ErrorMessage="Maximum term must be less then 300 months"
                                    Type="Integer"></asp:RangeValidator>
                            </td>
                        </tr>
                    </tbody>
                </table>

Когда срабатывает валидатор, содержимое сдвигается вниз, после этого када поправляеш содержимое не валидного поля на валидную информацию и сразу же жмеш на кнопку под этой формой сначала срабатывают валидаторы тоесть скрываются ибо данные уже валидны, и кнопка подьезжает вверх, и нада еще раз по ней кликнуть, тоесть в первый раз кнопка убегает) Как это исправить? И можно ли както сделать так чтоб валидатор не просто выводил строку с ошибкой а както красиво это делал например в сплывающем тултипе?

DaRiYs 04-11-2010 14:09 1534614

Ребята что нихто не подкажет есть ли такое решение и где эго можн найти или как сделать?

Delirium 05-11-2010 04:40 1535095

Попробуй поместить валидатор в отдельную ячейку справа от поля, должно помочь. Сейчас валидатор расположен рядом с текстбоксом в одной ячейке, потому и сползает все в сторону.

Цитата:

Цитата DaRiYs
красиво это делал например в сплывающем тултипе »

ПОвесить обработчик на срабатывание валидатора и скрывать сам валидатор, выводя свой тултип вместо него.

DaRiYs 06-11-2010 13:01 1536072

Цитата:

Цитата Delirium
ПОвесить обработчик на срабатывание валидатора и скрывать сам валидатор, выводя свой тултип вместо него »

Это я так понимаю нада сделать на JavaScrips и\или jQuery. Тогда на какое событие его вешать?

Delirium 08-11-2010 01:48 1537326

Цитата:

Цитата DaRiYs
Тогда на какое событие его вешать »

TextBox_changed вроде бы. или LostFocus.


Время: 17:14.

Время: 17:14.
© OSzone.net 2001-