ASP.Net Tab Control: Load Content on Click via Separate ASPX Files - asp.net

I'm looking for a way to use a tab control such that there is a single TabPanel, and when a tab is clicked the TabPanel is populated from a separate ASPX file. If I have three tabs, then tab1.aspx is used for content when tab one is selected, tab2.aspx is used for content when tab two is selected, and so on.
I've found a number of tutorials on cramming everything into a single page. I've also read How To: Make Tab control panels load "on-demand" (which uses hidden controls). But I have not come across loading a partial view via a link or postback.
Would anyone know of a link to an ASP.Net video or well explained tutorial/blog?
Jeff

I'm not sure that it is possible.
But I suggest that you combine all of your aspx files in one (you can place each file in PlaceHolder or Panel) and then make them visible when you need it.

You can use IFRAME for different page content load.
On press Tab1 you have to load Tab1.aspx. For that you have to IFrame to Load Content. If your Content is static then you can get content by System.IO.ReadFile(); and if you have dynamic content then you can use Iframe or User Control to load.
You can also Implement the Multiview to approach your way and put it in Update panel and design the multiview as TAB panel.

Related

How to load aspx inside content or update panel

Sorry for this pretty simple question: I have a Master Page with a menu located at left, and an update panel inside a ContentPlaceHolder located at right.
When I click a menu item, and use NavigateUrl property, it loades a page in the whole browser screen. How can I make it loades inside a certain region, in this case the update panel?
Thanks in advance
The quick and dirty answer is to use an iframe.
I personally am not a big fan of iframes and would recommend that if you are truly looking for a "load in place" type solution that you research a more client-side solution than ASP.NET WebForms using UpdatePanels, such as jQuery/AJAX/Templating, KnockoutJS, BackboneJS, AngularJS or Ember.js.
As a different option you can convert the aspx page into a UserControl. Then you can load the UserControl in the update panel.
If you also want to have an aspx page you can create a different aspx page that contains that same UserControl.

Dynamically add web user controls

I am pretty new to ASP.NET programming. Now I try to add several web user controls to my page dependent on checked boxes in a tree view that I create from data of my database.
I was thinking about using iframes - one for the tree view and the other one for the controls, but this seems quite complicated. Is there an easier way to do this?
The tree view should always remain on the page an the web user controls should appear or disappear in a scrollable part of the page. Could you tell me what would be good practice to resolve this issue?
iframes would not be the easiest way to go about this (as you have two different server side pages that cannot communicate with each other).
If the number of controls that you are controlling visibilty for is not large, I would suggest that you have your user controls in a panel on the page, all invisible, and the treeview and this panel all on the page, within an update panel.
On check of the treeview, in the partial postback, show/hide the appropriate web user control.
As noted above, dynamically adding controls is problematic, as they have to be re-added every postback and you run into state issues.
Dynamic controls added to the page need to be added back to the page on every postback. I would not use iframes for this; instead, you can have the tree view on the left in a floating div, and another floating div for the right content. If the right content is always checkboxes, use a ListView, Repeater, or some other data bound control that builds the control tree for you. It's much easier to work with these controls as long as the UI is consistent. If not, you can build the right side dynamically. You'd have to readd the checkboxes to the page on all future postbacks.

.net page design with complicated Ajax relationship

I am creating a .net website in c#.
The master page contains a fixed footer bar from which you can display 'bookmarks'. I also have a remove function for each bookmark.
Some aspx pages may have a add bookmark/remove bookmark function (a button control) on them.
I use update panels throughout so button controls are always encapsulated by one.
If I add/remove a bookmark from an aspx page, I can trigger an update to the fixed footer panel. A delegate event is triggered in the aspx page which calls a method on the master page to update the fixed footer panel, so everything is sync'd dynamically.
It doesn't seem possible to do the same the other way around. If i remove a bookmark from the fixed footer, I would need to know if the current aspx page was displaying a bookmark control. Pretty much impossible I would have thought, but I'm open to suggestions.
With that in mind the question really is does anyone have a technique that they use to deal with these scenarios, such as calling a full page update or something similar, or is it a case of doing nothing until the next page load/postback?
Thanks in advance.

Collapsible panel inside GridView

I'm developing an ASP.NET 3.5 web application using C# with AjaxToolkKit. I have a following question.
How can I put a collapsible panel inside GridView to make a master and detail list that expands to display the detail panel when view link in a row is clicked? This is something similar to the download list in MSDN page.
Thanks
Implement jQuery on the page. Have a look at the ajax methods, specifically in your case the load method. Show the master record on the page, along with a hidden div (you could inject it, but hey lets keep this simple ;). Bind the load to the click event of the master record displayed, and then use slideDown to show the hidden div on the page.
ie A very simply example of the load method, loading the html result from ajax/test.html into the element that is selected by 'result'
$('#result').load('ajax/test.html');

Template control in ASP.NET hiding content from page

I'm writing my own Modal Popup as a template control in ASP.NET. I got two template containers - one for the heading of the window and one for the actual control i want to display in the modal window (let's call it the form control). The form controls can contain server controls like buttons, textbox'es etc.
It works well, except when i want to access the form control in my web page. My codebehind won't recognize the content in the template control - just like it won't in, say a Repeater. So i figured a Panel control works just like what i need, except the Panel control only has "one container" and i'd really like to be able to set both a header and the content (form control).
I figured i could overwrite the Panel control to add my own html but that would limit my header to be something encodeable in an attribute. So is my best bet really to expose the Heading as just a property, instead of a template and thus being limited in what i can write for heading?
Just as you can with a repeater, try using the ParentControl.FindControl(...) method to get the control you desire.
I ended up overriding the Panel control, accepting that i can only "pass" one set of controls as its children. Also i had to make the heading a property i set as an attribute on the modalpopup control.
Even though i couldn't solve it the way i wanted to, i think the solution is good enough.

Resources