1

私は Web フィードバック ウィザードを持っています。ブラウザーでテストして [次へ] ボタンをクリックすると、ステップ 1 からステップ 2 までは正常に進みますが、ステップ 3 に進むことは拒否されます。各ステップでテキスト ボックスを追加しましたが、まだ正しく機能していません。「次へ」をクリックすると、ステップが移動します (連絡先情報からコメントまで機能すると言ったように) が、Web ページの上部までスクロールし、ウィザードからフォーカスを失います。これは迷惑です。したがって、2 つの問題があります。(1) 私のウィザードは 4 つのステップのうち 2 つしか進みません。(2) ウィザードはフォーカスを失います。

これが私のウィザードコントロールにあるものです:

  <asp:Wizard ID="Wizard1" runat="server" BackColor="#E6E2D8" 
    BorderColor="#999999" BorderStyle="Solid" BorderWidth="1px" 
    Font-Names="Verdana" Font-Size="0.8em" ActiveStepIndex="0" Height="371px" 
    Width="691px" style="margin-top: 178px" 
onfinishbuttonclick="Wizard1_FinishButtonClick" TabIndex="1" 
                onactivestepchanged="Wizard1_ActiveStepChanged" 
                onload="Wizard1_ActiveStepChanged" onnextbuttonclick="OnNextButtonClick" 
                onprerender="Wizard1_ActiveStepChanged"  >
    <HeaderStyle BackColor="#666666" BorderColor="#E6E2D8" BorderStyle="Solid" 
        BorderWidth="2px" Font-Bold="True" Font-Size="0.9em" ForeColor="White" 
        HorizontalAlign="Center" />
    <NavigationButtonStyle BackColor="White" BorderColor="#C5BBAF" 
        BorderStyle="Solid" BorderWidth="1px" Font-Names="Verdana" Font-Size="2em" 
        ForeColor="#1C5E55" />
    <SideBarButtonStyle ForeColor="#855A21" />
    <SideBarStyle BackColor="#E3D3AC" Font-Size="0.9em" VerticalAlign="Top" />
    <StepStyle BackColor="#F7F6F3" BorderColor="#E6E2D8" BorderStyle="Solid" 
        BorderWidth="2px" VerticalAlign="Top" />
    <WizardSteps>
        <asp:WizardStep ID="WizardStep1" runat="server" Title="Contact Info" 
            StepType="Start">
            <table cellpadding="10" class="style1">
                <tr>
                    <td class="style2">
                        Your Name</td>
                    <td class="style3">
                        <asp:TextBox ID="nametxt" runat="server" style="margin-left: 0px" 
                            Width="137px"></asp:TextBox>
                    </td>
                    <td>
                        <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" 
                            ControlToValidate="nametxt" ErrorMessage="Please Enter your name"></asp:RequiredFieldValidator>
                    </td>
                </tr>
                <tr>
                    <td class="style5">
                        Email</td>
                    <td class="style6">
                        <asp:TextBox ID="emailtxt" runat="server"></asp:TextBox>
                    </td>
                    <td class="style6">
                        <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" 
                            ControlToValidate="emailtxt" ErrorMessage="Please enter your email address" 
                            ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"></asp:RegularExpressionValidator>
                    </td>
                </tr>
                <tr>
                    <td class="style5">
                        City</td>
                    <td class="style6">
                        <asp:TextBox ID="citytxt" runat="server"></asp:TextBox>
                    </td>
                    <td class="style6">
                        <asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" 
                            ErrorMessage="Please enter your city or town" 
                            ValidationExpression="^[a-zA-Z0-9\s.\-]+$" ControlToValidate="citytxt"></asp:RegularExpressionValidator>
                    </td>
                </tr>
                <tr>
                    <td class="style5">
                        State</td>
                    <td class="style6">
                        <asp:TextBox ID="statebox" runat="server" MaxLength="2" Width="47px"></asp:TextBox>
                    </td>
                    <td class="style6">
                        <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" 
                            ControlToValidate="statebox" ErrorMessage="Please enter your state"></asp:RequiredFieldValidator>
                    </td>
                </tr>
                <tr>
                    <td class="style2">
                        &nbsp;</td>
                    <td class="style3" colspan="2">
                        <asp:ValidationSummary ID="ValidationSummary1" runat="server" Width="163px" />
                    </td>
                </tr>
            </table>
        </asp:WizardStep>
        <asp:WizardStep ID="WizardStep2" runat="server" Title="Comments" 
            StepType="Step">
            <table cellpadding="10" class="style1">
                <tr>
                    <td class="style4">
                        Comments<br />(no more than 500 characters)</td>
                    <td>
                        <asp:TextBox ID="txtcomments" runat="server" Height="55px" TextMode="MultiLine" 
                            Width="233px"></asp:TextBox>
                    </td>
                    <td>
                        <asp:CustomValidator ID="CustomValidator1" runat="server" 
                            ClientValidationFunction="ValidateComments" ControlToValidate="txtcomments" 
                            ErrorMessage="Please enter no more than 500 characters" 
                            OnServerValidate="CustomerValidator1"></asp:CustomValidator>
                    </td>
                </tr>
                <tr>
                    <td class="style4">
                        Rating<br />(1-5)</td>
                    <td>
                        <asp:TextBox ID="txtrating" runat="server"></asp:TextBox>
                    </td>
                    <td>
                        <asp:RangeValidator ID="RangeValidator1" runat="server" 
                            ControlToValidate="txtrating" ErrorMessage="Use a number between 1-5" 
                            MaximumValue="5" MinimumValue="1"></asp:RangeValidator>
                    </td>
                </tr>
                <tr>
                    <td class="style4">
                        &nbsp;</td>
                    <td colspan="2">
                        <asp:ValidationSummary ID="ValidationSummary2" runat="server" Height="42px" />
                        <asp:CompareValidator ID="CompareValidator1" runat="server" 
                            ControlToValidate="txtcomments"></asp:CompareValidator>
                    </td>
                </tr>
            </table>
        </asp:WizardStep>
        <asp:WizardStep ID="WizardStep3" runat="server" Title="Summary" 
            StepType="Finish">
            <table cellpadding="10" class="style1">
                <tr>


                        <td class="style7">
                           <h3>Summary:</h3>
                           <br />
                            <asp:Label ID="nameLabel" runat="server" AssociatedControlID="namelabel"></asp:Label>
                        </td>
                        <td class="style7">
                        </td>

                </tr>
                <tr>


                    <td>
                         <asp:Label ID="EmailLabel" runat="server" AssociatedControlID="Emaillabel" ></asp:Label></td>
                    <td>
                        &nbsp;</td>
                </tr>
                <tr>
                    <td>
                        <asp:Label ID="cityLabel" runat="server" AssociatedControlID="citylabel"></asp:Label>
                    </td>
                    <td>
                        &nbsp;</td>
                </tr>
                <tr>
                    <td>
                        <asp:Label ID="stateLabel" runat="server" AssociatedControlID="statelabel"></asp:Label>
                    </td>
                    <td>
                        &nbsp;</td>
                </tr>
                <tr>
                    <td>
                        <asp:Label ID="commentslabel" runat="server" AssociatedControlID="commentslabel"></asp:Label>
                    </td>
                    <td>
                        &nbsp;</td>
                </tr>
                <tr>
                    <td>
                        <asp:Label ID="ratinglabel" runat="server" AssociatedControlID="txtrating"></asp:Label>
                    </td>
                    <td>
                        &nbsp;</td>
                </tr>
            </table>
        </asp:WizardStep>
        <asp:WizardStep ID="WizardStep4" runat="server" Title="Complete" 
            StepType="Complete">
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />

         <h3>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Thank You!</h3>
        </asp:WizardStep>
    </WizardSteps>
