I have a Telerik RadHtmlChart inside an asp Panel which uses an ajaxtoolkit CollapsiblePanelExtender.
If the panel is collapsed when I assign a datasource to the chart and databind, after the panel expands the chart only fills 1/2 the panel size, left to right. If I have the panel expanded and the chart visible during the databind, it fills the panel all the way across as expected.
Somehow I need to know when the panel has expanded and tell the chart to resize/repaint and fill the available space in the panel, but so far no joy doing this.
Or maybe there is a flag/property on my controls I've missed which would help the chart fill the available space even when the panel is collapsed.
I would prefer to work in the C# code behind, but javascript/jquery solutions are also appreciated.
Thanks,
-Rico
HtmlChart renders on the client so you would need to use JavaScript. Here is how to resize a chart when its container resizes: http://www.telerik.com/support/code-library/radhtmlchart-in-a-responsive-web-page. Essentially - make sure its div container has the desired size and call its repaint() method.
Here is how to hook up to the client-side events of the CollapsiblePanel: http://forums.asp.net/t/1112899.aspx?How+to+track+Collapse+Expand+event+of+AJAX+Collapsible+Panel+Extender+to+call+javascript+ It is a tad tricky and you have to attach them with more client side code (add_expandComplete(theHandlerFunctionObject) and add_collapseComplete(theHandlerFunctionObject) after having the client-side object of the CollapsiblePanel).
Of course, if you trigger the expand/collapse yourself you can simply call the needed script, depending on your logic - either add it to already existing client-side handler, or registger it from the server.
Related
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.
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)
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.
I've successfully been able to add controls (labels, images, buttons, etc) to a panel control (using VB/ASP). This panel control, I refer to it as "insertpanel". Then I add this panel to the main panel on my webpage which I made during design time. The problem I run into is that when I add multiple controls of any type to the panel, they are all added in line with each other. I tried giving my image some css-styling of:
.VBCODEimageinsert
{
float:left;
margin:2px;
}
That works fine as making the image be at the left side of the panel, and the 5 labels to the right of it. Problem is, the labels are all in line and they don't wrap to the next line. I tried adding a literal of the carriage return/line feed but that didn't seem to work either. What is an easy way of laying out this panel that i'm inserting into another panel? A table? And can I do this if a table will work:
mainpanel.Controls.Add(table)
Yes, you can add a table, then rows and cells for the other controls. And as mentioned above, you can use a < br/> instead
In asp.net, am trying to populate a dropdownlist box with very long text. I have fixed the width of list on the page and i don't want to change its size as it would affect my page layout. On clicking the dropdownlist, the text gets truncated to the size of the dropdown. I want to see the entire text without any truncation, without changing the size of the dropdownlist box..Also if there are any third party controls which would solve this problem?Would be very helpful if there's a solution for this.
Update:
Right now am trying a dropdown box in Jquery that will wrap the text if it exceeds the size..but again the problem is it works fine on an independent solution but when i integrate it with my application, it does not read the .css file and it does not do any formatting(style, font, alignment) that it is supposed to do according to the .css file.Any idea why this is happening?
The problem that you're describing is restricted to IE (it might be fixed in the latest version, I haven't tested).
In the past, I've had success with binding javascript methods to the onClick event on the drop down to increase the width, and the onBlur event to set the width back to its original value.
You might be able to use jQuery to create a tooltip like thing that appears when you hover over each option.
something like
// this executes on page load - just like asp.net Page_load()
function pageLoad(){
// attach a mouseover event to each option in your dropdown
$("#myDropdown option").mouseover(function(){
// get the text from that option
var text = $("#"+this.id).text();
// display that text in a small tooltip
showToolTip(text);
});
}
function showToolTip(text){
// display in some way
}
there's a javascript library called wz_tooltip available at walterzorn.com
hope that helps