I am building an ASP.NET website, and in the aspx markup page i put in a JQuery datepicker.
I also set default values, and on the FE side it looks ok, the text box is always populated with the selected date.
However when im trying to use the text values in the text box, it acts like there's nothing there.
This is my JS function in the ASPX page
<script type="text/javascript">
$(function () {
//console.log($("[id$=txtFromDate]"));
//console.log($("[id$=txtToDate]"));
$("[id$=txtFromDate]").datepicker();
$("[id$=txtToDate]").datepicker();
//init date format
$("[id$=txtFromDate]").datepicker({ dateFormat: 'mm/dd/yy' });
$("[id$=txtToDate]").datepicker({ dateFormat: 'mm/dd/yy' });
//init default date
var FromDate = new Date();
FromDate.setMonth(FromDate.getMonth()-1)
$("[id$=txtFromDate]").datepicker('setDate',FromDate);
$("[id$=txtToDate]").datepicker('setDate','today');
});
How can i work with the datepicker from the code-behind C#?
Replace
$("[id$=txtToDate]").datepicker('setDate','today');
with
var Today = new Date();
$("[id$=txtToDate]").datepicker('setDate',Today);
and then in code behind you can use this code
Request.Form["txtToDate"]
"txtToDate" is your input box Name and don't use input box id;
Related
I have a datepicker in my UI. using that I can select date. My probelem is how can I get that selected date into my backend which is developing in java.
Can it do using javascript or any other method.
This is my code
<input type="text" class="form-control pull-right" id="datepickerlog">
<script>
$('#datepickerlog').datepicker()
</script>
var selectedDate = $("#datepickerlog").val();
This will read the date from your text input and assign it to the variable "selectedDate".
Edit: Place it inside your datepicker like this to assign date to variable when datepicker is closed:
$('#datepickerlog').datepicker({
onClose: function (dateText) {
var selectedDate = $("#datepickerlog").val();
}
});
Edit #2: To avoid problems with your script not doing what you expect, I suggest putting all jQuery code inside this function:
$( function() {---your code here---});
This way you can be sure that your script only runs after the page is loaded and ready for script execution.
I have 2 text boxes namely fromDate & toDate for date search , in which by default, current day will be showed.
working code:
Jquery
(document).ready(function () {
$('.dateClass').datetimepicker({timepicker: false}); // css for displaying date without time
$('#fromDateId').datetimepicker({value: '01-01-2016', format: 'd-M-Y'}); // display current date with dd-mmm-yyyy
$('#toDateId').datetimepicker({value: '01-01-2016', format: 'd-M-Y'}); // display current date with dd-mmm-yyyy
});
Struts
<html:text property="fromDate" styleId="fromDateId" styleClass="dateClass" />
<html:text property="toDate" styleId="toDateId" styleClass="dateClass" />
Issue:
By default current day shown in both textboxes, suppose user choose different dates and submit,
db records are fetched and displayed but these 2 texboxes replaced with current dates how to avoid this.
kindly help me to resolve.
Update: There are reports this no longer works in Chrome.
This is concise and does the job:
$(".fromDateId").datepicker('setDate', new Date());
And another thing,
$(function()
{
$('.date-pick').datePicker().val(new Date().asString()).trigger('change');
});
I'm adding this input field via an external .js file on clicking a button. This is added every time a button is clicked.
<input name="new" id="date" type="text" value>
I want to append the Jquery-ui datepicker to this field.
Here's the code I'm using right now but class="hasDatepicker" isn't getting associated with the new field that's added when I inspect it using the console.
$('[name="new"]').datepicker({
maxDate: '+0d',
dateFormat: 'yy/mm/dd'
});
I want to select this by name and not id as the id's will be unique for each field that's added.
The datepicker is added to other fields on my page so it should work here as well.
I also want to append class="btn btn-darkgrey" to make the input field into a button via Jquery.
Try like
$('input[name="new"]').datepicker({
maxDate: '+0d',
dateFormat: 'yy/mm/dd'
});
Working FIDDLE
As you said every time input field added when button gets clicked.
so , where you added the new input field at that place you have to initialize input with datepicker. That means on button click, you added code to insert new input field below that you have to find input by
$input = parent_element.find('input[name="new"]').last().
Here parent_element = in which you are appending/inserting your new input.
And initialize that input.
$input.datepicker({
maxDate: '+0d',
dateFormat: 'yy/mm/dd'
});
Try this. hope it will work for you.
Is there a way to set the calendar extender, or a method I can call so it always displays the month containing the selected date when the target textbox is clicked? I have found the method to set the selected date, but this does not automatically bring the month of the selected date into view.
You can handle the onClientShown event:
<cc1:calendarextender ID="Calendarextender1"
OnClientShown="clientShown" ...
For example:
<script type="text/javascript">
function clientShown(sender, args) {
var extender= $find('Calendarextender1');
sender.set_visibleDate(extender._selectedDate);
// the following is just to show you some other interesting methods
//sender.set_todaysDate(extender._selectedDate);
//sender.set_selectedDate(extender._selectedDate);
}
</script>
I'm afraid there's no documentation, so try them out.
I'm trying to have my Jquery UI Date Picker insert YYYY/MM/DD format (due to SQL limitations). I see the options on the Jquery site, but can't get it to work. Below is my working code (without Alt Date). It's in a div that is hidden initially so it needs live():
$(function() {
$('.datepicker').live('focus', function () {
var picker = $(this).datepicker({showOn: ''});
picker.datepicker("show");
});
});
Any help?
You need to add "option", "dateFormat", "yy/mm/dd" to your datepicker call.
var picker = $(this).datepicker({dateFormat: "yy/mm/dd", showOn: ''});
This will make datepicker format the date value selected as 2011/08/22.