Pergunta

Eu sei que há um controle Wizard disponíveis, mas o que eu quero é tão simplista que eu não consigo descobrir onde eu comecei virando fora da extremidade profunda aqui. Quando um usuário coloca em seu nome e hits próximos eu quero o controle de calendário para se tornar selecatable uma data de início para. Eu tenho a capacidade de marcar a data de início tão verde. Eu quero que eles para selecionar afastado até que atingiu o botão continuar. Problema 1 é que eles podem bater outra sem uma data. Eu quero pegar isso. Issue dois é que eles podem selecionar novamente muitas vezes antes de bater seguinte. Eu quero que eles sejam capazes de fazer isso. Uma vez que atingiu seguinte, eu quero que eles sejam capazes de escolher e data final mais e mais, até que atingiu seguinte. Então eu quero que eles para confirmar seus coices. Eu acho que a lógica não é tão simples ... O código que eu escrevi é tão ruim. :(. Mesmo as correções adequadas machucar a minha cabeça porque StartDateStartPart e EndDateStartPart apenas se tornaria jargão mental. Estou, obviamente, vai ter de repensar e refazer este a partir do zero.

<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"];
}
Foi útil?

Solução

Se você não quer mexer com AJAX, a forma mais tradicional de fazer esse tipo de coisa com formulários web é usar um painel de controle para cada página / formulário do assistente, e em seguida, esconder ou revelar os vários painéis no postback. Não é tão divertido ou arrefecer como a abordagem AJAX, mas se ele é realmente apenas um simples pequeno bruxo, então esta é uma maneira rápida e fácil de fazer isso.

O formulário web pode ser algo como isto:

<%@ 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>

O estado de visualização página irá gerir o valor de seus controles, que você pode então acesso no code-behind para implementar sua lógica de negócios como você esconder e revelar os painéis. Por exemplo:

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...
            }
        }
    }
}

Outras dicas

Parece que você pode ter que usar javascript / ajax para construir uma interface de usuário intuitiva para o assistente. Eu recomendaria Jquery como é fácil de aprender e manipular elementos DOM.

Depois de muito pensar eu acho que preciso para fazer uma máquina de estado finito com um diagrama mostrando todas as possíveis transições de estado. Além disso, a seleção de bons nomes varible e não escrever como aprendizagem é provavelmente necessário.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top