2012-11-16 3 views
0

나는 멀티 뷰 컨트롤 안에 앉아있는 웹 사이트 양식 (C#)을 가지고 있습니다. muliview 컨트롤에는 4 단계가 있으므로 첫 3 단계는 정보를 수집하고 유효한 경우 버튼 클릭시 다음보기로 이동합니다.버튼 클릭시 프로그래밍 방식으로 컨트롤을 추가하는 방법은 무엇입니까?

이전 답변을 기반으로 양식을 동적으로 만들고 싶습니다. 그러나 지금까지 읽은 것에서는 어떻게해야 할 지 잘 모르겠습니다.

예를 들어, 1 단계에서 사용자가 일부 텍스트 상자 컨트롤을 완료하고 제출을 클릭합니다.

패널 1에서 제출 된 데이터를 기반으로 다음 패널은 일부 레이블, 일부 텍스트 상자 등 여러 가지 컨트롤을 동적으로 만들어야합니다.

이 클릭은 init 및 page_load 후에 발생하므로이 방법이 어떻게 작동하는지 확신 할 수 없습니다.

물론 앞면의 모든 레이블/텍스트 상자 컨트롤을 만들 수 있으며 필요에 따라 사용하지 않도록 설정할 수 있습니다. 그러나 이것은 리소스를 상당히 사용하지 않는 것 같습니다.

결론 동적 컨트롤로 작업 할 때 나는 경험이 없으므로 조언을 주시면 감사하겠습니다.

+0

두 번째 패널의 데이터로 무엇을하고 있습니까? 버튼, 포스트 백이 있습니까? OnInit 후에 컨트롤을 만들면 여전히 만들어 지지만 포스트 백 데이터는 자동 설정되지 않습니다. 따라서 두 번째 패널에서 포스트 백을 호출하고 이러한 동적 컨트롤의 데이터가 필요한 경우이 데이터를 Request.Forms [dynamicControlClientId]에서 OnInit으로 가져 오거나이 데이터를 ViewState에 저장해야합니다. 또 다른 문제는 포스트 백 후에 동적 컨트롤을 볼 필요가 있기 때문에 두 번째 패널에 정보를 저장하여 포스트 백 (첫 번째 패널의 조건)을 만드는 방법입니다. – pawciu

+0

예, 추가 포스트 백이 있습니다. 모든 멀티 뷰에는 4 단계가 있으므로 처음 3 단계는 다음 단계로 넘어갈 때 다시 게시됩니다. – dotnetnoob

답변

1

다음은 작동 예제를 붙여 넣은 것입니다. 이 예는 다음과 같습니다에 대한

  • 는 동적 제어

    EnableViewState = false

    데이터에 오류

Message=Failed to load viewstate. The control tree into which viewstate is being loaded must match the control tree that was used to save viewstate during the previous request. For example, when adding controls dynamically, the controls added during a post-back must match the type and position of the controls added during the initial request. Source=System.Web ErrorCode=-2147467259

설정이 속성을 방지하려면 : 상황이 인식하는

브랜드 엔진 컬러 비용
VW, 1.2, 블랙, 72 000
VW, 1.2, 화이트, (70) 000
VW, 1.6 TDI, 레드, 79 (500)
VW, 1.6 TDI, 화이트, (78) 800
포드, 1.6, 블랙, 57 (600)
포드, 1.6, 그린, 57 (100)
포드 2.0 TDCi가, 블랙, 87 (300)
포드 2.0 TDCi가, 화이트, 86 (600)

Basicaly이 같이 작동 this :

  • 자동차 브랜드를 선택하고 버튼을 선택하십시오 (버튼은 세대 제어에 대한 Google의 기준 임) 물론 드롭 다운 등으로 로직을 수행 할 수도 있습니다.두 개의 드롭 다운이있는 경우 종속성의 예와 포스트 백을 그래서 두 번째 화면에서
  • 당신은 당신의 선택에 하나 또는 두 개의 드롭 다운을 기반으로 한
  • , 두 번째는, 첫번째 드롭 다운의 선택의 의존

뒤에

<form id="form1" runat="server"> 
<div> 
<asp:MultiView ID="mvPanels" runat="server"> 
    <asp:View ID="vPanel1" runat="server"> 
     <table> 
      <tbody> 
       <tr> 
        <td>Pick car</td> 
        <td><asp:DropDownList ID="ddlBrand" runat="server" /></td> 
        <td><asp:Button ID="btnPanel1Next" Text="Next" runat="server" 
          onclick="btnPanel1Next_Click" /></td> 
        <td><asp:Button ID="btnPanel1NextEngineOnly" Text="Next (pick engine only)" runat="server" 
          onclick="btnPanel1NextEngineOnly_Click" /></td> 
       </tr> 
      </tbody> 
     </table> 
    </asp:View> 
    <asp:View ID="vPanel2" runat="server"> 
     <%--<table> 
      <tbody> 
       <tr> 
        <td>Pick engine</td> 
        <td><asp:DropDownList ID="ddlEngine" AutoPostBack="true" runat="server" 
          onselectedindexchanged="ddlEngine_SelectedIndexChanged" /></td> 
        <td><asp:DropDownList ID="ddlColor" AutoPostBack="true" runat="server" 
          onselectedindexchanged="ddlColor_SelectedIndexChanged" /></td> 
        <td><asp:Button ID="btnPanel2Prev" Text="Prev" runat="server" 
          onclick="btnPanel2Prev_Click" /><asp:Button ID="btnPanel2Next" Text="Next" 
          runat="server" Enabled="False" onclick="btnPanel2Next_Click" /></td> 
       </tr> 
      </tbody> 
     </table>--%> 
    </asp:View> 
    <asp:View ID="vPanel3" runat="server"> 
     <table> 
      <tbody> 
       <tr> 
        <td><asp:Label ID="lblResult" runat="server" /></td> 
        <td><asp:Button ID="btnPanel3Prev" Text="Prev" runat="server" 
          onclick="btnPanel3Prev_Click" /><asp:Button ID="btnPanel3Finish" 
          Text="Confirm" runat="server" onclick="btnPanel3Finish_Click" /></td> 
       </tr> 
      </tbody> 
     </table> 
    </asp:View> 
</asp:MultiView> 
</div> 
</form> 

코드 : 페이지 코드

public partial class Default : System.Web.UI.Page 
{ 
    public class CarConfiguration 
    { 
     public string Brand { get; set; } 
     public string Engine { get; set; } 
     public PaintColor Paint { get; set; } 
     public string Cost { get; set; } 
    } 

    [Serializable] 
    public class CarConfigurationFilter 
    { 
     public string Brand { get; set; } 
     public string Engine { get; set; } 
     public PaintColor? Paint { get; set; } 
     public bool EngineOnly { get; set; } 
    } 

    public enum PaintColor 
    { 
     Black, 
     Red, 
     White, 
     Green, 
    } 

    public List<CarConfiguration> availableCars = new List<CarConfiguration> 
    { 
     new CarConfiguration{ 
      Brand = "VW", 
      Engine = "1.2", 
      Paint = PaintColor.Black, 
      Cost = "72 000", 
     }, 
     new CarConfiguration{ 
      Brand = "VW", 
      Engine = "1.2", 
      Paint = PaintColor.White, 
      Cost = "70 000", 
     }, 
     new CarConfiguration{ 
      Brand = "VW", 
      Engine = "1.6 TDI", 
      Paint = PaintColor.Red, 
      Cost = "79 500" 
     }, 
     new CarConfiguration{ 
      Brand = "VW", 
      Engine = "1.6 TDI", 
      Paint = PaintColor.White, 
      Cost = "78 800", 
     }, 
     new CarConfiguration{ 
      Brand = "Ford", 
      Engine = "1.6", 
      Paint = PaintColor.Black, 
      Cost = "57 600" 
     }, 
     new CarConfiguration{ 
      Brand = "Ford", 
      Engine = "1.6", 
      Paint = PaintColor.Green, 
      Cost = "57 100" 
     }, 
     new CarConfiguration{ 
      Brand = "Ford", 
      Engine = "2.0 TDCi", 
      Paint = PaintColor.Black, 
      Cost = "87 300" 
     }, 
     new CarConfiguration{ 
      Brand = "Ford", 
      Engine = "2.0 TDCi", 
      Paint = PaintColor.White, 
      Cost = "86 600" 
     }, 
    }; 

    CarConfigurationFilter filter 
    { 
     get { return (CarConfigurationFilter)ViewState["Filter"]; } 
     set { ViewState["Filter"] = value; } 
    } 

    //If you have multiview in control you need to create this in event before event PageLoad like LoadViewState, LoadControlState, LoadControlState 
    protected override void OnPreLoad(EventArgs e) 
    { 
     if (IsPostBack && mvPanels.ActiveViewIndex == 1) 
     { 
      CreateControlsOnPanel2(true, !filter.EngineOnly); 
     } 
     base.OnPreLoad(e); 
    } 

    protected override void OnLoad(EventArgs e) 
    { 
     if (!IsPostBack) 
     { 
      ddlBrand.DataSource = availableCars.Select(x => x.Brand).Distinct(); 
      ddlBrand.DataBind(); 
      filter = new CarConfigurationFilter(); 
      mvPanels.ActiveViewIndex = 0; 
     } 
     base.OnLoad(e); 
    } 

    protected void btnPanel1Next_Click(object sender, EventArgs e) 
    { 
     filter.Brand = ddlBrand.SelectedValue; 
     filter.EngineOnly = false; 

     CreateControlsOnPanel2(true, true); 

     mvPanels.ActiveViewIndex++; 
    } 

    protected void btnPanel1NextEngineOnly_Click(object sender, EventArgs e) 
    { 
     filter.Brand = ddlBrand.SelectedValue; 
     filter.EngineOnly = true; 
     CreateControlsOnPanel2(true, false); 

     mvPanels.ActiveViewIndex++; 
    } 

    void CreateControlsOnPanel2(bool enginePickerEnabled, bool colorPickerEnabled) 
    { 
     var btnPanel2Prev = new Button(); 
     btnPanel2Prev.ID = "btnPanel1Prev"; 
     btnPanel2Prev.EnableViewState = false;  
     btnPanel2Prev.Text = "Prev"; 
     btnPanel2Prev.Click += btnPanel2Prev_Click; 

     var btnPanel2Next = new Button(); 
     btnPanel2Next.ID="btnPanel2Next"; 
     btnPanel2Next.Text = "Next"; 
     btnPanel2Next.EnableViewState = false; 
     btnPanel2Next.Enabled = false; 
     btnPanel2Next.Click += btnPanel2Next_Click; 


     if (enginePickerEnabled) 
     { 
      var ddlEngine = new DropDownList(); 
      ddlEngine.ID = "ddlEngine"; 
      ddlEngine.AutoPostBack = true; 
      ddlEngine.EnableViewState = false; 

      var engines = availableCars.Where(x => x.Brand == filter.Brand).Select(found => found.Engine).Distinct().ToList(); 
      engines.Insert(0, String.Empty); 
      ddlEngine.DataSource = engines; 
      ddlEngine.DataBind(); 
      if (!String.IsNullOrEmpty(filter.Engine)) 
      { 
       ddlEngine.SelectedValue = filter.Engine; 
       if (!colorPickerEnabled) 
        btnPanel2Next.Enabled = true; 
      } 
      else 
       ddlEngine.SelectedIndex = 0; 
      ddlEngine.SelectedIndexChanged += ddlEngine_SelectedIndexChanged; 
      vPanel2.Controls.Add(ddlEngine); 
     } 
     //remember to add ID to all dynamic controls or there might be an error on postback 
     if (colorPickerEnabled) 
     { 
      var ddlColor = new DropDownList(); 
      ddlColor.ID = "ddlColor"; 
      ddlColor.AutoPostBack = true; 
      ddlColor.EnableViewState = false; 
      ddlColor.SelectedIndexChanged += ddlColor_SelectedIndexChanged; 
      vPanel2.Controls.Add(ddlColor); 

      if (!String.IsNullOrEmpty(filter.Engine)) 
      { 
       var colors = availableCars.Where(x => x.Brand == filter.Brand && x.Engine == filter.Engine).Select(found => found.Paint.ToString()).Distinct().ToList(); 
       colors.Insert(0, String.Empty); 
       ddlColor.DataSource = colors; 
       if (filter.Paint.HasValue) 
       { 
        ddlColor.SelectedValue = filter.Paint.Value.ToString(); 
        btnPanel2Next.Enabled = true; 
       } 

      } 
      else 
      { 
       ddlColor.DataSource = null; 
       ddlColor.SelectedIndex = 0; 
      } 
      ddlColor.DataBind(); 
     } 

     vPanel2.Controls.Add(btnPanel2Prev); 
     vPanel2.Controls.Add(btnPanel2Next); 
    } 

    protected void ddlEngine_SelectedIndexChanged(object sender, EventArgs e) 
    { 
     var ddlEngine = sender as DropDownList; 
     var btnPanel2Next = (Button)vPanel2.FindControl("btnPanel2Next"); 

     if (!String.IsNullOrEmpty(ddlEngine.SelectedValue)) 
     { 
      filter.Engine = ddlEngine.SelectedValue; 
      var colors = availableCars.Where(x => x.Brand == filter.Brand && x.Engine == filter.Engine).Select(found => found.Paint.ToString()).Distinct().ToList(); 
      colors.Insert(0, String.Empty); 
      filter.Paint = null; 

      var ddlColor = (DropDownList)vPanel2.FindControl("ddlColor"); 
      if (ddlColor != null) 
      { 
       ddlColor.DataSource = colors; 
       ddlColor.DataBind(); 
       ddlColor.SelectedIndex = 0; 

       btnPanel2Next.Enabled = false; 
      } 
      else 
       btnPanel2Next.Enabled = true; 
     } 
     else 
     { 
      var ddlColor = (DropDownList)vPanel2.FindControl("ddlColor"); 
      if (ddlColor != null) 
      { 
       ddlColor.Items.Clear(); 
       ddlColor.SelectedIndex = -1; 
      } 
      filter.Engine = null; 
      btnPanel2Next.Enabled = false; 
     } 
    } 

    protected void ddlColor_SelectedIndexChanged(object sender, EventArgs e) 
    { 
     var ddlColor = (DropDownList)vPanel2.FindControl("ddlColor"); 
     var btnPanel2Next = (Button)vPanel2.FindControl("btnPanel2Next"); 

     if (!String.IsNullOrEmpty(ddlColor.SelectedValue)) 
     { 
      filter.Paint = (PaintColor)Enum.Parse(typeof(PaintColor), ddlColor.SelectedValue); 
      btnPanel2Next.Enabled = true; 
     } 
     else 
     { 
      filter.Paint = null; 
      btnPanel2Next.Enabled = false; 
     } 
    } 

    protected void btnPanel2Prev_Click(object sender, EventArgs e) 
    { 
     filter.Engine = null; 
     filter.Paint = null; 
     mvPanels.ActiveViewIndex--; 
    } 

    protected void btnPanel2Next_Click(object sender, EventArgs e) 
    { 
     mvPanels.ActiveViewIndex++; 

     var selectedConfiguration = availableCars.Where(x => x.Brand == filter.Brand && x.Engine == filter.Engine 
     && (!filter.Paint.HasValue || x.Paint == filter.Paint)).Distinct().FirstOrDefault(); 
     if (selectedConfiguration != null) 
      lblResult.Text = String.Format("You have selected {0} {1} {2} for {3} PLN", selectedConfiguration.Brand, 
       selectedConfiguration.Engine, selectedConfiguration.Paint, selectedConfiguration.Cost); 
    } 

    protected void btnPanel3Prev_Click(object sender, EventArgs e) 
    { 
     mvPanels.ActiveViewIndex--; 
     CreateControlsOnPanel2(true, !filter.EngineOnly); 

    } 

    protected void btnPanel3Finish_Click(object sender, EventArgs e) 
    { 
    } 
} 

당신은 어떤이있는 경우 추가 질문 내가 기꺼이 도와 드리겠습니다

+0

조언 해 주셔서 감사합니다. – dotnetnoob

관련 문제