We Keep Coding

Telerik RadEditor controls are disabled in inline editing mode

I have some custom drop downs under EditorToolGroup in RadEditor. I wanted to enable a drop down when I am in inline html editing mode. How to do it?
<telerik:RadEditor Skin="Metro" ID="HTMLEditor"
OnClientLoad="OnClientLoad"
OnClientSelectionChange="OnClientSelectionChange"
OnClientCommandExecuting="OnClientCommandExecutingHTML"
NewLineMode="Br"
EditModes="Design,Html"
ContentAreaMode="Iframe"
OnClientModeChange="OnClientModeChange"
Height="680px" Width="100%"
runat="server" EnableResize="false" ExternalDialogsPath="~/EditorDialogs"
ContentFilters="IECleanAnchors,FixEnclosingP,FixUlBoldItalic,MottEmStrong,RemoveScripts,ConvertToXhtml,ConvertInlineStylesToAttributes"
DialogsCssFile="~/styles/Editor_LinkManagerMetro.css">
<Tools>
<telerik:EditorToolGroup>
<telerik:EditorTool Name="SaveDesign" Text="Save" />
<telerik:EditorTool Name="SaveAs" Text="Save As My Template" ShowText="false" ShowIcon="true" />
<telerik:EditorTool Name="Undo" ShowIcon="true" />
<telerik:EditorTool Name="Redo" ShowIcon="true" />
<telerik:EditorSeparator Visible="true" />
<telerik:EditorDropDown Name="EnableThisDropdown" Width="125px" Text="Select" RenderMode="Lightweight" />

Easy user interface change depending on selection

So I have a dropdownlist with 2 items : Path and Queue
If the item selected is a Path, then the next thing displayed in the next div is a textBox (txtLocation), and if it is a Queue, then I have to show a DropDownList(cmbLocation) which items are part of a xml file.
Type:
<dx:ASPxComboBox ID="cmbPathType" runat="server" Width="150px" TextField="TypeName"
ValueField="QueueMonitorConfigTypesID">
<DisabledStyle BackColor="LightGray" ForeColor="Black" />
<Items>
<dx:ListEditItem Text="Path" Value="Path" />
<dx:ListEditItem Text="Queue" Value="Queue" />
</Items>
<ValidationSettings ValidateOnLeave="false" RequiredField-IsRequired="true">
<RequiredField IsRequired="True" />
</ValidationSettings>
</dx:ASPxComboBox>
Location:
<dx:ASPxTextBox ID="txtLocation" runat="server" Width="150px">
<DisabledStyle BackColor="LightGray" ForeColor="Black" />
<ValidationSettings ValidateOnLeave="false" RequiredField-IsRequired="true">
<RequiredField IsRequired="True"></RequiredField>
</ValidationSettings>
</dx:ASPxTextBox>
<dx:ASPxComboBox ID="cmbLocation" runat="server" Width="150px" DataSourceID="queuesXML">
</dx:ASPxComboBox>
<asp:XmlDataSource ID="queuesXML" runat="server" DataFile="~/Config/Config.xml" XPath="queue/name" ></asp:XmlDataSource>
I know I'm using dev express, but that should not matter for this

you need to work on change event of combobox. And Use the selection values as condition.

Modal Popup Extender animation in ASP.net

I am currently developing an ASP.net c# application. I have a grid view which has bound link buttons inside. When the link button is pressed I want to display the modal popup using a fade in animation and a fade out animation when a button inside the modal popup is clicked.
I have added the animation extender into the code and set the TargetControlID to the ID of the link button, however, when I try to run the website it displays the error System.InvalidOperationException the TargetControID of ModalPopupExtender is not valid. A control with ID 'sofLink' could not be found. sofLink is the ID of the LinkButton.
Below is the code for the grid view
<asp:GridView ID="tblSoftware" runat="server" Width="100%"
EnableModelValidation="True" AutoGenerateColumns="False"
onselectedindexchanged="tblSoftware_SelectedIndexChanged"
CellPadding="2">
<Columns>
<asp:TemplateField HeaderText="Software Name">
<ItemTemplate>
<asp:LinkButton ID="sofLink" Text='<%# Bind("sof_softwareName") %>'
CommandName="sofID" OnCommand="GetSoftwareModal" CommandArgument='<%# Eval("sof_id") %>' runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="sof_platform" HeaderText="Platform" ReadOnly="True" SortExpression="sof_platform" />
</Columns>
<HeaderStyle CssClass="gridHeader" />
<PagerSettings Position="Bottom" />
<PagerStyle HorizontalAlign="Right" VerticalAlign="Middle" CssClass="gridPage" />
<AlternatingRowStyle BackColor="White"></AlternatingRowStyle>
</asp:GridView>
And below is the code for the ModalPopupExtender
<ajaxToolkit:ModalPopupExtender ID="mpe" runat="server" TargetControlID="sofLink"
PopupControlID="ModalPanel" DropShadow="true" Drag="true" OkControlID="OKButton" />
<asp:Panel ID="ModalPanel" runat="server" Width="500px" style="width: auto; height: auto;" CssClass="modalPopup">
<asp:Label ID="softwareTitle" Font-Bold="true" Font-Size="Medium" runat="server" Width="100%" style="text-align: center;" /><br /><br />
<asp:Literal ID="litSoftware" runat="server"></asp:Literal>
<asp:Button id="OKButton" runat="server" Text="Close" style="position: relative; right: 0px; width: 100px;" />
</asp:Panel>
<asp:ScriptManager ID="asm" runat="server" />
And below is the code for the animation
<ajaxToolkit:AnimationExtender ID="popupAnimation" runat="server"
TargetControlID="sofLink">
<Animations>
<OnClick>
<Parallel AnimationTarget="ModalPanel"
Duration="0.3" Fps="25">
<FadeIn />
</Parallel>
</OnClick>
</Animations>
</ajaxToolkit:AnimationExtender>
Thanks for any help you can provide.

