Creating dynamic UI in ASP.NET web forms - c#

I need to create a survey page with the following structure read from database.
Survey QuestionA
a) Answer1 [Radio button]
b) Answer2 [Radio button]
c) Answer3 [Radio button]
d) Answer4 [Radio button]
repeats..
The page has many questions that needs to be dynamically added. I need to store the result of the form on in an array of Question object on submit.
One way I know to do this is create dynamic UI in a table and get the values by FindControl.
Is there a better (elegant) way to do this?

In ASP.Net MVC it handles the dirty work for you with default model binders. Of course you can also create your own. Though this does not give you the automatic solution you were hoping for in ASP.Net Web Forms, my preference in this situation would be to follow a similar common pattern that ASP.Net MVC is using for it's naming convention thus simplifying it. You could then start writing code that could be reused over time. Here is a link to an article explaining the naming convention on Haack's blog
http://haacked.com/archive/2008/10/23/model-binding-to-a-list.aspx.
Long term recommendation is to come to ASP.Net MVC, life is just better here :)

I suggest create a userconrol that implement a question(label) and answers(radio buttons) and each controls(labels,radios) is binded to a property of your usercontrol, Then you can read questions from database and for each data create this usercontrol object and set correspond data to that property of usercontrol, And to read data from control this state doing vice versa.
Albeit you must recreate usercontrols in each post back and set default data to those.
Also you can create multiple usercontrols with different UI that inherit a interface such as IQuestion, and a factory class that create each of usercontrols depend of environment varibles.

You can use jQuery to get the selected radio buttons by the checked property and append them with the question number.
e.g. for question 1 you have
So you can get the values iterating throught the radio buttons like so:
$("input[type='radio']").checked

You could always add the controls in programmatically.
Say you have a aspnet Panel control you can perform...
RadioButton rb = new RadioButton();
rb.ID = "rbRadioButton";
rb.Name = "rbRadioButton";
rb.cssClass = "radioClass";
Panel1.Controls.Add(rb);
Excuse the harshness of the example, not got visual studio to hand at the moment to check it but I hope you get the idea. You could in essence build up the whole question this way based purely on the database. The downside is getting the values as you have to override the Render method (if I remember right, it has been a while, I do have an example if you want me to find it).
I admit it is a little overkill but it is a possible solution.

use radiobuttonlist (which you can see in the the toolbox ,it is a asp.net standard control) control for this purpose. It is up to your needs.

Related

Avoiding making duplicate panels of controls?

I'm making a web application, but I am not using MVC.
I have pages like: create a task, create a project, create a case...
Everyone of these requests standard information like: StartDate ( a calendar widget, etc), Start time, etc.
If, somewhere down the line, I need to change this standard stuff, say, I need to change the calendar for a textbox, I want it to change everwhere where this is used.
What is a proper way to do this sort of thing?
In the ASP .NET code it would be nice to have like:
SchedulePanel.Calendar.Date;
It does not have to be panel based or anything, but I basically have a group of controls that I need in many places.
Thanks
You can put all of those controls into a UserControl and add that whenever it is needed. Like Robert said, if it is needed on virtually every page, then put those controls into the master page.
asp.net UserControls are really idea for this type of situation.
http://asp.net-tutorials.com/user-controls/using/
Please explain more this statement:I want it to change everwhere where this is used.
If I undesrstand correctly you can put all your controls in a User Control and in code behind declare public variable and change your controls in set section

How do I pass values from a database between pages in WPF?

