3

「登録」ボタンを並べて、col2で右揃えにすることはできますか？

マークアップは次のとおりです。

<asp:CreateUserWizard ID="CreateUserWizard1" runat="server" CreateUserButtonText="Register" ContinueDestinationPageUrl="~/Secure/PromotePandaVisa.aspx">
    <SideBarTemplate>
        Sidebar template
    </SideBarTemplate>
    <WizardSteps>
        <asp:CreateUserWizardStep runat="server">
            <ContentTemplate>
                <table border="0" cellpadding="2" cellspacing="2">
                    <colgroup>
                        <col width="120px"/>
                        <col width="150px" />
                        <col />
                        <tr>
                            <td class="CaptionLabel" colspan="3" style="white-space: nowrap; padding-left:10px; padding-top: 5px; padding-bottom: 15px;">
                                <asp:Label ID="Label1" runat="server" CssClass="LargeCaption LightText" Text="Register as an Affiliate"></asp:Label>
                                &nbsp;
                            </td>
                        </tr>
                        <tr>
                            <td align="right">
                                <asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName" CssClass="DefaultLabelCaption">User Name:</asp:Label>
                            </td>
                            <td>
                                <asp:TextBox ID="UserName" runat="server" CssClass="DefaultTextBox TextboxWidth"></asp:TextBox>
                            </td>
                            <td>
                                <asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="UserName" Display="Dynamic" ErrorMessage="User Name is required." ToolTip="User Name is required." ValidationGroup="CreateUserWizard1">Required</asp:RequiredFieldValidator>
                            </td>
                        </tr>
                        <tr>
                            <td align="right">
                                <asp:Label ID="PasswordLabel" runat="server" AssociatedControlID="Password" CssClass="DefaultLabelCaption">Password:</asp:Label>
                            </td>
                            <td>
                                <asp:TextBox ID="Password" runat="server" CssClass="DefaultTextBox TextboxWidth" TextMode="Password"></asp:TextBox>
                            </td>
                            <td>
                                <asp:RequiredFieldValidator ID="PasswordRequired" runat="server" ControlToValidate="Password" Display="Dynamic" ErrorMessage="Password is required." ToolTip="Password is required." ValidationGroup="CreateUserWizard1">Required</asp:RequiredFieldValidator>
                            </td>
                        </tr>
                        <tr>
                            <td align="right">
                                <asp:Label ID="ConfirmPasswordLabel" runat="server" AssociatedControlID="ConfirmPassword" CssClass="DefaultLabelCaption">Confirm Password:</asp:Label>
                            </td>
                            <td>
                                <asp:TextBox ID="ConfirmPassword" runat="server" CssClass="DefaultTextBox TextboxWidth" TextMode="Password"></asp:TextBox>
                            </td>
                            <td>
                                <asp:RequiredFieldValidator ID="ConfirmPasswordRequired" runat="server" ControlToValidate="ConfirmPassword" Display="Dynamic" ErrorMessage="Confirm Password is required." ToolTip="Confirm Password is required." ValidationGroup="CreateUserWizard1">Required</asp:RequiredFieldValidator>
                            </td>
                        </tr>
                        <tr>
                            <td align="right">
                                <asp:Label ID="EmailLabel" runat="server" AssociatedControlID="Email" CssClass="DefaultLabelCaption">E-mail:</asp:Label>
                            </td>
                            <td>
                                <asp:TextBox ID="Email" runat="server" CssClass="DefaultTextBox TextboxWidth"></asp:TextBox>
                            </td>
                            <td>
                                <asp:RequiredFieldValidator ID="EmailRequired" runat="server" ControlToValidate="Email" Display="Dynamic" ErrorMessage="E-mail is required." ToolTip="E-mail is required." ValidationGroup="CreateUserWizard1">Required</asp:RequiredFieldValidator>
                            </td>
                        </tr>
                        <tr>
                            <td align="right">
                                <asp:Label ID="AnswerLabel1" runat="server" AssociatedControlID="Answer" CssClass="DefaultLabelCaption">Company Name:</asp:Label>
                            </td>
                            <td>
                                <asp:TextBox ID="txtCompanyName" runat="server" CssClass="DefaultTextBox TextboxWidth"></asp:TextBox>
                            </td>
                            <td>
                                <asp:RequiredFieldValidator ID="AnswerRequired1" runat="server" ControlToValidate="txtCompanyName" Display="Dynamic" ErrorMessage="Security answer is required." SetFocusOnError="True" ToolTip="Security answer is required." ValidationGroup="CreateUserWizard1">Required</asp:RequiredFieldValidator>
                            </td>
                        </tr>
                        <tr>
                            <td align="right">
                                <asp:Label ID="AnswerLabel0" runat="server" AssociatedControlID="Answer" CssClass="DefaultLabelCaption">Website:</asp:Label>
                            </td>
                            <td>
                                <asp:TextBox ID="txtWebsite" runat="server" CssClass="DefaultTextBox TextboxWidth"></asp:TextBox>
                            </td>
                            <td>
                                <asp:RequiredFieldValidator ID="AnswerRequired0" runat="server" ControlToValidate="txtWebsite" Display="Dynamic" ErrorMessage="Security answer is required." SetFocusOnError="True" ToolTip="Security answer is required." ValidationGroup="CreateUserWizard1">Required</asp:RequiredFieldValidator>
                            </td>
                        </tr>
                        <tr style="display: none;">
                            <td align="right">
                                <asp:Label ID="QuestionLabel" runat="server" AssociatedControlID="Question" CssClass="DefaultLabelCaption">Security Question:</asp:Label>
                            </td>
                            <td>
                                <asp:TextBox ID="Question" runat="server" CssClass="DefaultTextBox TextboxWidth"></asp:TextBox>
                            </td>
                            <td>
                                &nbsp;</td>
                        </tr>
                        <tr style="display: none;">
                            <td align="right">
                                <asp:Label ID="AnswerLabel" runat="server" AssociatedControlID="Answer" CssClass="DefaultLabelCaption">Security Answer:</asp:Label>
                            </td>
                            <td>
                                <asp:TextBox ID="Answer" runat="server" CssClass="DefaultTextBox TextboxWidth"></asp:TextBox>
                            </td>
                            <td>
                                &nbsp;</td>
                        </tr>
                        <tr>
                            <td align="center" colspan="2">
                                &nbsp;
                                <asp:CompareValidator ID="PasswordCompare" runat="server" ControlToCompare="Password" ControlToValidate="ConfirmPassword" Display="Dynamic" ErrorMessage="The Password and Confirmation Password must match." ValidationGroup="CreateUserWizard1"></asp:CompareValidator>
                            </td>
                            <td align="center">
                                &nbsp;
                            </td>
                        </tr>
                        <tr>
                            <td align="center" colspan="2" style="color: Red;">
                                <asp:Literal ID="ErrorMessage" runat="server" EnableViewState="False"></asp:Literal>
                            </td>
                            <td align="center" style="color: Red;">
                                &nbsp;
                            </td>
                        </tr>
                    </colgroup>
                </table>
            </ContentTemplate>
        </asp:CreateUserWizardStep>
        <asp:CompleteWizardStep runat="server">
            <ContentTemplate>
                <table border="0">
                    <tr>
                        <td align="center">
                            Complete
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Your account has been successfully created.
                        </td>
                    </tr>
                    <tr>
                        <td align="right">
                            <asp:Button ID="ContinueButton" runat="server" CausesValidation="False" CommandName="Continue" Text="Continue" ValidationGroup="CreateUserWizard1" OnPreRender="StepNextButton_PreRender" />
                        </td>
                    </tr>
                </table>
            </ContentTemplate>
        </asp:CompleteWizardStep>
    </WizardSteps>
