adding border around controls dynamically...asp.net - asp.net

My ASP.NET application allows the user to create their own screens. They can, for example, drag controls like textboxes, combos, etc and place them on the desginer. Now, they want to group specific controls in a box. For example, all the Basic information such as User name, address, age ,DOB etc should be surrounded by a single box (like..group box control). The code on runtime, dynamically places all these controls to create a page.
I tried to achieve this using a Panel control with a black border. This works fine, but when I add a background color to the panel, I no longer see the controls inside the panel. They are hidden.
Is there any good to achieve this. Please help.

Related

How to make invisible ASP.NET controls within a certain div tag?

I have a dropdown "ddl_group" list followed by two tags containing controls related to item chosen in the first. One item in ddl_group is teacher and another item is student. By default, I have set all controls within the two div tags to invisible. They only show up when a group related to them is chosen in ddl_group.
Imagine I choose student in ddl_group. Next, controls within div.stdInfo start to appear one after the other in response to user who makes choices on controls within div.stdInfo. Now the user might want to choose another group i.e. teacher from ddl_group. Therefore, I'll need to make invisible again all controls within div.stdInfo and make visible controls within div.teacherInfo.
Is it possible to make invisible or visible all asp.net controls within a certain tag (e.g. div tag) in one place rather than setting them individually?
You can place your div in
ASP.NET Panel Control
then you can make it
pnlName.Visible=true; or pnlName.Visible=false;
when ever you want or
you can use Div with
runat="server"
attribute so that it is accessible in code page
their you can do it like
divname.Visible=true; divname.Visible=false;
You can use ASP.NET Place holder or ASP.NET Panel controls for these purposes.
Wrap your content with Place holder or Panel.
On SelectedIndexChanged event of your drop down, you can change visibility of this PlaceHolder or Panel.
If you add a runat tag and an ID tag to your divs, that will make them accessible via server side code. I prefer this way because I don't have to mess-up my css at all.
e.g.
markup:
<div class='teacherinfo' ID='teacherDiv' runat='server'>
.
.
.
.
.
</div>
code behind:
teacherDiv.Visible = false;
One word of warning, making a server-side control invisible means that it will not be present on the resulting html document. So if you try to find it with javascript document.getElementById("<%= teacherDiv.ClientId %>"), you'll get an error.

Designing Custom Drop Down with mulitple rows and columns

I have a requirement like for the drop down as shown. Could any one help me in achieving this.
Briefing:
On click of the button a pane should be opened which contains rows and columns containing text, on click of it appropriate action need to take place. The source can be dynamic too....
There are many techniques for acheiving this design. You could do it purely with html and css by having an image that looks like a dropdown popup an absolutely positioned div underneath. Or you could use the asp.net ajax control toolkit control called "PopupControl" that essentially abstracts all the html/css away allowing you to just specify a target panel. There are also various jquery plugins, here is one from abeatifulsite.

Looking for a vb.net code to add existing buttons/text boxes/drop down lists, etc. to a container, or holder?

I'm using vb.net. Basically, I have a drop down list, text box and a submit button. You choose a movie director from a drop down list, then type in a movie, click button and it adds the data to my database.
There's another button which hides/shows drop down list, text box and submit button using Visible = True and Visible = False, but what I don't like about it is when it hides the things I said before, it leaves some white/empty space like if they are still there, but not visible.
Is there anyway to put some kind of holder/container and place a button which when clicked could add my drop down list, text box and submit buttons to that place?
Cheers,
E.N.
I assume that you are working with WinForms in Visual Studio. In the Toolbox the controls which could help you out of this situation are in the "Containers" section. Among others, there is a Panel, a FlowLayoutPanel and a TableLayoutPanel (see this video on msdn for a TableLayoutPanel Demo). They can help you to organize controls. Especially the FlowLayoutPanel places the controls automatically. But you can always change the Top and the Left properties of any control, to move them around to the desired place or group some of them on a Panel and change the Location of this one one.
You can add a control to a container by using the Add method of its Controls property. However, if the control is already on the form (since you are asking how to add an existing control) you must remove it from the form before.
Me.Controls.Remove(myButton)
panel1.Controls.Add(myButton)

How can you add a TouchGridPanel to a Panel in Sencha 2?

I'm currently using the Sencha Ext.ux.TouchGridPanel, and I need to know how to add it to a Panel dynamically. Currently, I set up a store, then use a function to generate the Panel. I then use
myPanel.add(myTouchGridPanel);
This displays the toolbar and headings of the Panel, but not any of the information within it. Making the TouchGridPanel fullscreen works, but then the animations are sloppy.
If the component is working correctly, perhaps the panel you are inserting it into is not the size you expect it to be?
Or maybe the GridPanel is not stretching to the size of the panel, in which case, you should add a fit or card layout to the panel, so it fits to the size of that panel.
If neither of these two things work, I suggest you open up web inspector and look at the dom of your panel - and see what the size of it is, and if the grid is actually being added to it or not.

Automatically mark ASP.Net controls which have a RequiredFieldValidator on them

Is there a clean and centralized way to automatically designate a background color or other CSS property for ASP.Net controls (i.e. a TextBox) with an enabled RequiredFieldValidator?
Currently I have manually set the background color of required controls to yellow. I would like to replace that with a central method so if the client requests a different color or marker or if a field's status changes from required to not or vice versa, I won't miss any of the controls.
Thanks
Update
This site is pre-compiled. Can something append a Css Class or other standards-compliant flag to items in the ControlToValidtate property at compile time?
Why not add a css class of required. You can have multiple classes on a single control by space delimiting them so imagine an input field which takes a number:
Now I can have two classes one which right aligns the text and one which handles the required field requirements.
Edit
One option before the page is rendered to walk through each control in the page, and if it's a required field validator, then find it's corresponding control and set the css property; however, this is a lot of work for somethign which you can tackle at design time.

Resources