The TargetControlID (as far as I am aware) should be a control in the popup panel itself, not in the grid control. When I use the ModalPopupExtender I usually use an asp:Button with 'display:none' as the TargetControlID. Eg,
<ajaxToolkit:ModalPopupExtender ID="mpe" runat="server" TargetControlID="btnPopup"
PopupControlID="ModalPanel" DropShadow="true" Drag="true" OkControlID="OKButton" />
<asp:Panel ID="ModalPanel" runat="server" Width="500px" style="width: auto; height: auto;" CssClass="modalPopup">
<asp:Button id="btnPopup" runat="server" style="display:none" />
In the code-behind you have to control the showing and hiding of the control base on an event, eg, GetSoftwareModal. You will also also to bind what you need if applicable.
Hope that helps.

You could use a hidden button and use it's ID as TargetControlID of the ModalPopupExtender.
<asp:Button id="btnShowPopup" runat="server" style="display:none" />
Then you can call the button's click clientside if you want to show the popup immediately without postback in the follwoing way:
<asp:LinkButton ID="sofLink" runat="server" OnClientClick="javascript:document.getElementById('btnShowPopup').click();return false;">LinkButton</asp:LinkButton>

I tried however my animation doesn't display.
I add databind into LinkButton:
<asp:LinkButton ID="sofLink" runat="server" OnClientClick="javascript:document.getElementById('DetailView1').databind();document.getElementById('btnShowPopup').click();return false;">LinkButton</asp:LinkButton>
I think because of databind of DetailView1, it need get data from database. If DetailView1 doesn't bind, the animation display normal.

Is there a standard way for form layout in ASP.Net?

Here's my forms layout:
<body>
<p>Note that this form doesn't actually do anything
except illustrate the Required Field Validator.</p>
<form id="frmValidator" method="post" runat="server">
Usuario:
<asp:TextBox id="txtUserName" runat="server" />
<asp:RequiredFieldValidator id="userNameValidator" ControlToValidate="txtUserName" ErrorMessage='<img src="../Images/no.png">' runat="server" />
<br />
Contrasena:
<asp:TextBox id="txtPassword" runat="server" />
<asp:RequiredFieldValidator id="passwordValidator" ControlToValidate="txtPassword" ErrorMessage='<img src="../Images/no.png">' runat="server" />
<br />
<asp:button id="btnSubmit" text="Submit" runat="server" />
</form>
<p>Hint: Try submitting it before you enter something.</p>
</body>
This is a simple layout for just learning purposes, but they align themselves badly. They just smooch together.
Someone suggested I just prace the 'space' key to create the whitespace between them, but that doesn't align them at all. They can never be correctly aligned.
Someone said use tables, but I loathe the idea of using tables for layout.
How can I achieve a simple
organizational style between these two
fields?

To expand on Creasey's answer.
<div style="width=150">Usuario:</div>
<asp:TextBox id="txtUserName" runat="server" />
...
<div style="width=150">Contrasena:</div>
<asp:TextBox id="txtPassword" runat="server" />

wrap you labels in a div with a class. Then set the min-width the label class so that it is as wide as you need it, then all your fields/labels will line up.

