ASP.Net AJAX ValidatorCalloutExtender issue - validation

I am building a User Control (requirement – has to be User Control).
This user control is inside an AJAX Update Panel on the parent page.
The user control has two Infragistics Web Date Chooser controls on it.
Both dates are required.
I have placed asp.net RequiredFieldValicators on both controls.
I have placed ValidatorCalloutExtenders on both.
One control gets validated every time without fail. The other is intermittent. To debug I first removed the ValidatorCalloutExtender from the failing control and sure enough the RequiredFieldValidator fires correctly every time so it appears that the problem is with the ValidatorCalloutExtender. There are not a lot of options for the ValidatorCalloutExtender but I did play with them every way feasible and nothing seems to make any difference. The TargetControlID has to point to the validation control you are extending. Any help appreciated.

Here is the code that works correctly every time:
<igsch:WebDateChooser ID="wdcEndDatePop" runat="server" EnableAppStyling="True"
NullDateLabel="" StyleSetName="eWERKS3" StyleSetPath="~/App_Themes/"
Width="200px" MinDate="2009-01-01" />
<asp:RequiredFieldValidator ID="rfvEndDate" runat="server"
ControlToValidate="wdcEndDatePop" Display="None"
ErrorMessage="End date required." ValidationGroup="endDatePop" />
<cc1:ValidatorCalloutExtender
ID="vceEndDatePop"
runat="server"
CloseImageUrl="~/images/close.gif"
HighlightCssClass="validatorCalloutHighlight"
TargetControlID="rfvEndDate"
WarningIconImageUrl="~/images/back_warning2.gif" />
And here is the code that works intermitemtly:
<igsch:WebDateChooser ID="wdcStartDate" runat="server" EnableAppStyling="True"
NullDateLabel="" StyleSetName="eWERKS3" StyleSetPath="~/App_Themes/"
MinDate="2009-01-01" />
<asp:RequiredFieldValidator ID="rfvStartDate" runat="server"
ControlToValidate="wdcStartDate" Display="None"
ErrorMessage="Start date required." ValidationGroup="access" />
<cc1:ValidatorCalloutExtender
ID="vceStartDate"
runat="server"
CloseImageUrl="~/images/close.gif"
HighlightCssClass="validatorCalloutHighlight"
TargetControlID="rfvStartDate"
WarningIconImageUrl="~/images/back_warning2.gif" />

Related

Embedded tabs in RadTabStrip

I'm using Telerik's RadTabStrip and RadMultiPage to create some tabs for a website using Visual Studio 2012. I have a row of three tabs and one of the tabs has two child tabs.
The primary tabs are Notes, Minutes and Admin. Then Notes has two child tabs Us and Them. When the user clicks on Notes, I want it to default to Us with the option of selecting Them.
I would like to do this all on the aspx page and not the code behind. I found some examples that do it in code but it doesn't seem like it should be necessary. However, after hours of searching and fiddling with the control I've come up empty or worse, results that make no sense to me. I found a lot of examples on how to create a RadTabStrip with child tabs...a lot of examples...but none of them explain how to map those tabs and child tabs to a RadPageView. Is it so simple they don't feel the need to write an example of this step? Is it impossible on the aspx side and that's why some of the examples jump into the codebehind? I don't get it.
Here's what I have. I know it doesn't work but at this point I've tried so many different things I don't know which end is up.
<telerik:RadTabStrip ID="RadTabStrip1" runat="server" MultiPageID="RadMultiPage1">
<Tabs>
<telerik:RadTab runat="server" Text="Notes" Selected="true">
<Tabs>
<telerik:RadTab runat="server" Text="Us" Selected="true" />
<telerik:RadTab runat="server" Text="Them" />
</Tabs>
</telerik:RadTab>
<telerik:RadTab runat="server" Text="Minutes" />
<telerik:RadTab runat="server" Text="Admin" />
</Tabs>
</telerik:RadTabStrip>
<telerik:RadMultiPage ID="RadMultiPage1" runat="server">
<%--UserControl 1 Tab--%>
<telerik:RadPageView ID="RadPageView1" runat="server" CssClass="tabstyle" Selected="true" />
<%--Child 1 Tab--%>
<telerik:RadPageView ID="RadPageView2" runat="server" CssClass="tabstyle">
<uc:ucNote ID="ucNote1" runat="server" />
</telerik:RadPageView>
<%--Child 2 Tab--%>
<telerik:RadPageView ID="RadPageView3" runat="server" CssClass="tabstyle">
<uc:ucNote ID="ucNote2" runat="server" />
</telerik:RadPageView>
<%--UserControl 2 Tab--%>
<telerik:RadPageView ID="RadPageView4" runat="server" CssClass="tabstyle">
<uc:ucMinute ID="ucMinute1" runat="server" />
</telerik:RadPageView>
<%--UserControl 3--%>
<telerik:RadPageView ID="RadPageView5" runat="server" CssClass="tabstyle">
<uc:ucAdmin ID="ucAdmin1" runat="server" />
</telerik:RadPageView>
</telerik:RadMultiPage>
Ok, I think I figured out what was wrong and it turned out to be very minor. I just didn't set all the Selected="true". Once I made sure the Note node and the Us node in the RadTabStrip were selected and the Note node and Us node in the RadMultiPage were selected it started working the way I expected. I'm skeptical that I was that close and the solution was that easy after all the time I put into it but so far it's looking right.

