Рекомендуемые сообщения

Здравствуйте, добрые форумчане)

Очень нужна Ваша помошью Нужно сделать такой календарь с выбором диапазона дат и выводом ниже, совершенно не вижу выхода

Прикрутила плагин Jquery datapicker но он дает только выпадающее меню у инпута

Очень надеюсь на Ваашу помощь

календарь.png

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Прикрутила плагин Jquery Data picker по он дает выпадающее окно у инпута

в правильном ли направлении я иду и как сделать такой календарь? для выбора диапазона дат и выводом их числа 

календарь.png

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Мне нужно сделать блок с таким календарем и что бы внизу под календарем выводилось  количество дней, а в самом календаре можно было выбирать диапазон дат, совсем не знаю как реализовать, в этом и весь вопрос) 

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Надо поподробней всё расписать. 

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Выбирать диапазон дат, в вашем случае, это держать shift и кликать по числам? 

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

нужно реализовать такой блок с календарем, в котором можно выбрать количество дней и они отобразятся под ним

как в авиакомпаниях например) я нашла только плагин datapicker, но у него выпадающее окно с календарем при нажатии на инпут, как убрать инпут и сделать календарь постоянно видимым? и в datapicker если нужно выбрать промежуток между двумя датами топри нажатии на инпут показывает сдвоенный календарь

Правильно ли я вообщ решила делать это через этот плагин и есть какие варианты его исполнения? простите пожалуйста за кривизну вопроса

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

нет это просто от первой даты до второй даты и что бы на календаре было выделение цветом выделенных дней

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Добрый день! Вы бы выложили, что уже есть, и прислали ссылку. Попробую посмотреть.

PS Не совсем поняла, зачем две одинаковые темы?.. Вот Вы еще создали, хотя вопрос тот же

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
2 часа назад, LizzyEra сказал:

Мне нужно сделать блок с таким календарем и что бы внизу под календарем выводилось  количество дней, а в самом календаре можно было выбирать диапазон дат, совсем не знаю как реализовать, в этом и весь вопрос) 

Вот так? https://jsbin.com/yahuxapinu/edit?html,css,js,output

Плагин из примера https://chmln.github.io/flatpickr/

  • Like 2

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

даааа! Спасибо огромное! Вы невероятно мне помогли)

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Создайте аккаунт или войдите в него для комментирования

Вы должны быть пользователем, чтобы оставить комментарий

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас


  • Похожие публикации

    • Автор: d0ublezer0
      мне в руки от предыдущего разработчика попался код, которые забирает JSONP данные для построения списка на jquery UI autocomplete, выводит его и при выборе помещает результат в поле формы
      используется для ввода города в корзине https://www.resursmed.ru/cart
      запрос данных такого типа https://api.cdek.ru/city/getListByTerm/jsonp.php?q=нижний 
      мне непонятны некоторые вещи: зачем выполняется перебор массива в success и select?
      и, можно ли сделать выбор первого значения списка при потере фокуса автозаполнялки, если в ней не ткнули в значение?
      change и blur в конце (на событие select) сделаны видимо чтобы запустить дальнейшую обработку onblur=javascript:Onepage.op_runSS(this);
      $j("#city_field").autocomplete({ noSuggestionNotice: "Населённые пункты не найдены", autoSelectFirst: true, autoFocus: true, minLength: 2, source: function (request, response) { $j.ajax({ url: "https://api.cdek.ru/city/getListByTerm/jsonp.php", dataType: "jsonp", data: { q: function () { return $j("#city_field").val() } }, success: function (data) { response($j.map(data.geonames, function (item) { Object.getOwnPropertyNames(data.geonames).forEach(function (val, idx, array) { Object.getOwnPropertyNames(data.geonames[val]).forEach(function (val2, idx2, array2) { }); }); try { if (item.postCodeArray[0] !== 0 && item.postCodeArray[0] !== 'undefined' && item.postCodeArray[0] !== null) { found_zip = item.postCodeArray[0]; zip_array[zip_line] = []; zip_array[zip_line][0] = zip_line; zip_array[zip_line][1] = item.id; zip_array[zip_line][2] = item.postCodeArray[0]; zip_line++; } } catch (err) { // обработка ошибки } return { label: item.name, value: item.name, id: item.id } })); } }); }, select: function (event, ui) { $j('#receiverCityId').val(ui.item.id); //пробегаемся по массиву, чтобы вывести индекс в поле for (var i = 0; i < zip_array.length; i++) { if (ui.item.id == zip_array[i][1]) { $j("#customer_note_field").empty(); $j('#address_2_field').val(zip_array[i][1]).focus().change().blur(); $j('#zip_field').val(zip_array[i][2]).focus().change().blur(); } } } });  
    • Автор: Ospna
      Решил анимировать иконки, нашел пример в интернете, скопировал

      в Safari Версия 11.0.2 (13604.4.7.1.3), в мобильных Safari и Chrome все отображается отлично

      но почему-то иконки неправильно отображаются в Chrome Mac (Версия 63.0.3239.132 (Официальная сборка), (64 бит), Chrmoe Windows и Edge - на переднем плане анимированный градиент, а на заднем иконка
       
      пример кода
      пример того как должна выглядеть анимированная иконка во вложении
      Screen Capture 2018-01-10 06.49.14.mov
    • Автор: qa24
      Здравствуйте!
      Оцените пожалуйста верстку. Если есть ошибки, напишите как правильнo будет.
      Ссылка на сайт  wor.swema.ru