I use a dynamic cartesianchart, but when the columns are too many its resize them to fit the chart. But I want the columns to have a minimum column width, otherwise the chart is not readable. The page has 2 panels, in the top one there is the CartesianChart and a PolarChart. I follow this example
Code:
<ext:Panel ID="Panel1" runat="server" Height="250" MarginSpec="0 0 3 0">
<LayoutConfig>
<ext:HBoxLayoutConfig Align="Stretch" />
</LayoutConfig>
<Items>
<ext:CartesianChart
ID="BarChart1"
runat="server"
Border="true"
Flex="4"
StoreID="storeSites" AutoScroll="true" Resizable="true" >
<Interactions>
<ext:ItemHighlightInteraction />
</Interactions>
<AnimationConfig Duration="300" Easing="EaseOut" />
<Axes>
<ext:NumericAxis Position="Left" Fields="patientstarget" Minimum="0" Hidden="true" />
<ext:CategoryAxis Position="Bottom" Fields="site">
<Label Font="9px Arial" RotationDegrees="-45" />
<Renderer Handler="return Ext.String.ellipsis(label, 15, false);" />
</ext:CategoryAxis>
</Axes>
<Series>
<ext:BarSeries
Highlight="true"
XField="site"
YField="patientstarget" >
<StyleSpec>
<ext:Sprite FillStyle="#456d9f" />
</StyleSpec>
<HighlightConfig>
<ext:Sprite FillStyle="#619fff" StrokeStyle="black" />
</HighlightConfig>
<Label
Display="InsideEnd"
Field="patientstarget"
Color="#000"
Orientation="Vertical"
TextAlign="Center"
/>
<Listeners>
<ItemMouseUp Fn="onMouseUp" />
</Listeners>
</ext:BarSeries>
</Series>
<Plugins>
<ext:ChartItemEvents ID="ChartItemEvents1" runat="server" />
</Plugins>
</ext:CartesianChart>
//PolarChart
</Items>
</ext:Panel>
Related
I have the following grid and I need to obtain the value of each field entered by the user, but since the PropertyGridParameter does not have an ID, I do not know how to enter the value
<ext:PropertyGrid ID="PropertyGrid1" runat="server">
<Source>
<ext:PropertyGridParameter Name="objetivo1" Value="0" DisplayName="Border Width" />
<ext:PropertyGridParameter Name="objetivo2" Value="6" DisplayName="Border Width" />
<ext:PropertyGridParameter Name="objetivo3" Value="75" DisplayName="Border Width" />
<ext:PropertyGridParameter Name="objetivo4" Value="58" DisplayName="Border Width" />
<ext:PropertyGridParameter Name="objetivo5" Value="65" DisplayName="Border Width" />
</Source>
</ext:PropertyGrid>
Asp.net 4.5 , IIS 8
The sanitizer even not removing this simple script
<script>alert('error')</script>
Ok here my config
<asp:TextBox ID="txtMessageBody" TextMode="MultiLine" Height="500px" runat="server"
CssClass="MessageSendArea" MaxLength="4000" ClientIDMode="Static" />
<ajaxToolkit:HtmlEditorExtender ID="htmlEditorExtender1" TargetControlID="txtMessageBody"
runat="server" DisplaySourceTab="True">
<Toolbar>
<ajaxToolkit:Undo />
<ajaxToolkit:Redo />
<ajaxToolkit:Bold />
<ajaxToolkit:Italic />
<ajaxToolkit:Underline />
<ajaxToolkit:StrikeThrough />
<ajaxToolkit:Subscript />
<ajaxToolkit:Superscript />
<ajaxToolkit:JustifyLeft />
<ajaxToolkit:JustifyCenter />
<ajaxToolkit:JustifyRight />
<ajaxToolkit:JustifyFull />
<ajaxToolkit:InsertOrderedList />
<ajaxToolkit:InsertUnorderedList />
<ajaxToolkit:CreateLink />
<ajaxToolkit:UnLink />
<ajaxToolkit:RemoveFormat />
<ajaxToolkit:SelectAll />
<ajaxToolkit:UnSelect />
<ajaxToolkit:Delete />
<ajaxToolkit:Cut />
<ajaxToolkit:Copy />
<ajaxToolkit:Paste />
<ajaxToolkit:BackgroundColorSelector />
<ajaxToolkit:ForeColorSelector />
<ajaxToolkit:FontNameSelector />
<ajaxToolkit:FontSizeSelector />
<ajaxToolkit:Indent />
<ajaxToolkit:Outdent />
<ajaxToolkit:InsertHorizontalRule />
<ajaxToolkit:HorizontalSeparator />
</Toolbar>
</ajaxToolkit:HtmlEditorExtender>
Here my webconfig
<configSections>
<sectionGroup name="system.web">
<section name="sanitizer" requirePermission="false" type="AjaxControlToolkit.Sanitizer.ProviderSanitizerSection, AjaxControlToolkit"/>
</sectionGroup>
<trust level="Full"/>
<sanitizer defaultProvider="HtmlAgilityPackSanitizerProvider">
<providers>
<add name="HtmlAgilityPackSanitizerProvider" type="AjaxControlToolkit.Sanitizer.HtmlAgilityPackSanitizerProvider"/>
</providers>
</sanitizer>
here my check
if (htmlEditorExtender1.SanitizerProvider == null)
{
Response.Redirect("PostNewPM.aspx");
}
Here the result i get when i post the above alert script message
<script>alert('error')</script>
when it is decoded to display to user
<script>alert('error')</script>
Add the SanitizerProvider attribute as follows:
<ajaxToolkit:HtmlEditorExtender ID="htmlEditorExtender1"
TargetControlID="txtMessageBody"
runat="server" DisplaySourceTab="True"
SanitizerProvider="HtmlAgilityPackSanitizerProvider">
I am trying to create 2 different columns, and within each column I want to have multiple items. For instance a ComboBox, and 2 DateFields in one column.
I publish the code, and it gives me and error when I try to run it saying "Only one Component allowed in this Collection"
<body>
<form id="MetricsForm" runat="server">
<ext:ResourceManager ID="MetricsManager" runat="server" />
<ext:Viewport ID="MetricsViewPort" runat="server"></ext:Viewport>
<asp:SqlDataSource ID="DMSSQL2DataSource" runat="server" ConnectionString="" />
<asp:SqlDataSource ID="LocalDataSource" runat="server" ConnectionString="" />
<ext:TabPanel ID="TabPanel" runat="server">
<Items>
<ext:Panel runat="server" Title="Step 1" ID="Tab1">
<Items>
<ext:Panel ID="Panel1"
runat="server"
Title="Step 1: Choose date span and set spans"
Region="North"
Height="200"
Width="475"
MinWidth="225"
MaxWidth="475">
<Items>
<ext:Container runat="server" Layout="RowLayout" Height="200" >
<Items>
<ext:ColumnLayout runat="server" ID="MetricsColumnLayout">
<Columns>
<ext:LayoutColumn ColumnWidth="0.5">
<ext:RadioGroup runat="server" ID="ChooseSpan" Selectable="true" ColumnsNumber="1" >
<Items>
<ext:Radio ID="RadioAll" runat="server" BoxLabel="Show All" InputValue="0" />
<ext:Radio ID="RadioMonth" runat="server" BoxLabel="Choose Date Range(By Month)" InputValue="1" />
<ext:Radio ID="RadioDate" runat="server" BoxLabel="Choose Date Range(By Dates)" InputValue="2" />
</Items>
</ext:RadioGroup>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth="0.5">
<ext:ComboBox runat="server" ID="MonthComboBox" Selectable="true" SelectedIndex="0" StyleSpec="margin-bottom:4px;" Width="200" >
<Items>
<ext:ListItem Text="Any Month" Value="0" />
<ext:ListItem Text="January" Value="1" />
<ext:ListItem Text="February" Value="2" />
<ext:ListItem Text="March" Value="3" />
<ext:ListItem Text="April" Value="4" />
<ext:ListItem Text="May" Value="5" />
<ext:ListItem Text="June" Value="6" />
<ext:ListItem Text="July" Value="7" />
<ext:ListItem Text="August" Value="8" />
<ext:ListItem Text="September" Value="9" />
<ext:ListItem Text="October" Value="10" />
<ext:ListItem Text="November" Value="11" />
<ext:ListItem Text="December" Value="12" />
</Items>
</ext:ComboBox>
<ext:DateField
ID="StartDateField"
runat="server"
FieldLabel="Start"
Vtype="daterange"
AnchorHorizontal="100%"
EnableKeyEvents="true"
Width="200">
<CustomConfig>
<ext:ConfigItem Name="endDateField" Value="#{EndDateField}" Mode="Value" />
</CustomConfig>
<Listeners>
</Listeners>
</ext:DateField>
<ext:DateField
ID="EndDateField"
runat="server"
Vtype="daterange"
FieldLabel="End"
AnchorHorizontal="100%"
EnableKeyEvents="true"
Width="200">
<CustomConfig>
<ext:ConfigItem Name="startDateField" Value="#{StartDateField}" Mode="Value" />
</CustomConfig>
<Listeners>
</Listeners>
</ext:DateField>
</ext:LayoutColumn>
</Columns>
</ext:ColumnLayout>
</Items>
</ext:Container>
</Items>
</ext:Panel>
</Items>
</ext:Panel>
<ext:Panel runat="server" Title="Step 2" ID="Tab2">
</ext:Panel>
</Items>
</ext:TabPanel>
<div>
</div>
</form>
I'm not 100% sure what layout you are trying to configure, but it would be best to avoid using the Layout Controls as they have been removed from Ext.NET 2. You can use the .Layout property.
The following sample demonstrates replacing the Layout control with .Layout property.
Example
<%# Page Language="C#" %>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Ext.NET Example</title>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<ext:TabPanel runat="server">
<Items>
<ext:Panel runat="server" Title="Step 1">
<Items>
<ext:Panel
runat="server"
Title="Step 1: Choose date span and set spans"
Region="North"
Height="200"
Width="475"
MinWidth="225"
MaxWidth="475">
<Items>
<ext:Container runat="server" Layout="ColumnLayout" Height="200">
<Items>
<ext:RadioGroup runat="server" Selectable="true" ColumnsNumber="1" >
<Items>
<ext:Radio runat="server" BoxLabel="Show All" InputValue="0" />
<ext:Radio runat="server" BoxLabel="Choose Date Range(By Month)" InputValue="1" />
<ext:Radio runat="server" BoxLabel="Choose Date Range(By Dates)" InputValue="2" />
</Items>
</ext:RadioGroup>
<ext:ComboBox
runat="server"
Selectable="true"
SelectedIndex="0"
StyleSpec="margin-bottom:4px;"
Width="200">
<Items>
<ext:ListItem Text="Any Month" Value="0" />
<ext:ListItem Text="January" Value="1" />
<ext:ListItem Text="February" Value="2" />
<ext:ListItem Text="March" Value="3" />
<ext:ListItem Text="April" Value="4" />
<ext:ListItem Text="May" Value="5" />
<ext:ListItem Text="June" Value="6" />
<ext:ListItem Text="July" Value="7" />
<ext:ListItem Text="August" Value="8" />
<ext:ListItem Text="September" Value="9" />
<ext:ListItem Text="October" Value="10" />
<ext:ListItem Text="November" Value="11" />
<ext:ListItem Text="December" Value="12" />
</Items>
</ext:ComboBox>
<ext:DateField
runat="server"
FieldLabel="Start"
AnchorHorizontal="100%"
EnableKeyEvents="true"
Width="200"
/>
<ext:DateField
runat="server"
FieldLabel="End"
AnchorHorizontal="100%"
EnableKeyEvents="true"
Width="200"
/>
</Items>
</ext:Container>
</Items>
</ext:Panel>
</Items>
</ext:Panel>
<ext:Panel runat="server" Title="Step 2"/>
</Items>
</ext:TabPanel>
</form>
</body>
</html>
Just wrap the things in a Container.
<ext:Container
runat="server"
Width="600"
Height="300"
Layout="ColumnLayout">
<Items>
<ext:RadioGroup runat="server" ColumnWidth="0.5">
<Items>
<ext:Radio runat="server" BoxLabel="1" />
<ext:Radio runat="server" BoxLabel="2" />
</Items>
</ext:RadioGroup>
<ext:Container runat="server" ColumnWidth="0.5">
<Items>
<ext:ComboBox runat="server" />
<ext:DateField runat="server" />
<ext:DateField runat="server" />
</Items>
</ext:Container>
</Items>
</ext:Container>
How to set the grid/text colour of an asp:chart?
I'm refering to the colour of the gridlines and the colour of the text on the x and y axis?
Basically I want the black grid and black text below to be shown as white.
In your ChartArea you need to set the X and Y axis colors:
<ChartAreas>
<asp:ChartArea Name="ChartArea1" >
<AxisY>
<MajorGrid LineColor="White" />
<MajorTickMark LineColor="White" />
<LabelStyle ForeColor="White" />
</AxisY>
<AxisX>
<MajorGrid LineColor="White" />
<MajorTickMark LineColor="White" />
<LabelStyle ForeColor="White" />
</AxisX>
</asp:ChartArea>
</ChartAreas>
There are options for MajorGrid, MinorGrid and StripLines. The LabelStyle sets your text.
I want a popup onclick that flies in animated. I'm using ajax and currently this is what I have:
<asp:ImageButton ID="ImageButton2" runat="server"
ImageUrl="~/images/bttnViewMini.gif" />
<asp:Panel ID="Panel3" runat="server">
//stuff
</asp:Panel>
<ajaxToolkit:AnimationExtender ID="ae"
runat="server" TargetControlID="ImageButton2" >
<Animations>
<OnClick>
<FadeIn Duration=".5" Fps="20" />
</OnClick>
</Animations>
</ajaxToolkit:AnimationExtender>
That makes my button fade in....
How Do I make it fade the Panel3 in instead?
What you want to do is in your FadeIn tag add:
<FadeIn AnimationTarget="Panel3" Duration=".5" Fps="20" />
Thanks for all of the hundreds of answers I received. Nevertheless here's what i did:
<asp:ImageButton ID="ImageButton2" runat="server"
ImageUrl="~/images/icon_info.gif" />
<div id="moveMe" style="display:none">
<div style="float:right;">
<asp:LinkButton ID="lnkBtnCloseColHelp" runat="server" Text="X" OnClientClick="return false;" />
</div>
<br /><br />
<table>
<tr>
<td>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
DataSourceID="None of your Buisness" GridLines ="None" ShowHeader ="" >
<Columns>
<asp:BoundField DataField="LongDescription" HeaderText="Noyb:"
SortExpression="Noyb" />
</Columns>
</asp:GridView>
</td>
</tr>
</table>
</div>
<ajaxToolkit:AnimationExtender ID="ae"
runat="server" TargetControlID="ImageButton2" >
<Animations>
<OnClick>
<Sequence>
<EnableAction Enabled="false"></EnableAction>
<StyleAction AnimationTarget="moveMe" Attribute="display" Value=""/>
<Parallel AnimationTarget="moveMe" Duration="1" Fps="30">
<Move Horizontal="-350" Vertical="50"></Move>
<FadeIn Duration=".5"/>
</Parallel>
<Parallel AnimationTarget="moveMe" Duration=".5">
<Color PropertyKey="color" StartValue="#666666" EndValue="#0000FF" />
<Color PropertyKey="borderColor" StartValue="#666666" EndValue="#FF0000" />
</Parallel>
</Sequence>
</OnClick>
</Animations>
</ajaxToolkit:AnimationExtender>
<ajaxToolKit:AnimationExtender ID="AnimationExtender2" runat="server" TargetControlID="lnkBtnCloseColHelp">
<Animations>
<OnClick>
<Sequence AnimationTarget="moveMe">
<Parallel AnimationTarget="moveMe" Duration=".7" Fps="20">
<Move Horizontal="350" Vertical="-50"></Move>
<Scale ScaleFactor="0.05" FontUnit="px" />
<Color PropertyKey="color" StartValue="#FF0000" EndValue="#666666" />
<Color PropertyKey="borderColor" StartValue="#FF0000" EndValue="#666666" />
<FadeOut />
</Parallel>
<StyleAction Attribute="display" Value="none"/>
<StyleAction Attribute="height" Value=""/>
<StyleAction Attribute="width" Value="400px"/>
<StyleAction Attribute="fontSize" Value="14px"/>
<EnableAction AnimationTarget="ImageButton2" Enabled="true" />
</Sequence>
</OnClick>
</Animations>
</ajaxToolKit:AnimationExtender>