RadioButtonList not triggering ajax postback

I have an ASP.Net RadioButtonList control with AutoPostBack set to true and a server side handler for the SelectedIndexChanged event.
<asp:RadioButtonList runat="server" ID="btnAcceptReject" RepeatDirection="Horizontal" CssClass="checkboxlist borderless" ValidationGroup="data" AutoPostBack="true" OnSelectedIndexChanged="radioButtonList_SelectedIndexChanged">
<asp:ListItem Text="The edition is hereby validated for conformity to standards" Value="0" Selected="True"></asp:ListItem>
<asp:ListItem Text="The edition does not meet standards and still has to be reviewed" Value="1"></asp:ListItem>
</asp:RadioButtonList>
I am using a RadAjaxManager, a telerik control, to handle ajax postbacks
<telerik:RadAjaxManagerProxy runat="server" ID="RadAjaxManagerPRoxy1">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="btnAcceptReject">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="pnlControls" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
pnlControl is a panel on the page containing controls that will be enabled/disabled depending on which radio button was checked.
The above always performs a full postback of the page.
how can i make it perform an ajax partial postback?
Could it be a result of you using RadAjaxManagerProxy instead of RadAjaxManager?
RadAjaxManagerProxy expects that there is a RadAjaxManager declared elsewhere within a Master Page etc.
If that fails then I suggest to alter the pnlControl to become a RadAjaxPanel and then remove the RadAjaxManagerProxy declaration as the RadAjaxPanel will do all the work for you.
Good luck!
In reply to your comments, I would now suggest to do the following within the referencing ASPX page (if that is possible under your scenario):
Add a RadAjaxManagerProxy to the client-side
Within the code-behind add a new Sub to be called during Page_Load (outside the postback check)
Within the Sub:
Dim panel As Panel = CType(myUserControl.FindControl("pnlControls"),Panel)
Dim radio As RadioButtonList = CType(myUserControl.FindControl("btnAcceptReject"), RadioButtonList)
RadAjaxManagerProxy1.AjaxSettings.AddAjaxSetting(radio, panel, Nothing)
*Nothing - Optionally a RadAjaxLoadingPanelID if you have one declared on the .ASPX page
Hope it helps!

asp RadioButtonList inside nested user control always performing full postback

I have a RadioButtonList control inside a nested user control. When one of its buttons is clicked, i want a panel to be refreshed with an ajax postback. I am using the telerik RadAjaxManager. The problem is that the list always triggers a FULL postback. markup is below
<telerik:RadAjaxManagerProxy runat="server" ID="RadAjaxManagerPRoxy1">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="btnAcceptReject">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="pnlControls" UpdatePanelRenderMode="Inline" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManagerProxy>
<asp:RadioButtonList runat="server" ID="btnAcceptReject" RepeatDirection="Horizontal" CssClass="checkboxlist borderless" ValidationGroup="data" AutoPostBack="true" OnSelectedIndexChanged="btnAcceptReject_SelectedIndexChanged">
<asp:ListItem Text="The edition is hereby validated for conformity to standards" Value="0" Selected="True"></asp:ListItem>
<asp:ListItem Text="The edition does not meet standards and still has to be reviewed" Value="1"></asp:ListItem>
</asp:RadioButtonList>
<asp:RequiredFieldValidator ID="vldAcceptReject" ControlToValidate="btnAcceptReject" runat="server" CssClass="text-error" Text="please check an option" ValidationGroup="data"></asp:RequiredFieldValidator>
<asp:Panel runat="server" ID="pnlControls">
I reviewed my code and markup over and over and it does not seem there's anything missing, this should run out of the box! i've been reading a lot online however about issues that controls like RadioButtonList and CheckBoxList have with ajax postbacks. does anyone know how to solve this?
You should move the radio button list inside the pnlControls ajax panel. Then It should not do the postback.

