9

You can set your minDate or maxDate in order to limit your calendar. <script> require([ "jquery", "mage/calendar" ], function ($) { $("#My_ID").calendar({ showsTime: false, hideIfNoPrevNext: true, buttonText: "<?php echo __('Select Date') ?>", minDate: new Date(), ...


9

You should pass date in below format. <input type="date" value="04-07-2016" class="type-date hasDatepicker mage-error" max="20-07-2016" min="20-07-2011" name="date-854" aria-invalid="true"> <script> require(["jquery","mage/calendar", "mage/validation"], function($){ var min = new Date("June 13, 2016"), max = new Date("July ...


8

Here I got the solution: <div class="control customer-dob"> <input type="text" class="input-text required-entry hasDatepicker" id="calendar_inputField" name="dob" aria-required="true" /> <script> require([ "jquery", "mage/calendar" ], function ($)...


5

I have used the spanish calender in magento Try this codes jQuery jQuery(function($){ $.datepicker.regional['es'] = { closeText: 'Cerrar', prevText: '&#x3c;Ant', nextText: 'Sig&#x3e;', currentText: 'Hoy', monthNames: ['Enero','Febrero','Marzo','Abril','Mayo','Junio', 'Julio','Agosto','Septiembre','Octubre','Noviembre','...


4

It seems you are mixing up Magento 1.x and Magento 2. The code you posted is for Magento 1.x: Calendar.setup({ inputField : 'store_date', ifFormat : '%m/%e/%y', button : 'store_date_trig', align : 'Bl', onSelect: function(dateText,selectedDate) { console.log(selectedDate); } }); According to the docs the Magento 2....


4

Have not done this myself, so this is a guide to get you in the right direction. the calendar used by magento is located here : /js/calendar/calendar.js, and from its header comments, you will find it is done by http://www.dynarch.com/, and the docs is located here : http://www.dynarch.com/jscal You will see there is built in functionality (via a callback) ...


3

Simply add data bind to input field following way. <input data-bind="datepicker: true" /> Change js code for Learning/AdditionalShippingBlock/view/frontend/web/js/view/checkout/shipping/additional-block.js define([ 'jquery', "underscore", 'ko', 'uiComponent', 'mage/calendar' ], function ($, _, ko, Component, calendar) { 'use ...


2

Now We will DISABLE past Dates. Solution: app/code/core/Mage/Core/Block/Html/Date.php (it is advisable to add custom calendar template, as in any upgrade you will lose your modifications) Use the folowing to disable the previous dates: //<![CDATA[ var calendarSetupObject = { inputField : "' . $this->getId() . '", ...


2

Adding the following to your calander setup will disable all dates that are not 4 days in the future. disableFunc : function(date) { var today = new Date(); today.setDate(today.getDate()+4); return (date <= today); } Though I would still validate on the php side as the user could work around the calendar input type.


2

<script type="text/javascript"> Calendar.setup({ inputField : '_dob', ifFormat : '%m/%e/%y', button : '_dob_trig', align : 'Bl', singleClick : true, disableFunc: function(date) { var now= new Date(); if(date.getFullYear()<now.getFullYear()) { return true; }...


2

<script type="text/javascript"> Calendar.setup({ inputField : 'cal_date', range: [Date(),2014], ifFormat : '%m/%e/%y', button : 'date_from_trig', align : 'Bl', singleClick : true, weekNumbers: false, disableFunc: function(date) { var today = new Date(); var dd = today.getDate(); var mm = today....


2

Now We will DISABLE past Dates. Solution: app/code/core/Mage/Core/Block/Html/Date.php (it is advisable to add custom calendar template, as in any upgrade you will lose your modifications) Use the folowing to disable the previous dates: //<![CDATA[ var calendarSetupObject = { inputField : "' . $this->getId() . '", ...


2

Calendar.js is use for date input for custom product options (during product creating in Admin add/edit product) To remove the css from you header on your product detail page (Assuming that you don't have any custom product attribute that is of date input type). Take a look at catalog_product_view /app/design/frontend/base/default/layout/catalog.xml In ...


2

See if this does the trick:- <action method="removeItem"> <type>js</type> <name>calendar/calendar.js</name> </action> Edit Organise like this:- <default> <block type="page/html_head" name="head" as="head"> <action method="removeItem"> <type>js</type> ...


2

use this code:- <link rel="stylesheet" href="jalalijscalendar/skins/aqua/theme.css"> <script src="jalalijscalendar/jalali.js"></script> <script src="jalalijscalendar/calendar.js"></script> <script src="jalalijscalendar/calendar-setup.js"></script> <script src="jalalijscalendar/lang/calendar-fa....


2

Apparently, editing all the CSS files in /public_html/js/calendar will fix the problem. You have to edit the color code anywhere where it mentions weekend to: 000


2

ok... so the last idea I came up with was to include the following script inside .phtml file, and not use the data-mage-init attribute anymore: <form action="" method="POST"> <label for="name">Name: </label> <input type="text" id="name" name="name"/><br> .... <label for="birthdate">Birth date: </...


2

I propose you this solution with Bootstrap Datepicker, Demo: JsFiddle <!--Html part--> <div class="input-append date" id="datepicker" data-date="" data-date-format="mm-yyyy"> <input type="text" readonly="readonly" name="date" > <span class="add-on"><i class="icon-th"></i></span> <...


2

Hi you can this code for disable dates var disableddates = ["20-06-2016", "12-06-2016"]; // assign your database dates function DisableSpecificDates(date) { var string = jQuery.datepicker.formatDate('dd-mm-yy', date); return [disableddates.indexOf(string) == -1]; } jQuery("#My_ID")....


2

$( "#noSunday" ).datepicker({ beforeShowDay: noSunday }); function noSunday(date){ var day = date.getDay(); return [(day > 0), '']; };


1

I created calendar.js in new mymodule: require([ "jquery", "mage/calendar" ], function($){ $("#period_date_start").calendar({ dateFormat: "M/d/yy", showsTime: true, timeFormat: "HH:mm:ss", sideBySide: true, closeText: "Done", selectOtherMonths: true, onClose: function( selectedDate )...


1

Ok, I am not sure I am understanding exactly what you are trying to do to be honest.. However, in terms of javascript integration with Magento 2, I think the below may help: in your phtml, I'd expect options_4_date to be a html element. And in Magento 2, we need the script to be using the json type declaration I put below. the notation "...


1

Please, try : <layout> <catalog_product_view> <reference name="head"> <action method="removeItem"><type>js_css</type><name>calendar/calendar-win2k-1.css</name></action> </reference> </catalog_product_view> <catalogsearch_advanced_index> &...


1

I solved this problem adding Magento\Framework\View\Element\Html\Calendar to the layout of required page. For example in your customer_account_edit.xml layout you should add the following <?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/...


1

Depending on how many shipping options you need to provide, you may be able to use something like this flat rate shipping extension which adds 5 extra options to your shipping methods area with customizable cost, country filters, and custom HTML areas. I have a similar extension on my site from a different developer, but can't find the original files or ...


1

In order to properly erase calendar.css, you need to create a module. Inside your layout update xml file, you need to add this: File : app/design/{frontend|adminhtml}/base/default/layout/{layout_update_xml_file}.xml <layout> <default> <reference name="head"> <action method="removeItem"><type>js_css</...


1

You need to add following file in your page using xml. <action method=”addItem”><type>js_css</type><name>calendar/calendar-win2k-1.css</name><params></params></action> <action method=”addItem”><type>js</type><name>calendar/calendar.js</name></action> <action method=”...


1

If someones looks for that code in xml here is it: <item name="children" xsi:type="array"> <item name="schedule" xsi:type="array"> <item name="sortOrder" xsi:type="string">10</item> <item name="component" xsi:type="string">Magento_Ui/js/form/element/abstract</item> <item name="config" xsi:...


1

Looking at the Magento\CatalogSearch\Block\Advanced\getDateInput() function I came up with this code which works well and is probably more "correct" than the current answer. echo $this->getLayout()->createBlock('Magento\Framework\View\Element\Html\Date' )->setName( 'date-range[from]' )->setId( 'from-date' )->setValue( '' )->setImage( ...


1

Yes I did it a few years ago, the functionality is too complex to include entire here but i can give you an idea of how i resolved it: First I used the special_price to apply the prices and keep untouched the base price then... I used a table to save the programmed prices, an csv file uploader, and a backend grid to display them (with flag to display which ...


Only top voted, non community-wiki answers of a minimum length are eligible