</asp:CreateUserWizard>

デザインビューは次のとおりです。

代替テキスト

追加の編集を実行するために、コードビハインドにコードを追加したいと思います。「ErrorMessage」LiteralControlを追加しました。コードビハインドからアクセスするにはどうすればよいですか、またはコントロールの機能を使用してカスタムメッセージを表示するための好ましい方法はありますか？

4

1 に答える 1

2

CreateUserWizardプロパティの使用を提案しますCreateUserButtonStyle-CssClass。

新しいクラスを自分で定義します。

<style type="text/css">
   .foo{
          margin-left: 120px;
    }
    </style>

次に、ウィザードボタンのプロパティを設定します。

   <asp:CreateUserWizard CreateUserButtonStyle-CssClass="foo"

唯一の問題は、出力されたマークアップの配置が、必要な「左」ではなく「右」になっていることです。

テーブルセルの配置がLEFTに設定されている場合のFirebugの外観については、この画像を参照してください。

左右の<td>コンテンツの配置の問題を解決すれば、準備は完了です。

jQueryを使用してこのボタンを見つけ、その親を取得し、その属性を左に<td>設定します。align

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

<style type="text/css">
    .foo
    {
        margin-left: 120px;
    }
</style>

 <script type="text/javascript">
     $(document).ready(function () {
         var btn = $("#CreateUserWizard1___CustomNav0_StepNextButtonButton");
         btn.parent().attr('align', 'left');

     });
 </script>
<head>

このセットアップの再現：http：//pastebin.org/698287

レンダリング方法は次のとおりです。

代替テキスト

于 2010-08-22T00:08:27.963 に答える