Passing a document entity to JavaScript functions

This is an elementary problem (I think), and I am embarrassed to ask it here. It may have been answered already, but I could not find it my searches.
In its simplest form, there are two check-boxes, and each CheckBox has a control (e.g, TextBox or DropDownList) associated with it. When the checked state of a CheckBox changes, the associated control must be enabled or disabled.
JavaScript function:
<script type="text/javascript:>
function enable(bValue, control)
{
document.getElementByID(control).Enabled = bValue;
}
</script>
I'd call this function as an event procedure, e.g, enable(this.Checked, "expJob") and enable(this.Checked, "itemJob"), in the HTML below:
<body>
Billable? <asp:CheckBox ID="expBillable" runat="server" Checked="false" OnCheckedChanged="enable(this.Checked, "expJob");" />
to <asp:DropDownList ID="expJob" runat="server" Enabled="true" />
<br /><br />
Billable? <asp:CheckBox ID="itemBillable" runat="server" Checked="false" OnCheckedChanged="enable(this.Checked, "itemJob");" />
to <asp:DropDownList ID="itemJob" runat="server" Enabled="true" />
The problem is that, because of the use of quotes, I am unable to specify the "expJob" parameter in the HTML. Even the use of single quotes does not work.
So the question: Will this approach work? What is the proper syntax?
What is the best way to write and use a function such as this? I am sure such function use will be required when having to iterate over the rows in a grid.
Interestingly, all the questions/answers I have seen use a control's disabled attribute. I am only able to use the Enabled attribute. Can someone explain why, and what the difference is?
You have to use the single quotes ('itemJob')
I think OnCheckChanged is a server event. Asp.net needs a handler in the code behind when you want to use this. Thats why you are getting an error. Find the correct client side event when you want to fire a client side event. Take care of firing postbacks, but default for checkbox is "no auto postback" anyway.
Please be aware that javascript is case sensitive so
document.getElementById is good,
document.getElementByID is bad (note the ID in caps is bad)

UpdatePanel does not fire on first click of link button

I have an update panel on an .aspx page. Within this aspx page I have a few ascx controls. One of the controls has my link button. When that button is pressed I'd expect to get the results I intend to get, but I expect to not see a page flicker or see the page postback. It does both. After I change some search information and click the link button again the page does an async postback (which is what I expected on the first click). After running this sequence through fiddler I see that the first time I click the button I am missing some information that is included in all subsequent requests.
ctl00$ScriptManager1=ctl00$cplContents$updatePanelOrderSearch|ctl00$cplContents$ucOrderSearchControl$btnRange&EVENTTARGET=ctl00%24cplContents%24ucOrderSearchControl%24btnRange&.....
Above is what I get on clicks 2, 3, etc.. This is not in the request when I click on the link button the very first time. Im wondering if this is why I am get a full, non async postback the first time.
Any help would be appreciated. My update panel code is below.
<asp:UpdatePanel ID="updatePanelOrderSearch" runat="server" UpdateMode="Always" ChildrenAsTriggers="true">
<ContentTemplate>
<uc:control1 "this control has the link button" />
<hr />
<div id="SearchResults">
<div id="SearchResultsMessage">
<asp:Literal ID="lblMessage" Text="No orders found" Visible="false" runat="server" />
</div>
<uc:contorl 2 />
</div>
<uc: control3 />
</ContentTemplate>
</asp:UpdatePanel>
Thanks
this was an issue from months ago and we wound up not using this solution

Resources