1

我知道有一个可用的向导控件，但我想要的太简单了，我无法弄清楚我是从哪里开始偏离这里的深渊的。当用户输入他们的名字并点击下一步时，我希望日历控件可以选择开始日期。我可以将开始日期标记为绿色。我希望他们选择离开，直到他们点击继续按钮。问题 1 是他们可以在没有日期的情况下点击下一步。我想抓住那个。问题二是他们可以在点击下一个之前多次重新选择。我希望他们能够做到这一点。一旦他们点击下一个，我希望他们能够一遍又一遍地选择和结束日期，直到他们点击下一个。然后我希望他们确认他们的合作。我猜逻辑不是那么简单……我写的代码太糟糕了。:(。即使是正确的修复也让我头疼，因为 StartDateStartPart 和 EndDateStartPart 只会变成精神上的胡言乱语。我显然将不得不重新考虑并从头开始重做。

<script runat="server" enableviewstate="True">

DateTime begin;
DateTime end;
int iSelectedStart = 0;
int iSelectedEnd = 0;
int iPutName = 0;

protected void Button1_Click(object sender, EventArgs e)
{
  if (iPutName == 0)
  {
    Label1.Text = TextBox1.Text + " you will be slecting your start and end dates.";
    LabelInstructions1.Text = "Please select a begin date and hit next";
    Calendar1.SelectionMode = System.Web.UI.WebControls.CalendarSelectionMode.Day;
    iPutName = 1;
    ViewState["iPutName"] = 1;
    ViewState["Label1_Text"] = Label1.Text;
    ViewState["LabelInstructions1_Text"] = LabelInstructions1.Text;
    ViewState["Calendar1_SelectionMode"] = Calendar1.SelectionMode;
  }
  else
  {
    if (iSelectedStart <= 0)
    {
      LabelInstructions1.Text = "You have not selected a start date please do so.";
    }
    else if (iSelectedStart < 99)
    {
      iSelectedStart = 99;
      Label1.Text = TextBox1.Text + " you will be slecting your start and end dates.";
      LabelInstructions1.Text = "Please select an end date and hit confirm";
      ViewState["begin"] = begin;
      ViewState["iSelectedStart"] = iSelectedStart;
    }
    else
    {
      if (iSelectedEnd = 0)
      {
        LabelInstructions1.Text = "You have not selected a start date please do so.";
      }
    }

  }
}


protected void Calendar1_SelectionChanged(object sender, EventArgs e)
{
  if (iSelectedStart < 99)
  {
    iSelectedStart++;
    begin = Calendar1.SelectedDate;
    ViewState["iSelectedStart"] = iSelectedStart;
    ViewState["begin"] = begin;
  }
  else
  {
    if (begin == Calendar1.SelectedDate)
    {
      LabelInstructions1.Text = "Error you cannot select the same start and end date";
      LabelInstructions1.ForeColor = System.Drawing.Color.Red;
    }
    else
    {
      end = Calendar1.SelectedDate;
      iSelectedEnd = 0;
      ViewState["end"] = end;
    }
  }
}

protected void Calendar1_DayRender(object sender, DayRenderEventArgs e)
{
  if (e.Day.Date == begin)
  {
    e.Cell.BackColor = System.Drawing.Color.Green;
  }
  if (e.Day.Date == end)
  {
    e.Cell.BackColor = System.Drawing.Color.Red;
  }
}

protected void Page_Load(object sender, EventArgs e)
{
  if (ViewState["iPutName"] != null)
    iPutName = (int)ViewState["iPutName"];

  if (ViewState["Label1_Text"] != null) 
   Label1.Text = ViewState["Label1_Text"].ToString();

  if (ViewState["LabelInstructions1_Text"] != null)
    LabelInstructions1.Text = ViewState["LabelInstructions1_Text"].ToString();

  if (ViewState["Calendar1_SelectionMode"] != null)
    Calendar1.SelectionMode = (CalendarSelectionMode) ViewState["Calendar1_SelectionMode"];

  if (ViewState["begin"] != null)
    begin = (DateTime)ViewState["begin"];

  if (ViewState["end"] != null)
    end = (DateTime)ViewState["end"];
}
4

3 回答 3

1

如果您不想弄乱 AJAX，使用 Web 表单执行此类操作的更传统方法是为向导的每个页面/表单使用面板控件，然后在回发时隐藏或显示各种面板。它不像 AJAX 方法那样有趣或酷，但如果它真的只是一个简单的小向导，那么这是一种快速简便的方法。

Web 表单可能如下所示：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="PanelWizard._Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Panel ID="wizForm1" runat="server" Height="50px" Width="125px">
            <asp:TextBox ID="txtName" runat="server" OnTextChanged="TextBox1_TextChanged"></asp:TextBox></asp:Panel>

    </div>
        <asp:Panel ID="wizForm2" runat="server" Height="50px" Width="125px" Visible="False">
            <asp:Calendar ID="calStart" runat="server"></asp:Calendar>
        </asp:Panel>
        <asp:Button ID="btnContinue" runat="server" OnClick="btnContinue_Click" Text="Continue" />
    </form>
</body>
</html>

页面视图状态将管理您的控件的值，然后您可以在隐藏和显示面板时在代码隐藏中访问它以实现您的业务逻辑。例如：

namespace PanelWizard
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void btnContinue_Click(object sender, EventArgs e)
        {
            // validate controls according to business logic
            //...

            // Hide and reveal panels based on the currently visible panel.
            if (wizForm1.Visible)
            {
                wizForm1.Visible = false;
                wizForm2.Visible = true;
            }
            else if (wizForm2.Visible)
            {
                // and so on...
            }
        }
    }
}
于 2009-04-01T03:19:54.283 回答
0

看起来您可能必须使用 javascript/ajax 为向导构建直观的 UI。我会推荐 Jquery，因为它易于学习和操作 DOM 元素。

于 2009-03-31T07:10:20.307 回答
0

经过深思熟虑，我认为我需要制作一个有限状态机，其中包含一个显示所有可能状态转换的图表。此外，选择好的变量名而不是作为学习的写作可能是必要的。

于 2009-04-01T02:46:22.647 回答