We Keep Coding

Nepali Date-picker show on document.ready()

I am using a custom calendar datepicker from the following link
http://sajanmaharjan.com.np/nepali-datepicker/
This datepicker seems to be working fine but I am failing to display the date-picker by default when a page loads.
we can display the calendar of jquery with $('#id').datepicker('show'), however above datepicker
doesn't have any such functionality. it can only be accessed only when a user clicks on textbox.
I tried initializing datepicker with an Id of an element
<div id="nepaliDate"></div>
$(function(){
$('#nepaliDate').nepaliDatePicker();
});
Above code doesn't display calendar on page load.
The only code that works is with input type="text" and when we click on the textbox
<input type="text" id="nepaliDate"/>
$(function(){
$('#nepaliDate').nepaliDatePicker();
});
Could any please help me in knowing how can I display the calendar on document.ready or window.load?
Thanks

Get updated date value on outside container click in bootstrap date picker inline (Combodate )

I am using date picker of bootstrap x-editable. Its working fine but I want to customized some of it's functionality. Suppose when we select any date and click on Tick mark then we can show the combined date inside a tag. So I want to get the same functionality onblur also (outside of the container but date should be change).

I think you can use this code into your input text as like that
<input size="16" type="text" value="2012-06-15 14:45" readonly class="form_datetime">
<script type="text/javascript">
$(".form_datetime").datetimepicker({format: 'yyyy-mm-dd hh:ii'});
</script>

Disable Datapicker Calendar icon using Jquery?

I have a table which has a set of data.
Now in my table i have a checkbox for every row that enables or disables row.
When i click on checkbox that specific row should get disabled.
Issue is i am successfully able to disable the datepicker field but the calendar icon still remains enabled.
Below is the code i have been using:
For the datepicker textbox(Works Fine):
$(this).closest('tr').find('.animalBroughtDate').prop('disabled', true);
For the Calendar icon(Not working):
$(this).closest('tr').find('.ui-datepicker-trigger').hide();
HTML:
<input id="animalBroughtDateId" class="animalBroughtDate dtp hasDatepicker" style="width: 100px;" type="text">
<img title="Ok" alt="Ok" src="/../..datePicker.png" class="ui-datepicker-trigger">
Please guide.

Use built in U.I datepicker disable command.
$(this).closest('tr').find('.animalBroughtDate').datepicker("disable");
And in case you want to enable just :
$(this).closest('tr').find('.animalBroughtDate').datepicker("enable");

scrollbar for the dropdown list

I want to show scroll bar for the drop down list so that the user can select any one item from the available list. The drop down menu should show 5 items and a scroll bar to drag and see remaining items in the list when the user clicks on the drop down list. To show the drop down list i am using struts html tag library. Below is the struts html code to show drop down list.
<html:select name="myForm" property="city" styleId="city" tabindex="1" title="Please Select City">
<html:options property="city" labelProperty="city"/>
</html:select>
Do i need to write javascript function to achieve scroll bar for the <html:options>. I cannot use jQuery as my application does not support jQuery libraries. Please suggest how can i achieve this using javascript function.

Simply assign a class to option list and add overflow equal to auto. I simply added with style.
<html:select name="myForm" property="city" styleId="city" tabindex="1" title="Please Select City">

Want to show/hide text box having date picker when certain value is selected from drop down

I have one drop down in which i have value Indian and Others, when i select Others from the Drop down then i want to show three text box in which two are having date picker and the third one is simple text box.
I have written following code in html but i m not getting Date picker in it. Tried a lot. And again when i click on Indian these three text box should hide and at the time of page loading these three text box should be hidden.
I have this following imported file in my jsp for calendar.
visafromdate and visatodate are to be datepicker.
<script language="javascript" src="/js/reseller/popcalendar.js"></script>
<link href="/css/reseller/popcalendar.css" rel="stylesheet" type="text/css">
Following Java script for validation for showing/hiding & date picker
$(".visafromdate").each(function(){
$(this).datepicker();
});
$(".visatodate").each(function(){
$(this).datepicker();
});
$('#nationality').change(function(){
if($(this,':selected').val()=="indian")
{
$('label[for=other_nationality],input#other_nationality').hide();
$('#othernationality').hide();
$('label[for=visa_from_date],input#visa_from_date').hide();
$('#visafromdate').hide();
$('label[for=visa_to_date],input#visa_to_date').hide();
$('#visatodate').hide();
}
if($(this,':selected').val()=="others")
{
$('#othernationality').show();
$('label[for=other_nationality],input#other_nationality').show();
$('#visafromdate').show();
$('label[for=visa_from_date],input#visa_from_date').show();
$('#visatodate').show();
$('label[for=visa_to_date],input#visa_to_date').show();
}
});
$('label[for=other_nationality],input#other_nationality').hide();
$('#othernationality').hide();
$('label[for=visa_from_date],input#visa_from_date').hide();
$('#visafromdate').hide();
$('label[for=visa_to_date],input#visa_to_date').hide();
$('#visatodate').hide();`
And this i have written in the form tag
<label for="visa_from_date">Visa From Date</label>
<input type ="text" id="visafromdate"/>
<label for="visa_to_date">Visa To Date</label>
<input type ="text" id="visatodate"/>
<label for="other_nationality">Other Nationality</label>
<input type ="text" id="othernationality"/>
Can you please help me with it why it is not working?

It appears you are trying to reference the ids as if they were classes. Ids are referenced by hash (#)
Try this
$("#visafromdate,#visatodate").datepicker();