UI to add list of objects in ASP.NET web forms

Question

I am using ASP.NET Web Forms, and I have a problem with how to handle the state.

I am adding a new product, and the product has different variations. Each variation has several unique characteristics, for instance: Price, purchase price, variation_type, variation_value.

In the UI, I want to be able to add a list of variations. When I've added X variations and other info about the product, I want to submit the whole form and then start doing the adding-to-database part.

Explained with an image:

Ok, now with an image. A user adds a new name for the variation, clicks "Add" and then it's added to the current variations ListBox control. When clicking a variation in the "Current variations", i can fill out the information about the variation, and save it.

When I am done with all the variations, I can submit the form.

enter image description here

Now, my problem

If I use AutoPostBack of the Current variations and it makes a postback, everything is forgotten because of the state. Using standard ASP.NET web forms, I can't find a way to store these lists.

What I really need, would be the ListBox from Windows Forms which contains objects. But good luck with a stateless web ;-)

Solutions I could think off

At every click, changes are saved into a temporary session which is used when submitting the form
At every click, I could save stuff into the database temporarily

A kind of solution I would like to have

A great solution would be some jQuery magic, where I dynamically can create all the rows I need without a postback. Then when I am done, I could iterate all the controls, and store it in the database.

I guess this is a normal issue, and someone can send a link to something obvious, or maybe show me how easy it is to fix it! :-)

Oh yeah, and one last thing, don't send me to hell because I still have projects in Web Forms.

You've pretty much listed your options - Session, or Database. I don't think a client-side solution will cut it here because of your complexities - you need to save information about each variation, which can happen upon addition. That's not impossible to do with Javascript/jQuery, but it could get involved and I'd think you'd want to look into more libraries (for databinding, etc) for a robust solution. (You'd also have to pull Javascript objects into your server code. Maybe JSON?) Your final option would be .NET MVC. :P — user677526
– user677526, Commented Mar 25, 2013 at 17:11
Don't worry about going to hell because of Web Forms. Its been around for more than 10 years.. its very mature. Don't let anyone tell you otherwise — Jeff Fritz
– Jeff Fritz, Commented Mar 25, 2013 at 18:20

Jeff Fritz · Accepted Answer · 2013-03-25 18:19:36Z

1

This is most certainly a place where I feel that ViewState should be used. Ordinarily, I argue against using ViewState in Web Forms. However, you are in such a place where this 'stateful' operation is necessary.

With an ASPX that contains form elements like this:

  New Variation:
  <asp:TextBox runat="server" ID="newName"></asp:TextBox>
  <br />
  <asp:Button runat="server" ID="addName" Text="Add Variant" OnClick="addName_Click" />

  <br />
  <br />
  Current Variations:<br />
  <asp:ListBox runat="server" ID="listOfVariations" Width="200px" 
       AutoPostBack="true" 
       OnSelectedIndexChanged="listOfVariations_SelectedIndexChanged">
  </asp:ListBox>
  <br />
  Feature 1:<br />
  <asp:TextBox runat="server" ID="feature"></asp:TextBox>
  <br />
  <asp:Button runat="server" ID="submit" Text="Add Variation" />

You can write a code-behind then that moves the data into ViewState to be remembered between page loads:

    protected void addName_Click(object sender, EventArgs e)
    {
    listOfVariations.Items.Add(newName.Text);
    ViewState.Add("item_" + newName.Text, new VariantObject{ Name = newName.Text });
    newName.Text = "";

    }

  [Serializable]
  public class VariantObject
  {

    public string Name { get; set; }
    public string Feature1 { get; set; }

  }

  protected void listOfVariations_SelectedIndexChanged(object sender, EventArgs e)
  {

    var v = ViewState["item_" + listOfVariations.SelectedValue] as VariantObject;
    feature.Text = v.Feature1 ?? "";

  }

edited Mar 25, 2013 at 18:19

answered Mar 25, 2013 at 17:27

Jeff Fritz

9,8817 gold badges45 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Lars Holdgaard Over a year ago

And thanks how I ended up implementing it. Thanks a lot for your effort - means a lot :-)

Collectives™ on Stack Overflow

UI to add list of objects in ASP.NET web forms

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related