I'm trying to build a very specific search page for a project and I'm having lot of trouble dealing with multiple postbacks invoked by dynamically-generated controls on a single page.
The page has to work like this:
There is a single checkbox, "Detailed search", that causes a postback on checking/unchecking.
When detailed search is not active, a simple grid with contents and buttons is displayed. Nothing special.
When detailed search is active, N checkboxes must be generated from some dynamic data, that represent the sections where you want the search to happen. Below the checkboxes, an AJAX-enabled tab control will appear, initially with no tab pages.
When checking one of the section checkboxes, a postback will occur. After the postback, data will be searched in the section selected by the user, then a new tab page containing a grid view of results and the name of the section will be added to the tab control. If the checkbox is unchecked, the tab page will disappear from the control, again, after a postback.
Now, the issue is that pretty much everything has to be generated dynamically, and that pretty much everything is connected to something else.
First issue: dealing with the "Detailed search" checkbox. Sounds easy, doesn't it? My initial idea was to set Page.Viewstate["DetailedSearchEnabled"] to true or false during the check/uncheck event handler, then create controls dynamically checking the value of DetailedSearchEnabled during Page_Load.
Nope. The postback event-handling happens between Page_Load and Page_LoadComplete. It would take an additional refresh for things to work as intended.
<< Then I'll just generate the controls on Page_LoadComplete! >>
Nope. Those controls need event handling as well, and if they're generated after Page_Load they will not be wired up correctly.
A possible solution would be generating everything in advance, on Page_Load, and only hiding/showing controls on Page_LoadComplete. But that is inefficient, and one important point of this search page is that only the minimum amount of controls should be generated.
The difficulty of this task seems to come from the way event wiring and the page life cycle work.
Surely there must be a better way of approaching this problem.
First issue: dealing with the "Detailed search" check box.
The correct approach (if you want to use page post-backs) is as follows:
In the CheckChanged event handler, save the value of the Checked property to ViewState["DetailedSearchEnabled"]. If the value is true, add the dynamic check boxes to the page. If the value is false, find and remove them.
Override LoadViewState. After calling base.LoadViewState, re-create the dynamic check boxes and wire up their events if ViewState["DetailedSearchEnabled"] is true. Note that neither Page_Load nor Page_LoadComplete is the appropriate place to do this.
Yes, you should create the dynamic check boxes at two points in the page life cycle. I recommend a helper method.
In general, your event handlers should add or remove just the dynamic controls (if any) affected by those particular events, but LoadViewState should re-create all dynamic controls that existed from the previous page request. You must store enough information in view state for LoadViewState to do so.
My answer to this other question demonstrates how to add and remove dynamic controls. You may want to use it as a reference.
Sounds to me like you should be using a CheckBoxList control to handle your dynamic checkboxes. You can add an remove items to the CheckBoxList during your post back and not have to worry about dynamically adding/removing actual controls/events to the form.
Here is a link to the msdn:
https://msdn.microsoft.com/en-us/library/14atsyf5(v=vs.85).aspx
Here is some sample code:
Protected void Button1_Click (object sender, System.EventArgs e)
{
CheckBoxList.Items.Add(new ListItem("TextValue1", "Value1"));
CheckBoxList.Items.Add(new ListItem("TextValue2", "Value2"));
}
If all else fails, you could still fall back on the quick-and-dirty old-fashioned ASP way.
Use Response.Write or <%...%> to generate your dynamic controls as plain old HTML (simple form fields, e.g. <input type="checkbox" name="foo" value="1" />).
Make sure you have a form field for every piece of information you may need after the postback(s). If necessary, use hidden form fields to 're-post' values across subsequent postbacks.
After postback, retrieve the values of the controls with the Request object.
Use those values to adjust the generation of controls as you see fit.
You should be able to do all of this in Page_Load. The advantage is total freedom. The disadvantage is total freedom to make a big mess of your aspx. So you may want to migrate all this dirty code out of your aspx, and into a custom-made control, which you can then add to your aspx.
When generating your own HTML, be careful not to introduce XSS vulnerabilities. Use HtmlEncode where necessary.
As you suggested yourself, there is a better way to tackle it.
If I was in the same situation, I would create web methods for interacting with the page, and use client side to do the UI. I'm currently working mostly with angular JS, although it does come with a learning curve. You could use ng-hide/ng-show to bind to the checkbox event to display the detailed search. When the n number of checkboxes needs to be displayed, you can then just fill them in with ng-repeat, for each of the items you need to display, after a check/uncheck you can dynamically populate new controls etc. through web method calls if extra data is needed.
Pure ASP postbacks are quite clunky from my experience, and not really suited for building a maintainable dynamic UI.
Instead of making so many postbacks, it would be better to use jquery and ajax calls to load the controls as needed and then attach events to it or you can even use UpdatePnael for that. Help Links:
https://www.simple-talk.com/dotnet/asp.net/ajax-basics-with-jquery-in-asp.net/
http://encosia.com/using-jquery-to-directly-call-aspnet-ajax-page-methods/
I'm a new to ASP.net. Sorry if this problem is so simple with some people.
In my webpage, main frame includes two smaller frames: leftcol, centercol. In centercol I want to show the news (sort by day, time) loaded from SQL DB. I want the news showing like that:
I really dont know which Control in ASP.net is suitable??? Datalist, Listview???
1.you can try using repeater.
repeater sample
2.Gridview..
Gridview Sample
U can use these two controls to fetch and display data..MOreover you can do paging and sorting based on criteria by defining properties..Apart from this you need to make few styles inorder to have your own look..
this is my second option regarding my first question I did a lot of searching in google and tried it for a couple of times. Do you think its possible to populate a gridview without any postback from a dropdownlist?
Use update panel and script manager. Change properties of update panel Update mod conditional. After you can call when you want "updatepanel.Update()" or select your trigers and it ll do it automaticly.
No. You need postback in some form traditionally or using AJAX. These kinds of things happen in the server and that is why you need postback. Or you can use extensive Javascript.
You can use JavaScript and draw the whole gridview since a gridview is a table with columns and rows.
I have a gridview on my page that gets bound to user search results. There can be many pages upto say 1000. Each page shows 50 records. I have the built in paging turned on for the grid. I want to disable the viewstate on the grid but then I have to bind the results on every page load. (bind twice on paging). The search takes a few seconds and I would not want to store the results in the session. So, how do I achieve turning off the viewstate for the grid or is it okay to have it enabled?
This must be a very common scenario. I hope there is a standard way of doing this.
Depending on how you bind the grid view you should implement server side paging so that your only bringing back the data from the server you need to display for one page.
What data access are you using i.e. are you using linq to sql?
Heres an article on how to do it with ObjectDataSource Custom paging and sorting
Avoid where ever possible putting large amounts of info into view state as it will bloat your page and effect performance.
I am using 1 main update panel which contains Search criteria and a Search button.
In side this main update panel I am using 4 update panels.
These four update panels fetching search results from different 4 SQL quires. Currently I did this.
But my question is, currently the page will come to display after fetching all all 4 update panels.
But I needed, If one panel get full record that one panel will come to display. then next filed panel.... Like this.
Please help me.
If I understand you correctly, you want the inner UpdatePanels to update consecutively when the outer UpdatePanel is updated? If this is correct then by default, all nested UpdatePanels will be updated when the parent UpdatePanel is updated.
It sounds like it would be better to not have the outer UpdatePanel, set a trigger on (inner) UpdatePanel 1 to update when search is clicked, set a trigger on UpdatePanel 2 to update when UpdatePanel 1 updates, etc, etc.
Alternatively, you could implement AJAX calls to Page Methods or Web services to populate the contents of the UpdatePanels and do away with the UpdatePanels instead.
Jason I think you problem may stem from the fact that you have nested your 'SQL' UpdatePanels within the 'Search' Update panel. You may want to separate them and look at AsyncPostBack triggers to get all four to fire once you have entered search critera.
The question is not clear, but you can check the results of the four queries in the Selected event of each of the DataSourceControls you use (I suppose you do), and if you find a record in a set displayed in the previous set, then apply your custom adjustment.
A side question: why using 4 update panels while the whole 5 panels are triggered by the same source (the search button)?