0

ビュー ステートでユーザー コントロールの値を維持したい

テキストボックスを試してみましたが、ドロップダウン値はビューステートで維持されています

しかし、BasicDatePicker の値がビュー ステートで維持されていません。null 値を取得しています。

コード:

.aspx

<asp:Repeater ID="rpt1" runat="server">
<ItemTemplate>
</ItemTemplate>
</asp:Repeater>
<asp:Button ID="addnewtext" runat="server" Text="Add" onclick="addnewtext_Click"  width="76px" />
<asp:Button ID="btnSaveVisa" Text="Save" runat="server" OnClick="btnSaveVisa_Click" /> 

.aspx.cs

 private const string VIEWSTATEKEY = "ContactCount";
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            //Set the number of default controls
            ViewState[VIEWSTATEKEY] = ViewState[VIEWSTATEKEY] == null ? 1 : ViewState[VIEWSTATEKEY];

            //Load the contact control based on Vewstate key
            LoadContactControls();
        }
    }

    protected override void LoadViewState(object savedState)
    {
        base.LoadViewState(savedState);

        LoadContactControls();
    }


    private void LoadContactControls()
    {
        for (int i = 0; i < int.Parse(ViewState[VIEWSTATEKEY].ToString()); i++)
        {
          rpt1.Controls.Add(LoadControl("AddVisaControl.ascx"));
        }
    }

    protected void addnewtext_Click(object sender, EventArgs e)
    {
        LoadContactControls();
        ViewState[VIEWSTATEKEY] = int.Parse(ViewState[VIEWSTATEKEY].ToString()) + 1;

    }
    private void saveData()
    {
        foreach (var control in rpt1.Controls)
        {
            var usercontrol = control as AddVisaControl;

            string s = usercontrol.TextVisaNumber;
            string date = usercontrol.ExpiryDate.ToShortDateString();
        }
    }

    protected void Save_Click(object sender, EventArgs e)
    {
        saveData();
    }
   }

.ascx

ここで BasicDatePicker のアセンブリを追加しました

   <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="AddVisaControl.ascx.cs" EnableViewState="false" Inherits="Pyramid.AddVisaControl" %>
   <%@ Register assembly="BasicFrame.WebControls.BasicDatePicker" namespace="BasicFrame.WebControls" tagprefix="BDP" %>
   <div id="divreg" runat="server">
   <table id="tbl" runat="server">
   <tr>
   <td>
    <asp:Label ID="lbl2" runat="server"></asp:Label>
   </td>
   </tr>
   <tr>
   <td> Visa Number:</td>
   <td><asp:TextBox ID="txtUser" Width="160px" runat="server"/></td>
   <td> Country Name:</td>
   <td><asp:DropDownList ID="dropCountry" Width="165px" runat="server">         </asp:DropDownList></td>
   </tr>
   <tr>
   <td> Type of Visa:</td>
   <td><asp:DropDownList ID="dropVisa" Width="165px" runat="server"></asp:DropDownList> </td>
   <td> Type of Entry:</td>
   <td><asp:DropDownList ID="dropEntry" Width="165px" runat="server"></asp:DropDownList></td>
   </tr>
   <tr>
    <td> Expiry Date</td>
   <td><BDP:BasicDatePicker ID="basicdate" runat="server"></BDP:BasicDatePicker></td>
   <td>
   <asp:Button ID="btnRemove" Text="Remove" runat="server" OnClick="btnRemove_Click" />
   </td>
   </tr>
   </table>
   </div>

.ascx.cs

protected void Page_Load(object sender, EventArgs e)
{
    txtUser.Text = Request.Form[txtUser.UniqueID];
    dropCountry.SelectedValue = Request.Form[dropCountry.UniqueID];
    dropVisa.SelectedValue = Request.Form[dropVisa.UniqueID];
    dropEntry.SelectedValue = Request.Form[dropEntry.UniqueID];
    //Here I'm getting null value  
    basicdate.SelectedValue = Request.Form[basicdate.UniqueID];
}

public string TextVisaNumber
{
    get { return txtUser.Text; }
    set { txtUser.Text = value; }
}

public DateTime ExpiryDate
{
    get
    {
        return basicdate.SelectedDate;
    }
    set
    {
        basicdate.SelectedDate = value;
    }
}

