I implemented a datepicker inside my web forms application.
I tested it on one form, and it was working. The code of the TextBox was:
<asp:TextBox runat="server" class="fieldset__input js__datepicker picker__input" type="text" id="TbDate" aria-haspopup="true" aria-expanded="false" aria-readonly="false" />
I tried to add the same textbox to another form but it wasn't triggering.
The other form had the same master page. I copied all the code aspx from the first form to the new one and it was working.
I tried deleting one line at a time to see why the datepicker was working with this code, and found that this line is needed to enable it:
<asp:TextBox runat="server" ID="tbEmail" CssClass="form-control" TextMode="SingleLine" />
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="tbEmail" ErrorMessage="The username/email field is required."/>
I want the datepicker to open when i click on the tbDate TextBox, but it only works if the RequiredFieldValidator for the TextBox tbEmail is present. If i delete the validator, the datepicker won't open on the tbDate TextBox. The Validator checks if the input of tbDate is an email format, so there is no connection to the tbDate TextBox.
Also, i tried to delete the other TextBox, and attach the fieldValidator to the tbDate TextBox, and it also works.
I don't understand how this RequiredFieldValidator is helping the datepicker to open, especially inside another textbox?
Understanding this would help me implementing it on other forms.
Thank You!
Not sure which datepicker plugin you are using but the markup for the datepickers are not the same.
<asp:TextBox runat="server" class="fieldset__input js__datepicker picker__input" type="text" id="TbDate" aria-haspopup="true" aria-expanded="false" aria-readonly="false" />
is not the same as
<asp:TextBox runat="server" ID="tbEmail" CssClass="form-control" TextMode="SingleLine" />
you are missing the classes fieldset__input js__datepicker picker__input in the second datepicker which might be selectors for the JS script that's initializing the datepicker. Try adding that and see if it works without the RequiredFieldValidator.
Related
I want to prevent open calendar control on save button at time of validation fire , I am not able to find how can I prevent It
I have one calendar control in form , select date validation fire on save button after validation it will direct focus on calendar control and open calendar automatically , business don't want to open calendar control
HTML
<div class="col-lg-3 col-md-4 col-sm-6">
<div class="form-group datepicker">
<label>Project Start Date </label>
<asp:TextBox ID="ProjectStartDate" TabIndex="27" ClientIDMode="Static" runat="server" CssClass="form-control"></asp:TextBox>
<asp:HiddenField ID="hdnProjectStartDate" runat="server" Value="" />
</div>
</div>
I want to prevent open calendar open on save button
let me know if any solution over there
Thank you
I have solve this issue to change in formValidation.JS
In this file there is one function
// Determined the first invalid field which will be focused on automatically
var ns = this._namespace;
for (var i = 0; i < this.$invalidFields.length; i++) {
var $field = this.$invalidFields.eq(i),
autoFocus = this.isOptionEnabled($field.attr('data-' + ns + '-field'), 'autoFocus');
if (autoFocus) {
// Focus the field
//$field.focus();
return false;
break;
}
}
On validation it will auto focus that element & after focus calendar control will
open automatically because of focus
Comment this line for prevent focus on calendar control
$field.focus();
Thank you !!
What calendar or date picker control are you using? jQuery UI, Telerik AJAX, Control Toolkit AJAX, Kendo?
For a general ASP.NET validation scenario, the textbox won't be focused automatically. You will need to set the following property to True explicitly do to that:
SetFocusOnError="true"
<asp:TextBox runat="server" ID="ProjectStartDate"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="* Required"
ForeColor="Red" ControlToValidate="ProjectStartDate" SetFocusOnError="false">
</asp:RequiredFieldValidator>
<asp:Button ID="Button1" runat="server" Text="Submit" />
You can check your code-behind whether you have defined this property somewhere.
I am trying to get a javascript function to work properly with my asp.net controls. I have two radio buttons and three textboxes.
When the first radio button is clicked I would like to disable the third textbox and when the second radio button is clicked I would like to disable the third text box. See the attachment for a screenshot.
I have tested that the function works by adding "OnClick" to the first radio button and setting AN ALERT WHICH IS WORKING.
However, I am not sure how to pass the controls in to the function to have access to them. Anyone know how to do this?
Screenshot
ASP.NET
<asp:RadioButton ID="RadioButton1" runat="server" Checked="True" GroupName="DateTimeQuery" OnClick="TimeRangeClickEvent()"/>
<asp:TextBox ID="startdatetext" Enabled="true" runat="server" MaxLength="10"></asp:TextBox>
<asp:TextBox ID="enddatetext" Enabled="true" runat="server" MaxLength="10"></asp:TextBox>
<asp:RadioButton ID="RadioButton2" runat="server" GroupName="DateTimeQuery" OnClick="TimeRangeClickEvent() />
<asp:TextBox ID="withinthepast" Enabled="true" runat="server" Text="1"></asp:TextBox>
Javascript
<script>
function TimeRangeClickEvent(How do I pass asp.net controls here)
{
alert('Working');
}
</script>
You should use ClientID control properties to get IDs of HTML elements and then work with them from Javascript. More info.
In Javascript:
var radio1 = document.getElementById('<%=RadioButton1.ClientID%>');
When you have all your HTML elements you just need to handle necessary change/clicked/selected events in javascript to make it work.
again experts,
On page loade, this dropdownList box, by deffault is invisible.
<td>
<asp:DropDownList ID="LongDistance" runat="server" style="display:none;" >
<asp:ListItem value="2">$2 per mile</asp:ListItem>
<asp:ListItem value="4">$4 per mile</asp:ListItem>
</asp:DropDownList>
<asp:RequiredFieldValidator runat="server" id="RequiredFieldValidator4"
ControlToValidate="tripType" ErrorMessage = "please select long distance type!"
display="Dynamic" style="color: #FF0000; font-size: small" />
</td>
It becomes visible if certain condition is met.
My question is why is the user still being challenged to make a selection?
I would like for any invisible controls to NOT challenge user to make a selection unless the control is visible.
Any ideas how to fix this?
You should look for validation Groups. If you have to validate differently on two different button.
Validation work as the data is post to the server even if it is not visible. And validation controls work on submit button and validate each input if there is any validation controls is being used.
When you set the visibility of your control, you should also set the Enabled property of the RequiredFieldValidator4 validator to match the visibility of the control it is validating. The Enabled property of the validator controls whether the validation fires.
How can I make postback after user changes textbox text and hits enter ?
Is only javascript real solution. Doesnt asp.net give any out from box solution for such a problem ?
Thank You for any hints.
Beside the javascript solutions, you can place the textbox with a submit button inside a panel and make use of DefaultButton property of the panel.
Below is the code example: -
Your aspx will look like this
<asp:Panel ID="Panel1" runat="server" DefaultButton="Button1">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" />
</asp:Panel>
Now, when you press enter inside the text box the button click event occurs, same as by clicking the button.
Hi
While working on asp, i want if i click on my asp text field, a radio button should be checked, but i dont find any onClick event available for asp text field, and if i use onchange, it is from the server end, i want this situation without page refresh, just like we do in html fields using javascript, please help!!!
Try this one:
HTML:
<asp:TextBox ID="txtSelect" runat="server" Width="200px" Text="Click here"> </asp:TextBox>
<br />
<asp:RadioButton ID="radCheck" runat="server" />
JQUERY:
$("#txtSelect").click(function(){
$("#radCheck").attr("checked",true);
});
OnFocus is probably the event I would use.
You can use Ajax if you don't wanna refresh the page