</asp:Wizard>

これが私が後ろのコードに持っているものです:(c#)

protected void Page_Load(object sender, EventArgs e)
   {

    //Prevent display of sitemap on default page.
    SiteMapNode node = SiteMap.CurrentNode;

    if (node.ParentNode == null)
    {
        SiteMapPath1.Visible = false;
        Wizard1.Visible = false;
    }

    nameLabel.Text = nametxt.Text;
    EmailLabel.Text = emailtxt.Text;
    cityLabel.Text = citytxt.Text;
    stateLabel.Text = statebox.Text;
    commentslabel.Text = txtcomments.Text;
    ratinglabel.Text = txtrating.Text;

}


 public void OnNextButtonClick(object sender, WizardNavigationEventArgs e)
  {

        this.Wizard1.Focus();
        Wizard1_ActiveStepChanged(sender, e);

   }




   private TextBox FindFirstTextBox(Control c)
     {

    TextBox nothing = null;
    Control results;

    if ((c == null))
    {
        return nothing;
    }

    if (c.GetType() == typeof(TextBox))
    {
        return (TextBox)c;
    }




    foreach (Control child in c.Controls)
    {
      results = FindFirstTextBox(child);

      if (results != null && (results.GetType() == typeof(TextBox)))
      {
          return (TextBox)results;

      }
      else
      {

          return nothing;
      }


     }

    return nothing;

}

protected void Wizard1_ActiveStepChanged(object sender, System.EventArgs e)
{
    // Set the focus to the first TextBox in the current step
    WizardStepBase currentWizardStep = Wizard1.ActiveStep;
    // Find the first TextBox
    TextBox firstTextBox = FindFirstTextBox(currentWizardStep);
    // If we found a TextBox, set the Focus
    if (!(firstTextBox == null))
    {
        firstTextBox.Focus();
    }
}
4

1 に答える 1

2

わかりました...ウィザードの2番目のステップで、txtCommentsフィールドに比較バリデーターがあるためです...修正するか削除することをお勧めします...これが私が参照しているコードです(あなたのウィザード ステップ 2)

 <asp:CompareValidator ID="CompareValidator1" runat="server" 
   ControlToValidate="txtcomments"></asp:CompareValidator>

上記のコードに欠けているものは次のとおりです。

  • 「ControlToCompare」プロパティを設定します。
  • エラーメッセージを設定...

2 番目の問題の更新

各タブの...最初のテキスト ボックスにフォーカスを維持し、スクロール位置を維持するには...以下の手順に従います...

ステップ 1 Page_Load イベントで...以下のコード行を追加します

nametxt.Focus(); // This will make sure that your nametxt texbox has focus when your page loads for the first time

ステップ 2 FindFirstTextBox メソッドのコードは以下のように単純にすることができます...そのため、以下のコードに更新してください...

// This code is pretty much self explanatory    
private TextBox FindFirstTextBox(Control c)
        {
            foreach (Control child in c.Controls)
            {
                if (child is TextBox)
                    return (TextBox)child;
            }

            //If we didn't find a TextBox
            return null;
        }

ステップ 3 Wizard_ActiveStepChanged イベントを以下に更新します...

protected void Wizard1_ActiveStepChanged(object sender, System.EventArgs e)
        {
            // Set the focus to the first TextBox in the current step
            WizardStepBase currentWizardStep = Wizard1.ActiveStep;

            // Find the first TextBox
            TextBox firstTextBox = FindFirstTextBox(currentWizardStep);
            // If we found a TextBox, set the Focus               

            if (Page.IsPostBack && firstTextBox != null)
            {
                firstTextBox.Focus();
            }
        }

上記のイベント コードでは、if ステートメントを変更して、page.IsPostBack のチェックを追加しました...これは、Focus メソッドが例外をスローするためです...このイベントは OnLoad および OnRender の前に呼び出されるためです.. .なぜこのステップをそんなに早く呼び出しているのかを理解するのはあなた次第です...

ステップ 4最後に、スクロールの問題を解決するには、更新パネルを使用する必要があります...以下のコード スニペットを参照してください...

 // Your Update Panel needs a Script Manager to work    
    <asp:scriptManager runat="server" ID="sm"></asp:scriptManager>
        <asp:UpdatePanel runat="server" ID="panel" UpdateMode="Always">
        <ContentTemplate>

        // ALL YOUR CONTENT MARK UP GOES HERE

    </ContentTemplate>
    </asp:UpdatePanel>

これでおそらく2番目の問題が解決するはずです...

于 2012-04-21T15:32:16.043 に答える