How about padding them so they're not smooshed together? Of course, you may want to create a css class instead of the style attribute, but you get the point.
As far as a standard for ASP.NET, just use good standard CSS. There's nothing fundamentally different with ASP.NET than any other web programming language.
<form id="frmValidator" method="post" runat="server">
<div style="padding:5px;">
Usuario:
<asp:TextBox id="txtUserName" runat="server" />
<asp:RequiredFieldValidator id="userNameValidator" ControlToValidate="txtUserName" ErrorMessage='<img src="../Images/no.png">' runat="server" />
</div>
<div style="padding:5px;">
Contrasena:
<asp:TextBox id="txtPassword" runat="server" />
<asp:RequiredFieldValidator id="passwordValidator" ControlToValidate="txtPassword" ErrorMessage='<img src="../Images/no.png">' runat="server" />
</div>
<div style="padding:5px;">
<asp:button id="btnSubmit" text="Submit" runat="server" />
</div>
</form>

I would try to use a template or an form generator. A great starting point for solutions is:
http://www.smashingmagazine.com/2006/11/11/css-based-forms-modern-solutions/
:-)

No need for extra <div>'s - that's what CSS is for!
Here's a basic example using what ASP would render as HTML: http://jsfiddle.net/qWcpN/
And here's the code for it in case you don't want to look at the link.
HTML:
<asp:Label runat="server" AssociatedControlID="txtUserName" Text="Username" />
<asp:TextBox runat="server" id="txtUserName" />
<asp:RequiredFieldValidator runat="server" id="userNameValidator" CssClass="formError" ControlToValidate="txtUserName" ErrorMessage='Username is required!' />
<asp:Label runat="server" AssociatedControlID="txtPassword" Text="Password" />
<asp:TextBox runat="server" id="txtPassword" />
<asp:RequiredFieldValidator runat="server" id="passwordValidator" CssClass="formError" ControlToValidate="txtPassword" ErrorMessage='Password is required!' />
<asp:Button runat="server" id="btnSubmit" text="Submit" />
CSS:
label{
display:block;
font-weight:bold;
margin-bottom:2px;
}
input[type='text'],
input[type='password']{
display:block;
margin-bottom:10px;
padding:3px;
}
button,
input[type='button'],
input[type='submit']{
padding:5px;
}
.formError{
background:#F00;
color:#FFF;
display:block;
font-weight:bold;
margin-bottom:10px;
max-width:300px;
padding:3px;
}​

Validation Group used to validate the group not show the error message

In the form in aspx I have two textbox and one image button for each textbox.
I need validation the value for each textbox in a separate way and for this I have for each image button linked to a different event.
For this I have finded in google and I have tried this tutorial:
http://www.c-sharpcorner.com/Blogs/3625/use-of-validation-group-in-Asp-Net.aspx
But in my form the Validation Group in asp.net not working and I don't understand the reason.
What does not work are the warning messages that indicate required fields.
What's wrong?
My code aspx below, thank you in advance.
<form id="form1" runat="server">
<div>
<asp:textbox id="TextBox1" runat="server" width="100" cssclass="ddl_Class" validationgroup="First"></asp:textbox>
<asp:requiredfieldvalidator id="RequiredFieldValidator3" runat="server" controltovalidate="TextBox1"
errormessage="Error in TextBox1" text="***" display="None" validationgroup="First"></asp:requiredfieldvalidator>
<asp:regularexpressionvalidator id="RegularExpressionValidator4" runat="server" controltovalidate="TextBox1"
errormessage="TextBox1 only number" text="***" display="None" validationexpression="^\d+$" validationgroup="First"></asp:regularexpressionvalidator>
<asp:imagebutton id="btnSave1" runat="server" validationgroup="First" onclick="ButtonSave1_Click" imageurl="/Images/save_button.gif" onclientclick="if (!confirm('Confirm?')) return false;" />
<asp:textbox id="TextBox2" runat="server" width="100" cssclass="ddl_Class" validationgroup="Second"></asp:textbox>
<asp:requiredfieldvalidator id="RequiredFieldValidator4" runat="server" controltovalidate="TextBox2"
errormessage="Error " text="***" display="None" validationgroup="Second"></asp:requiredfieldvalidator>
<asp:imagebutton id="btnSave2" runat="server" validationgroup="Second" onclick="ButtonSave2_Click" imageurl="/Images/save_button.gif" onclientclick="if (!confirm('Confirm?')) return false;" />
</div>
<asp:validationsummary id="First" runat="Server" showmessagebox="true" cssclass="validation-summary-errors" />
<asp:validationsummary id="Second" runat="Server" showmessagebox="true" cssclass="validation-summary-errors" />
</form>

I have verified your code, only problem that I identified is missing validation group in validation summary tag.
See below:
<asp:validationsummary id="First" validationgroup="First" runat="Server" showmessagebox="true" cssclass="validation-summary-errors" />
<asp:validationsummary id="Second" validationgroup="Second" runat="Server" showmessagebox="true" cssclass="validation-summary-errors" />
Hope this will work