I created an application that connects to an SDF database. The user is given a list of movies in a cinema. The user can select a movie and press an 'ok' button.
The user should then be presented with another datagrid which contains all the information of that movie.
I've tried passing the SelectedIndex between the two pages, it sends the SelectedIndex to the information page, but it won't assign it to the same SelectedIndex.
public Desc(int input_id)
{
InitializeComponent();
cinemaEntities = new cinema1.cinemaDBEntities();
movieViewSource = ((System.Windows.Data.CollectionViewSource)(this.FindResource("moviesViewSource")));
System.Data.Objects.ObjectQuery<cinema1.movie> moviesQuery = this.GetMovieQuery(cinemaEntities);
movieViewSource.Source = moviesQuery.Execute(System.Data.Objects.MergeOption.OverwriteChanges);
moviesListView.SelectedIndex = id;
What to do depends on the purpose of the software, but in any case I would recommend to spend a little more effort on the architecture of your software. As you want to use WPF, you should decide whether to go for a MVVM (Model-View-ViewModel) approach which is highly maintainable and has numerous advantages, but demands some time to get familiar with. The quick solution which is absoulutely fine for small or simple apllications is to code your GUI logic in the codebehind of your views and controls.
Anyway, I would create a model layer which mirrors your database data in according types (MovieDatabase has a Collection of Movies, etc. etc.). Then write an adapter to fill the model from the database.Then either use the model in your views - if you want to do it quickly - or write ViewModels to your Models (which is better) and use those in your views.
This being said, from the code you posted its hard to tell, what the problem is. Do you have a little bit more context? Why don't you pass the SelectedItem?
Why not just pass the Movie object to the second page? And then use .SelectedItem. Why does the second page need the whole list anyway if it is detail for just one movie?

Dynamically add textbox in asp.net

In my page, i got two column and multiple rows. The first column contain the label such as question for the 1st row, and the options for the questions. And the second column is the textboxes. When i click on add button, i wish to add those controls to page which subsequently allowed me to add the value in the texbox to database. I did some research but most of them uses javascript or datatable. Is there any other method?
You don't specifically say what type of .net development you are doing, and your question is tagged with asp-classic, which I doubt you're using. [If you are please please stop] So I will assume you are using Web Forms.
While I don't agree with Inerdial's position that you should avoid dynamic controls at all costs, I will say it does make things much more complex and requires a very good knowledge of the ASP.net Lifecycle. If you truly want to go down that path, here is a great resource.
With that said what you are describing to me does not appear to need that and his suggestion of setting the control visibility to false is a good one.
You could create a row, a panel or a div and output the controls that you need when adding a new row and set it's server-side visibility to false whenever you don't want it displayed. Then you could have a link that when clicked it toggles the visibility to true and will allow the user to add items. Once users add items they'll be displayed in your data table and you can reuse the form to add additional items.
I would also like to encourage you to consider JavaScript if it isn't an overly complex form. It eliminates an extra round-trip to your server and in general is a better user experience.
Edit: This link may also be of use to you.

should I send win form control as parameter?

A winform forms.cs contains a gridview. This gridview(many columns) get populated with an xml elements and its attributes.
Another class "XMLReader.cs" that reads XML file and returns
List <someclassObjects>
Now I am sending gridview as a parameter from form.cs to another class "UpdateAppUI.cs" that receives the Gridview as parameter and update it.
Question is: Is there any issues with passing controls as parameter? Experienced professionals said donnnn't pass controls.
Then How I can access form controls to other classes?
What is the solution for above situation?
why you want to pass the grid view?
If simply you want to update it in UpdateAppUI.cs file then pass the datafrom gridview in the datatable. And from datatable you can update the database from the class.
No need to pass the control.
If you really want to pass the datagrid then create new object of datagrid as same as yours and pass that as an parameter.
I think that what those developers are refering to is: avoid making your UI unrepsonsive. You might want to look at your design ( read: conceptual model / design diagram ) before your deside how to implement this functionality.
There's an article on MSDN covering "Give .NET Apps a Fast and Responsive UI with Multiple Threads".
Consider this, if you have a Parent form that needs to update its child controls you might want to make the whole form accessable by the "update helper". But then again, try not to make to much heavy lifting on the UI Thread.
Also remember that your controls are Objects and when Objects are passed as parameters they are sent as reference types so another "danger" is that your method might do something malicious to your control.
To make the design understandable and manageable by others as well, I would step back one step and think about the design of your software.

Filtering Pane, ASP MVC 3

My plan is to create a a two-pane page using ASP MVC 3. The left pane should be a small filter pane and the right the main content, showing a list of objects (say products).
Initially all products will be shown since no filter is applied. When selecting "only red", only red products are shown in the list. When further selecting a price range, only products in that price range will be shown.
Functionally the plan is to implement the filtering pane as a treeview with checkboxes (to be able to drill down to more and more specific filtering options), graphically it will probably be enhanced in some way to improve usability.
What is the best way to implement the coupling between the filter pane and the main list? Everything should work server side, but should of course use javascript (jQuery) when possible for direct feedback.
The simplest way is probably to make it closely coupled solution, calling a specific Asp MVC action using a custom-built javascript (with fallback to a form post). Doable enough, sure, but how to make the solution reusable? Also it would be nice to not loose all filtering data when navigating forward and back, i suppose GET arguments is the only decent way to do that?
Are there any best practices, any guidelines or anything to base this on to make a nice modular structure for filtering.
Victor, I recently had to solved this same problem. I'm not promising it's the best way but it's pretty clear and should even work well in case JavaScript is disabled (who even does that anymore?).
Create a that calls the action with all the field-selectable search options like "only red".
To that same form, add empty, hidden value for the things not directly as fields (paging, sorting...)
Setup your form with the excellent and very easy to use JQuery.Forms (http://www.malsup.com/jquery/form/) to make you form submit via JQuery (all your form values will be passed as JSON on form submit).
Make your back/next/paging/sorting links pass their individual values via query (no-JS fallback) and use JQuery to capture their click events. The JQuery click events on those links should assign the value of the value passed by the link (page number, sort column name...) to the corresponding hidden field in the form and call submit (with thanks to Jquery.Forms will submit via AJAX).
When you configure JQuery.Forms, you can define a callback method. In the callback method take the result (the HTML returned by your action that should contained your filtered+sorted+paged result) and replace the document (or DIV if you used a partial action + view) with that.
The result is a JQuery solution that works when JS is off. You also have very minimal JS code to write other than wiring the event handlers.
I'm not sure if it will be helpful but in MVC 3 you have access to a property called IsAjax from the view so you can do specific things to server a slightly different view when called from AJAX.
Cheers

Categories