下の画像で、テキストボックス、ドロップダウン、および日付ピッカーを指定してから、[追加] ボタンをクリックすると、コントロールがテキストボックスに追加され、ドロップダウン値はそこにありますが、日付ピッカー値は消えます

ここに画像の説明を入力

何か案は?前もって感謝します

4

2 に答える 2

0

非表示のコントロールに値を保存し、ポストバック時に値を適切なコントロールに戻すことができます。jquery が含まれている場合は、viewstate が有効になっているかどうかに関係なく、ポストバック時に値を忘れることがよくあります。

非表示のフィールド値を使用してデータピッカーの値を準備完了に設定するには、このブログ投稿をご覧ください。

上記のブログ投稿のコードは次のとおりです。

<table>
<tr>
    <td>
        <asp:CheckBox ID="chkEnableMonthlyNotifications" runat ="server" CssClass="cell-Text" Text="Enable monthly notifications." />
        <br/>
    </td>
</tr>
<tr>
    <td>
        <label for="txtMonthStartDate">Specify start date for monthly notification</label>
        <br />
        <br />
        <asp:TextBox ID="txtMonthStartDate" runat="server" Enabled="true"></asp:TextBox>
        <asp:HiddenField ID="hdnMonthStartDate" runat="server" />
    </td>
</tr>
<tr>
    <td>
        <label for="txtMonthEndDate">Specify end date for monthly notification, or leave blank if no end date.</label>
        <br />
        <br />
        <asp:TextBox ID="txtMonthEndDate" runat="server" Enabled="true" > </asp:TextBox>
        <asp:HiddenField ID="hdnMonthEndDate" runat="server" />
    </td>
</tr>
</table>

代替フィールドで Datepicker を初期化する jQuery

$(document).ready(function ()
{
   $("[id$=_txtMonthStartDate]").datepicker({ showOn: 'button', buttonImageOnly: true, buttonImage: '/icon_cal.png', altField: '[id$=_hdnMonthStartDate]' });
   $("[id$=_txtMonthEndDate]").datepicker({ showOn: 'button', buttonImageOnly: true, buttonImage: '/icon_cal.png', altField: '[id$=_hdnMonthEndDate]' });
   $("[id$=_txtQuarterStartDate]").datepicker({ showOn: 'button', buttonImageOnly: true, buttonImage: '/icon_cal.png', altField: '[id$=_hdnQuarterStartDate]' });
   $("[id$=_txtQuarterEndDate]").datepicker({ showOn: 'button', buttonImageOnly: true, buttonImage: '/icon_cal.png', altField: '[id$=_hdnQuarterEndDate]' });
   $("[id$=_txtHalfYearStartDate]").datepicker({ showOn: 'button', buttonImageOnly: true, buttonImage: '/icon_cal.png', altField: '[id$=_hdnHalfYearStartDate]' });
   $("[id$=_txtHalfYearEndDate]").datepicker({ showOn: 'button', buttonImageOnly: true, buttonImage: '/icon_cal.png', altField: '[id$=_hdnHalfYearEndDate]' });
   $("[id$=_txtYearStartDate]").datepicker({ showOn: 'button', buttonImageOnly: true, buttonImage: '/icon_cal.png', altField: '[id$=_hdnYearStartDate]' });
   $("[id$=_txtYearEndDate]").datepicker({ showOn: 'button', buttonImageOnly: true, buttonImage: '/icon_cal.png', altField: '[id$=_hdnYearEndDate]' });
}

document.ready で Datepicker の日付を再度設定する jQuery コード

$(document).ready(function ()
{
  //Initializing the datepicker

  $("[id$=_txtMonthStartDate]").datepicker({ showOn: 'button', buttonImageOnly: true, buttonImage: '/icon_cal.png', altField: '[id$=_hdnMonthStartDate]' });

  //Code to set the datepicker's date again after post back
  if(!($("[id$=_txtMonthStartDate]").attr("Value") == undefined))
  {
    if($("[id$=_txtMonthStartDate]").attr("Value").length > 0)
    {
        $("[id$=_txtMonthStartDate]").datepicker("setDate",new Date($("[id$=_txtMonthStartDate]").val($("[id$=_txtMonthStartDate]").attr("Value"))));
    }
  }
}
于 2013-09-27T11:49:32.510 に答える