I have a problem with the availability of the values of checkboxes and dropdownlists in my webforms page. I think that there is something obvious that I can't see. There is probably a mistake in my idea so I won't post the whole code for now.
What I want to do:
On my page there is a survey (textboxes, checkboxes and dropdowns) and a scroll fixed panel (it stays at the same position in the browser window when scrolling). Depending on the selections made the fixed panel should show information. This information should update everytime a checkbox is un/checked or a dropdown is selected.
What I have done:
The survey is created programmatically on first page_load and added to a panel (=Panel1). There are two languages so I create the every item of the survey twice and store its panel in the browser session (don't know if thats the right way to achieve this but it seems to work). That means I get the whole English survey from "langPanels["EN"].
Default.aspx.cs:
protected void Page_Load(object sender, EventArgs e) {
if (IsPostBack) {
langPanels = (Dictionary<String,Panel>) HttpContext.Current.Session["panels"];
Panel1.Controls.Clear();
Panel1.Controls.Add(langPanels[SelectLanguage.SelectedValue]);
updateQuestions(); //Survey is evaluated and information is stored in weigthDictionary and blockedResults
ranking.Text = PrintKeysAndValues(weigthDictionary, blockedResults);
}
else {
createLanguageSelectionList(); //Here the dropdown for the different languages is created
createLanguagePanels(); //Here all language surveys are created and stored to the current session
}
}
Default.aspx:
<%# Page Title="Welcome" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="class._Default" %>
<asp:Content ID="BodyContent" ContentPlaceHolderID="BodyContent" runat="server">
<asp:DropDownList ID="SelectLanguage" runat="server" AutoPostBack="true" OnSelectedIndexChanged="SelectLanguage_Change"/><br />
<asp:Panel ID="Panel1" runat="server"/>
</asp:Content>
[EDIT1:]
Creating of the checkboxes (this.panel is afterwards added to langPanels. Method is called whithin createLanguagePanels):
[/EDIT]
private void asp_createCheckboxQuestion(String question, String questionID, String[] checkboxes, String[] answerIDs) {
Label questionLabel = new Label();
questionLabel.Text = question;
this.panel.Controls.Add(questionLabel);
this.panel.Controls.Add(new LiteralControl("<br />"));
CheckBoxList checkBoxList = new CheckBoxList();
checkBoxList.ID = questionID;
checkBoxList.AutoPostBack = true;
checkBoxList.CellPadding = 5;
checkBoxList.CellSpacing = 5;
checkBoxList.RepeatColumns = 1;
checkBoxList.RepeatDirection = RepeatDirection.Vertical;
checkBoxList.RepeatLayout = RepeatLayout.Table;
checkBoxList.TextAlign = TextAlign.Right;
checkBoxList.EnableViewState = true;
for (int i = 0; i < checkboxes.Length; i++) {
ListItem item = new ListItem();
item.Text = checkboxes[i];
item.Value = answerIDs[i];
checkBoxList.Items.Add(item);
}
this.panel.Controls.Add(checkBoxList);
this.panel.Controls.Add(new LiteralControl("<br />"));
}
Everything works fine except that the information in the fixed panel only is available after I clicked a second checkbox. For example there are 3 checkboxes. The first is clicked and nothing happens in the fixed panel. The second one is clicked and the panel shows information for the first checkbox. The third one is clicked and the panel shows information for first and second checkbox. [EDIT2:] Although their checked states persists through the autoPostBack.[/EDIT]
Ok I found my mistake:
The problem was that I chose the detour through the browser session. That way the values of the survey were only known after a second postback. I solved it by creating the survey everytime a postback is executed:
if (IsPostBack) {
Panel p = createLanguagePanels();
Panel1.Controls.Clear();
Panel1.Controls.Add(p);
}
else {
createLanguageSelectionList();
Panel p = createLanguagePanels();
Panel1.Controls.Clear();
Panel1.Controls.Add(p);
}
I don't know why the selected values are still be selected after postback (they are newly created each time!?), but they do. I know this is an awful solution so if there are better ways of doing this I will appreciate knowing about them!
Related
Do web controls ever appear like you are changing their values but actually retain the previous value?
I created a pop-up modal for users to edit an item. When the user clicks edit on an item on the main page, the following sequence happens:
The item's ID is passed to the Page_Load event of the modal page, and is used to populate the page control's with the item's data.
The user changes a value in a control. Ex: Changes text in a TextBox contol.
The user clicks save, triggering the Click event which creates a DataTransferObject with the values in the textboxes, which will be stored.
However, on step 3, the control's new value (TextBox.Text) still holds the value that it orginially had, not the value the user put in.
Add.aspx:
<%# MasterType VirtualPath="../MasterPages/Popup.Master" %>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<asp:TextBox ID="TextBoxDescription" runat="server"></asp:TextBox>
<telerik:RadButton ID="btnSave" runat="server" Text="Save" OnClick="btnSave_Click"/>
</asp:Content>
Add.aspx.cs
//Cannot access the new values here
protected void btnSave_Click(object sender, EventArgs e)
{
//This will print the new text on Create, but the old text on Edit
System.Diagnostics.Debug.WriteLine(TextBoxDescription.Text);
}
//works properly
protected void Page_Load(object sender, EventArgs e)
{
objIDParam = Convert.ToInt64(Request.QueryString["ObjectID"]);
editMode = (objIDParam != 0) ? true : false;
if(editMode)
PopulateFields(objID);
}
//works properly
private void PopulateFields(long objID)
{
MyObject obj = GetObjectByID(objID);
TextBoxDescription.Text = obj.Description;
}
It is worth noting that this popup page is used for both creating items AND editing items. Create works fine (i.e. The item isn't saved with all blanks, but rather the user input). Editing an item will properly pull all that data back in, and let the user edit the fields, however I can't access the changed values in my code.
You need to check for IsPostBack in the Page_Load method.
The Page_Load gets called before the btnSave_Click method, so the TextBoxDescription.Text is getting reset to obj.Description before the btn_Save method runs.
Try returning out of Page_Load if you're posting back:
protected void Page_Load(object sender, EventArgs e)
{
if (IsPostBack)
return;
objIDParam = Convert.ToInt64(Request.QueryString["ObjectID"]);
editMode = (objIDParam != 0) ? true : false;
if(editMode)
PopulateFields(objID);
}
Have a look at ASP.NET Page Life Cycle Overview for more info.
I have a problem that I believe is a session state issue, but I'm at a loss to figure out what's wrong. I have a sample project to illustrate the problem. (Code below) I have 2 buttons. Each populates a List with some unique data and then uses that data to add a row to a table. The row contains text boxes so that the user can edit the data. (For my sample, there's no update button to persist the data.) To reproduce the problem in VS2010, create a new "ASP.NET Web Application" project and copy/paste the aspx code and the c# code-behind into Default.aspx, then run the application.
Press the DataSet 1 button and the grid should populate with 1 row.
Edit the data in one of the text boxes and tab off of the text box. (The newly entered text should remian, and the font should be blue. This is what I want to happen.)
Now click either of the DataSet buttons to reset the List and refresh the table.
Edit the data in one of the text boxes and tab off the text box. (Immediately, the text in the box refreshes back to its original value. This only happens once, though. If you edit either text box now, it will work normally.)
This is repeatable... the first edit after pressing the DataSet buttons a 2nd, 3rd, etc. time gets reset back to the original value. And I can't figure out why.
<%# Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
CodeBehind="Default.aspx.cs" Inherits="DebugPostbackIssue._Default" %>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<h2>
Welcome to ASP.NET!
</h2>
<p>
Populate the table with DataSet #1:<asp:Button runat="server" ID="btnDS1" Text="Dataset 1" OnClick="btnDS1_Click" />
</p>
<p>
Populate the table with DataSet #2:<asp:Button runat="server" ID="btnDS2" Text="Dataset 2" OnClick="btnDS2_Click" />
</p>
<p>
<asp:Table runat="server" ID="tblData">
<asp:TableHeaderRow runat="server" ID="thrData">
<asp:TableHeaderCell Scope="Column" Text="Column 1"></asp:TableHeaderCell>
<asp:TableHeaderCell Scope="Column" Text="Column 2"></asp:TableHeaderCell>
</asp:TableHeaderRow>
</asp:Table>
</p>
</asp:Content>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace DebugPostbackIssue
{
public partial class _Default : System.Web.UI.Page
{
private List<string> _MyData = new List<string>();
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Page_Init(object sender, EventArgs e)
{
LoadSessionData();
GenerateGrid(false);
}
protected void btnDS1_Click(object sender, EventArgs e)
{
_MyData = new List<string>();
_MyData.Add("111");
_MyData.Add("aaa");
SaveSessionData();
GenerateGrid(true);
}
protected void btnDS2_Click(object sender, EventArgs e)
{
_MyData = new List<string>();
_MyData.Add("222");
_MyData.Add("bbb");
SaveSessionData();
GenerateGrid(true);
}
private void SaveSessionData()
{
Session["MyData"] = _MyData;
}
private void LoadSessionData()
{
if (Session["MyData"] != null)
_MyData = (List<string>)Session["MyData"];
else
_MyData = new List<string>();
}
private void GenerateGrid(bool ClearData)
{
if (ClearData)
while (tblData.Rows.Count > 1)
tblData.Rows.Remove(tblData.Rows[tblData.Rows.Count - 1]);
TableRow tr = new TableRow();
foreach (string s in _MyData)
{
TableCell tc = new TableCell();
TextBox txtBox = new TextBox();
txtBox.Text = s;
txtBox.Attributes.Add("OriginalValue", s);
txtBox.TextChanged += new EventHandler(txtBox_TextChanged);
txtBox.AutoPostBack = true;
tc.Controls.Add(txtBox);
tr.Cells.Add(tc);
}
if (tr.Cells.Count > 0)
tblData.Rows.Add(tr);
}
void txtBox_TextChanged(object sender, EventArgs e)
{
TextBox Sender = (TextBox)sender;
if (Sender.Text == Sender.Attributes["OriginalValue"])
Sender.ForeColor = System.Drawing.Color.Black;
else
Sender.ForeColor = System.Drawing.Color.Blue;
}
}
}
Hi I took some time off of my work to compile your code, and I figured it out, just change your textbox change to the following :
void txtBox_TextChanged(object sender, EventArgs e)
{
TextBox Sender = (TextBox)sender;
if (Sender.Text == Sender.Attributes["OriginalValue"])
Sender.ForeColor = System.Drawing.Color.Black;
else
{
Sender.ForeColor = System.Drawing.Color.Blue;
if (Session["MyData"] != null)
{
List<string> _ss = (List<string>)Session["MyData"];
//_ss.Find(a => a == Sender.Attributes["OriginalValue"]);
_ss.Remove(Sender.Attributes["OriginalValue"]);
_ss.Add(Sender.Text);
}
}
}
ur welcome!
Try creating a datatable. I would, on "event" copy your asp table content to a datatable, then when you get the servers response add that to the datatable. Then copy the datatable back to your asp table, and repeat... Datatables can be used like variables.
Or try using a cookie.
Try changing...
protected void Page_Init(object sender, EventArgs e)
{
LoadSessionData();
GenerateGrid(false);
}
To...
protected override void OnLoadComplete(EventArgs e)
{
LoadSessionData();
GenerateGrid(false);
}
Based on your description I believe that your value is getting reset because of how the page life cycle works in ASP.NET & that is the page_init is getting called before your event due to ASP.NET quirkiness. Above code is how I work around it, I'm sure there's other ways too.
Okay, I have it working, now. Wizpert's answer pointed me in the right direction... Upon discovering that the TextChanged event did not fire during the times when the value was erroneously being reset to the original value, it occurred to me that during the Click events I was calling GenerateGrid(true). This forced the removal of the existing rows and the addition of new rows. (Removing & adding the dynamic controls at that point in the life cycle must be interfering with the TextChange event handler.) Since the Click event fires after Page Init and after Page Load, the state values were already written to the text boxes and I was overwriting them. But the 2nd text box edit did not force GenerateGrid(true) to be called so the state values were not overwritten any more.
If this sounds confusing, I apologize. I'm still wrapping my head around this. But suffice to say that I had to change my GenerateGrid method to reuse any existing rows and not delete them. (If they don't exist, like when GenerateGrid is called from Page Init, then they are added.) So this was a page lifecycle issue after all.
Thank you.
I have a GridView with PageSize = 20 (20 rows) but it can show only 10 rows without a vertical scrollbar appearing.
My problem is that when a postback occurs, it jumps to top row of the grid even though I selected a different row. I would like to scroll to the selected row. How can I do this?
Add MaintainScrollPositionOnPostback in your page directive.
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" MaintainScrollPositionOnPostback ="true"%>
Another way, use a scrollTop method of the DIV that wraps your GridView:
private void ScrollGrid()
{
int intScrollTo = this.gridView.SelectedIndex * (int)this.gridView.RowStyle.Height.Value;
string strScript = string.Empty;
strScript += "var gridView = document.getElementById('" + this.gridView.ClientID + "');\n";
strScript += "if (gridView != null && gridView.parentElement != null && gridView.parentElement.parentElement != null)\n";
strScript += " gridView.parentElement.parentElement.scrollTop = " + intScrollTo + ";\n";
ScriptManager.RegisterClientScriptBlock(this.Page, this.GetType(), "ScrollGrid", strScript, true);
}
EDIT:
This won't work for several reasons:
1) if the gridView is inside a NamingContainer control, like a Panel, because the Id on the client side won't be the ClientId. You need to use the UniqueId of teh control instead.
2) you can't trust the row height to calculate the scroll position. If the text in any column wraps to more than one line, or any row contains something higher than the style, the size of the row will be different
3) different browsers can have different behaviors. You're better of using jQuery scrollTop() and scroll() functions. To use them, you must use scrollTop on client side and set the value of a HiddenControl that can be read on server side to reset the position. You can't get the height of the rows in the browser until they are rendered on client side.
This code in the RowDataBound event handler for the gridview worked for me:
protected void dgv_usersRowDatabound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowIndex == intEditIndex)
{
DropDownList drpCategory = e.Row.FindControl("drpCategory") as DropDownList;
drpCategory.Focus();
}
}
The Gridview contains a dropdownlist in each row as an EditItemTemplate.
This worked for me, and required no ASP.NET AJAX, UpdatePanel or cookie, and a lot less JavaScript than other solutions I've seen.
<input type="hidden" runat="server" id="hdnScroll" value="0" />
<div style="height:600px; overflow-x:hidden; overflow-y:scroll">
<asp:GridView runat="server" ID="myGridView" OnRowDataBound="myGridView_RowDataBound" OnSelectedIndexChanged="myGridView_SelectedIndexChanged">
...
</asp:GridView>
</div>
Then
protected void myGridView_SelectedIndexChanged(object sender, EventArgs e) {
//if(gr != null) gr.SelectedRow.Cells[0].Focus(); // Only works on an editable cell
hdnScroll.Value = (myGridView.SelectedIndex * (int)myGridView.RowStyle.Height.Value).ToString();
}
Finally back in the .aspx, to run upon postback
<script type="text/javascript">
$(function() {
document.getElementById('<%=myGridView.ClientID%>').scrollTop = $('#hdnScroll').val();
});
I am creating a custom view in a SharePoint visual Web Part using ASP.NET (Visual C#) and have a CheckBoxList, and a button.
MarkUp for the List & Button:
<td>
<asp:checkboxlist ID="cblYearLst" runat="server" EnableViewState="true" />
</td>
<td>
<asp:Button ID="btnRefineSearch" Text="Refine Search" runat="server" />
</td>
I add items to the CheckBoxList on PreRender:
if (!IsPostBack)
{
if (LstYears != null)
{
for (int i = 0; i < LstYears.Count(); i++)
{
cblYearLst.Items.Add(new ListItem(LstYears[i], LstYears[i]));
}
}
}
And I call the event Handler for the button on Page_Load:
btnRefineSearch.Click += new EventHandler(this.btnRefineSearch_Click);
All of the CheckBox list-items do not stay selected after the button is clicked. I can retrieve the selected values, but they won't display as selected. When I add the Click event handler for the button in the pre-render event, the data is displayed appropriately but the selected values can no longer be retrieved by my Click event.
Any ideas on what might be causing this behaviour??
Did you try moving the binding of the checkboxlist into the page_load instead of pre_render? Just an idea because it seems like the page is losing selections on postback and you are regenerating the options each time.
UPDATE: I created a quick page and this works correctly. Do you have your viewstate turned off for the entire page in your page directive, or possibly in the web.config? I see you have it enabled on the checkboxlist but maybe there is a global setting throwing you off.
protected void Page_Load(object sender, EventArgs e)
{
btnRefineSearch.Click += new EventHandler(this.btnRefineSearch_Click);
List<string> LstYears = new List<string>();
LstYears.Add("one");
LstYears.Add("two");
LstYears.Add("three");
LstYears.Add("four");
if (!IsPostBack)
{
if (LstYears != null)
{
for (int i = 0; i < LstYears.Count; i++)
{
cblYearLst.Items.Add(new ListItem(LstYears[i], LstYears[i]));
}
}
}
}
private void btnRefineSearch_Click(object sender, EventArgs args)
{
Response.Write(cblYearLst.SelectedValue);
}
I figured out the issue, since I have AutoEventWireUp set to true as Keenan has suggested it should all work if I do it in the page_load.
The problem was that Page_Load was being called twice, and I discovered that this was because I was redirecting the user to the same URL with QueryString parameters. After I made the much needed changes, my code works very well.
+1 Keenan for your help and thank you (#jfmags) for tipping me off by telling me you think it is something else.
:D
Background
I have a User Control (an .ascx file) which is being dynamically inserting into an asp:PlaceHolder control on a page. That User Control contains an asp:Repeater, which I'm binding to a DataTable.
Theoretically, on the User Control's first load the DataTable is initialized and 3 empty rows are added. A button on the User Control adds additional empty rows to the Repeater, one at a time.
Problem
The issue is that after any PostBack event on the page (namely the button in this example being clicked), the DataTable for the Repeater is empty.
User Control (.ascx)
(simplified)
<asp:TextBox ID="controlOutsideRepeater" runat="server" />
<asp:Repeater ID="myRepeater" runat="server">
<ItemTemplate>
<p><asp:Textbox ID="firstControlInRepeater" runat="server" text='<%# DataBinder.Eval(Container.DataItem, "A") %>' /></p>
<p><asp:Textbox ID="secondControlInRepeater" runat="server" text='<%# DataBinder.Eval(Container.DataItem, "B") %>' /></p>
</ItemTemplate>
</asp:Repeater>
<asp:LinkButton ID="addItemButton" runat="server" Text="Add Item" onclick="addNewItem" />
Code Behind (.ascx.cs)
(also simplified)
public DataTable items {
get {
object i = ViewState["items"];
if (i == null) {
DataTable t = new DataTable();
t.Columns.Add("A");
t.Columns.Add("B");
// add 3 blank items/rows:
t.Rows.Add(t.NewRow());
t.Rows.Add(t.NewRow());
t.Rows.Add(t.NewRow());
ViewState["items"] = t;
return t;
} else {
return (DataTable)i;
}
set { ViewState["items"] = value; }
}
protected void Page_Init(object sender, EventArgs e) {
myRepeater.DataSource = this.items;
myRepeater.DataBind();
}
public void addNewItem(object sender, EventArgs e) {
DataRow r = this.items.NewRow();
this.items.Rows.Add(r);
myRepeater.DataBind();
}
Behavior
The first time the UserControl is loaded, the Repeater contains 3 empty items: good! However, after entering some text in the textboxes both inside and outside the repeater and clicking the "Add Item" LinkButton, the page does a refresh/postback and shows 4 empty items, however the textbox -outside- the Repeater retains it's text. Clicking the "Add Item" LinkButton again also performs a postback and still shows 4 empty items, yet the TextBox outside the Repeater again retains it's text.
My Crazy Guess
I've tried wrapping the Repeater databinding in a (!Page.IsPostBack), but this prevented the Repeater from -ever- being bound, as the UserControl is only programmatically added to the page after a PostBack (a button on the Page adds the UserControl on a click, and then the Page checks each PostBack to see if there should be a user control present and re-adds it to the Page if needed). So I'm guessing there's a problem with the Page re-creating the User Control on every PostBack, but can't explain why the TextBox outside the Repeater would retain it's value, and why the ViewState doesn't seem to remember my item (on each postback ViewState["items"] is null and gets re-built within the getter).
HELP!
The problem is you are data binding every single request when really you only want to data bind on the first request. Since you don't data bind on the first page load, you will have to check if you are data bound in a way other than !Page.IsPostBack. You could add a property to your user control to handle this and then check against that every page load / page init.
Update: With more details from comments
I see your AddItem() now. I've had problems using viewstate this way though I'm not entirely sure why. I've had to do it more like the following:
public void addNewItem(object sender, EventArgs e) {
DataTable theItems = this.items;
DataRow r = theItems.NewRow()
theItems.Rows.Add(r);
this.items = theItems
myRepeater.DataBind(); //I'm not sure if this belongs here because of the reasons said before
}