im trying to make textbox which will handle different dates. For that im using ajaxtoolkit so that when a user clicks on the textbox a popup calender will appear beneath the textbox. I have managed to do that but the problem is that it only shows arond 18 days of the month and i would like to show all of the days in a month. I'm attaching a picture so you can see how it looks.
Here is the code:
<td><asp:TextBox ID="txtValidFrom" runat="server"TextMode="DateTime" >
</asp:TextBox></td>
<ajaxToolkit:CalendarExtender ID="CalendarExtender1" runat="server" TargetControlID="txtValidFrom" FirstDayOfWeek="Monday" Format="dd/MM/yyyy" >
</ajaxToolkit:CalendarExtender>
It seems your CSS rules conflict with Calendar CSS rules.
You can strip all custom CSS to see that Calendar renders correctly and determine what code actually affects Calendar's CSS.
Related
I need to make a textbox that will select date range. It needs to display two calendars (Start Date and End Date) when it gets clicked. I am using Ajax control toolkit but it shows only one calendar and when I add two calendars with same TargetControlID, it still shows one calender.
<asp:TextBox ID="startDate" Text="Start Date" ReadOnly="False" EnableViewState="True" CssClass="calendar" runat="server">
</asp:TextBox>
cc1:CalendarExtender EnabledOnClient="True" DefaultView="Days" PopupButtonID="calenderopener"
ID="startDate_CalendarExtender" StartDate="Jan 15, 2014" CssClass="ajax__calendar ajax__calendar_container" EnableViewState="True"
runat="server" BehaviorID="calendar1" Enabled="True" TargetControlID="startDate" Format="MM/dd/yyyy">
</cc1:CalendarExtender>
I want to show two calendars when this textbox gets clicked.
Try this. This allows you to select multiple dates to single control(Textbox). If you want to use date range (only two days are selectable) then you shoud have to validate it in your code behind.
http://www.obout.com/calendar/tutorial_select_multipledates.aspx
I have an asp.net page with a an html5 TextBox control set as the "date" type. The control on my page looks like this:
<asp:TextBox ID="TextBoxMyDate" runat="server" type="date"/>
It works great in the page and I can click on it and set the date. I can also read the date through TextBoxMyDate.Text. However, I cannot figure out how to programaticaly set the date. I have tried various formats of:
TextBoxMyDate.Text = DateTime.UtcNow.ToString("MM/dd/yyyy")
TextBoxMyDate.Text = DateTime.UtcNow.ToString("MM/dd/yyyy")
My guess is that its much more complicated than simply setting the text value but I don't know where to go from here. Any suggestions?
This is actually the correct way to set the date but the format was wrong!
TextBoxMyDate.Text = DateTime.UtcNow.ToString("yyyy-MM-dd");
I was confusing how the browser displays the date and the html5 standards for this control!
Yes, it is quite possible. Here is an example of a date selection filter with ajaxcontrotoolkit and the textbox field.
Overview:calendar ajaxControlToolkit Overview
Tutorial:Tutorial ajaxControlTollkit Date textbox
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</asp:ToolkitScriptManager>
<asp:TextBox ID="txtStartDate" runat="server"></asp:TextBox>
<asp:CalendarExtender
ID="CalendarExtender1"
TargetControlID="txtStartDate"
runat="server" />
I have a textbox in the webpage.
//.aspx
<td class="style2">Start of Date:<asp:TextBox ID="TextBox1" runat="server"
Height="22px"
ontextchanged="TextBox1_TextChanged" Width="157px"></asp:TextBox>
</td>
//aspx.cs
protected void cntCalendar_SelectionChanged(object sender, EventArgs e)
{
TextBox1.Text = cntCalendar.TodaysDate.ToShortDateString();
}
Now I'm able to take the value in the textbox from calendar,but my problem is I'm not able to get the calendar to show onclick in the textbox and hide after date selected.
Can anybody help me with this please.
Use the CalendarExtender class from the ASP.NET AJAX ToolKit.
Download and usage
You shouldn't do the post backs for the selecting date.
Sounds like you want to use something like the AJAX calendar extender. This control will negate the need of the asp:Calendar control.
See below for an example.
<asp:TextBox ID="txtStartDate" runat="server" CausesValidation="true" >
</asp:TextBox>
<ajax:CalendarExtender ID="ce1" runat="server" Format="dd-MM-yyyy" TargetControlID="txtStartDate" PopupPosition="Right" >
</ajax:CalendarExtender>
The calendar will popup on click and when a date is selected, the textbox will be populated with the date selected in the format specified in the Format attribute
VMAtm is right on with the CalendarExtender.
However, if you have your own custom calendar you're using and you just need to manually pop that up via client onclick of the textbox, do this in Page_Load or PreRender:
TextBox1.Attributes["onclick"] = "showMyCalendar();";
or
TextBox1.Attributes[HtmlTextWriterAttribute.Onclick] = "showMyCalendar();";
I have an ASP.net page.
That has an Ajax Toolkit Tab Control.
That has tabs.
That have custom ascx controls I wrote.
I have a text box that perform a search action. It is declared like this:
<asp:TextBox ID="txtPrereqSearch" runat="server"
ontextchanged="txtPrereqSearch_TextChanged"></asp:TextBox>
Nothing fancy. This format has been working for months. There's no submit button. It just posts back when I hit enter. The problem appeared when I added a second custom control using the same type of feature. Now browsers don't postback when I type something in either of these textboxes and press enter.
It seems that browsers have a default way of handling one textbox in one form, but that behavior changes when the number reaches two.
Is there an easy way around this? I guess I can create a hidden submit button but it seems like there is probably a better way to deal with this when the functionality is in two separate custom controls.
Your feedback is appreciated!
Check this out: http://www.allasp.net/enterkey.aspx
The default behavior with no submit button seems to depend on the browser, and the behavior can indeed depend on the number of input controls.
I would add hidden "submit" button (e.g. style="display:none;") which should ensure that it always gets submitted.
The answer was a little different than I expected, but philosophically like my original idea that #jamietre reinforced.
I had to surround the controls with an <asp:Panel> tag with a DefaultButton attribute. A-like-a so:
<asp:Panel ID="ButtonPanel" runat="server" DefaultButton="btnSubmit">
<asp:Label ID="Label1" runat="server" Text="Course:"></asp:Label>
<asp:TextBox ID="txtPrereqSearch" runat="server"
ontextchanged="txtPrereqSearch_TextChanged"></asp:TextBox>
<asp:TextBoxWatermarkExtender ID="txtPrereq_TextBoxWatermarkExtender"
runat="server" Enabled="True" TargetControlID="txtPrereqSearch"
WatermarkCssClass="Watermark" WatermarkText="e.g., MATH201"></asp:TextBoxWatermarkExtender>
<asp:Button ID="btnSubmit" CssClass="InvisibleSubmit" runat="server" Text="Submit" OnClick="txtPrereqSearch_TextChanged"/>
</asp:Panel>
I've got a very simple form with the following troubled snippet:
<asp:Panel class="normal" ID="Panel1" runat="server">
<strong><asp:Label ID="Panel1Error" class="error" Visible="false" runat="server"/></strong>
<label for="TextBox1"><em>*</em> Don't leave this blank</label>
<asp:TextBox ID="TextBox1" runat="server" />
<asp:RequiredFieldValidator ID="TextBox1RFV" runat="server"
ControlToValidate="TextBox1" ErrorMessage="This field cannot be blank."
Display="None" />
<--- other validators --->
</asp:Panel>
There are two things I want to do when the page fails validation:
Change the style of Panel1 (to one which shows different colors to indicate an error). I was able to do this by calling Page.Validate in Page_Load, then iterating over Page.Validators, getting each validator's parent control, casting it to a Panel, then setting .CssClass Doesn't seem like a superb solution, but it got the job done - is there a better way?
I want to take whatever validation error(s) are thrown and put them in the Panel1Error label, as well as set it to visible. This is where I am a bit baffled. I thought at first I could possibly specify the Label in which a validator writes its ErrorMessage, but I had no such luck. If I just toss the validator inside the Label, its formatting messes up the entire layout of the page, regardless of whether I directly assign it the 'error' CSS class or just leave it in the Label.
Just to clarify, in production, I would be doing this process for multiple Panels on a page, each with one form element, preventing me from calling the Panels explicitly and just saying Panel1.CssClass, etc.
I would recommend a javascript solution. ASP.NET injects a global js variable called Page_Validators, which is an array of all of the validator spans on the page. I wrote about this on my blog. It's a different solution, but it should give you enough insight to get started.
Use ValidationSummary controls with a ValidationGroup for each panel.
Seems fine if it worked.
Use a ValidationSummary control. Or you can inherit from the controls and override the render event.