Как реализовать DATE PICKER в PhoneGap/Android?

Я попытался реализовать сборщик даты в android. Я хочу, чтобы получить данные и показать его в текстовом форматеКак реализовать DATE PICKER в PhoneGap/Android?

<html> 
    <head> 
    <script type="text/javascript" charset="utf-8" src="cordova-2.5.0.js"></script> 
    <script type="text/javascript" charset="utf-8" src="datePickerPlugin.js"></script> 
    <script type="text/javascript" charset="utf-8"> 

    function dateTest() { 
     var myNewDate = new Date(); 

     window.plugins.datePicker.show({ 
      date : myNewDate, 
      mode : 'date', // date or time or blank for both 
      allowOldDates : true 
     }, function(returnDate) { 
     var newDate = new Date(returnDate); 
      currentField.val(newDate.toString("dd/MMM/yyyy")); 

      // This fixes the problem you mention at the bottom of this script with it not working a second/third time around, because it is in focus. 
      currentField.blur(); 
     }); 
    } 
</script> 
</head> 
<body bgcolor="#ffffff"> 
<hr>DatePicker Test<hr><br> 
    <input type="button" onClick ="dateTest()" value ="Today's Date!!" /> 
    <div id="view"></div> 
</body> 
</html>

я получаю это как предупреждение ... но не смог сохранить его в виде строки на той же странице

источник

2013-06-21 user

Почему свободно уры голову?

<input type="date"> будет ВСЕГДА deppend на интерпретации устройства этого, в некоторых устройствах Android она даже не работает,

Существует множество плагинов, аддонов, что угодно, для этого,

Я лично, как и использование mobiscroll: Link

Edit: Mobiscroll теперь платный, но есть нагрузки свободного внешнего интерфейса мобильных структур и, вероятно, все они имеют DatePicker, такие как jQuery Mobile-datepicker.

источник

2013-06-21 09:06:40

Enoque Duarte, да, я проверил демо. Я заметил, что вы не можете выбрать дату в СУББОТУ и ВОСКРЕСЕНЬЕ? почему это? – user

У меня есть путаница, следует ли скопировать файлы из [здесь] (https://github.com/acidb/mobiscroll/tree/master/js)? что у нас есть? i remeber..и видел этот сайт вчера .., что ему нужны конкретные JS и некоторые zepto JS и все ... но я не могу найти эту страницу, теперь ... пожалуйста, помогите мне !! – user

уверен, что проблем нет, js и .css вы должны включить deppends в выбранный вами стиль datepicker, также вам нужно включить jquery + jquerymobile, вы можете скачать все файлы здесь: https://github.com/acidb/mobiscroll, Проверьте index.html, сохраните

, удалите все тело, а затем вставьте html + js из костюмированного datepicker, который вы сделали по адресу http://demo.mobiscroll.com/datetime. теперь смотрите в заголовок и за Например, если вы не используете переводы, вы можете удалить все файлы xx.i18n.xx, а затем, если вы используете стилирование iOS, вы можете удалить андроид .css и .js и т. д. –

Это мой рабочая реализация. Тип ввода - текст, только для чтения.

$('.nativedatepicker').focus(function(event) { 
     var currentField = $(this); 
     var myNewDate = new Date(); 
     window.plugins.datePicker.show({ 
      date : myNewDate, 
      mode : 'date', 
      allowOldDates : true 
     }, function(returnDate) { 
      var array = returnDate.split("/"); 
      var day = array[2], month = array[1]; 
      if (day <= 9) 
       day = "0" + day; 
      if (month <= 9) 
       month = "0" + month; 
      currentField.val(array[0] + "/" + month + "/" + day); 
      currentField.blur(); 
     }); 
    });

источник

2013-06-21 08:17:28 witpok

нормально, Есть ли ошибка в коде казнили? в любом случае попробуем этот код и дадим вам знать. – user

witpok, не могли бы вы рассказать мне, как это работает ... У меня это в моем HTML '' Я просто получаю текстовое поле, и я тоже могу ввести алфавиты , – user

вам нужно добавить к входному атрибуту readonly = «readonly», и я получаю фокус, привязывая вход к событию касания. И, кстати, я использую этот вход для android, и я его заменяю на iOS для типа ввода = «дата». Он не является надежным на старых телефонах Android, но работает очень хорошо на iOS. – witpok

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

Вы можете просто использовать <input type="date"> для создания общеизвестного выбора даты в iOS.

Для более подробной информации о полях ввода на мобильных устройствах я предлагаю: http://blog.teamtreehouse.com/using-html5-input-types-to-enhance-the-mobile-browsing-experience

источник

2013-06-21 08:24:12 Jan

прямо сейчас, у меня нет какой-либо конкретной возможности реализации datepicker ... Да, спасибо, я могу использовать этот '' также na..well, моя основная цель состояла в том, чтобы иметь копия того же самого, что и в android. – user

Это работает только на iOS, вопрос помечен Android – rjmunro

Кажется, что ваш currentField не определен. Вы проверяли хром-консоль, прежде чем запускать ее на AVD? Pls пытается опубликовать элемент, в котором вы также пытаетесь отобразить дату.

На данный момент, я предполагаю, что вы пытаетесь делать то, что делает следующий код

$('.nativedatepicker').focus(function(event) { 
      var currentField = $(this); 
      var myNewDate = new Date(Date.parse(currentField.val())) || new Date(); 

      // Same handling for iPhone and Android 
      window.plugins.datePicker.show({ 
       date : myNewDate, 
       mode : 'date', // date or time or blank for both 
       allowOldDates : true 
      }, function(returnDate) { 
       var newDate = new Date(returnDate); 
       var newString = newDate.toString(); 
       newString = newString.substring(0,15); 
       currentField.val(newString); 
       // This fixes the problem you mention at the bottom of this script with it not working a second/third time around, because it is in focus. 
       currentField.blur(); 
      }); 
     });

Элемент следующим

<input type="text" class="nativedatepicker" readonly value = "Fri Jun 21 2013"/>

работает как шарм !! Надеюсь, поможет !!

источник

2013-06-21 17:17:25 bala

То, что я хочу, просто: я просто хочу, чтобы отображался финишер, когда я нажимаю определенное поле.

Однако, как и Aleks, я не знаю, что положить в мой html, как его использовать в html, и что я должен положить в html для вызова datepicker на некотором входе.

Документация от plugin не заполнена.

Я нашел решение из этого test project. шаги заключаются в следующем:

Предпосылкой: PhoneGap/Cordova-кли установлен
Установка Кордовы устройства плагин: $ cordova plugin add org.apache.cordova.device
Установка Дирка Datepicker плагин: $ cordova plugin add https://github.com/DURK/cordova-datepicker-plugin
Copy nativedatepicker.js из тестового проекта и поместите его на ваш проект js fold э. В этом файле есть функции showDatePicker(), showDateTimePicker().
Добавить ff. в index.html код:

Примечание: The DatePicker не будет отображаться, когда вы проверить его в вашем браузере

.... 
    <div class="form-group"> 
     <label>Appointment</label> 
     <input type="text" class="form-control datepicker" id="appointment"> 
    </div> 
.... 
<script src="js/nativedatepicker.js"></script> 
<script src="cordova.js"></script> 
<script type="text/javascript"> 
    (function($){ 
     $(document).ready(function() { 
      $(document).on('click', '.datepicker', function() { 
       showDatePicker($(this), 'date'); 
      }); 

      $(document).on('click', '.timepicker', function() { 
       showDatePicker($(this), 'time'); 
      }); 

      $(document).on('click', '.datetimepicker', function() { 
       if (device.platform === "Android") 
        showDateTimePicker($(this)); 
       else 
        showDatePicker($(this), 'datetime'); 
      }); 
     }); 
    })(jQuery); 
</script>

источник

2014-09-25 05:02:43 Jonathan

в вашем коде, как я установлю minDate в js –

Я использую дату ввода типа для android в ионном приложении.Он отлично работает, но я делаю этот ввод скрытым и стреляющим событием щелчка, когда пользователь нажимает на div, чтобы он не работал. Есть идеи? –

Как реализовать DATE PICKER в PhoneGap/Android?

ответ

Смежные вопросы