날짜 선택기가 있고 데이터를 선택할 수 있으며 해당 날짜는 텍스트 필드에 나타납니다. 그러나 텍스트 필드의 값이 비어 있습니다. 그러면 텍스트 필드에서 값을 얻는 방법은 무엇입니까? 이것은 텍스트 필드입니다.
<input name="form_inp1" title="" class="xforms-input xforms-control qmatic-dateslot xforms-incremental xforms-ap-default hasDatepicker" id="form_inp1" type="text" x-incremental="1" value=""/>
그리고 이것은 datepicker의 스크립트입니다.
inp.datepicker({
dateFormat: dateFormat,
beforeShowDay: function (date) {
var dt = $.datepicker.formatDate('yy-mm-dd', date)
return [$('#form_one3 > option:gt(0)[value="' + dt + 'T00:00:00Z"]').length != 0];
},
changeMonth: true,
changeYear: true,
showWeek: true,
firstDay: 1,
yearRange: "c-100:c+15",
showOn: inp.hasClass("ui-date-picker-onfocus") ? "focus" : "button"
})
감사합니다
나는 이제 다음과 같이 가지고 있습니다.
; (function ($) {
$(function () {
$("form.xforms-form").bind({
XForms_Enrich: function (e) {
if ($.fn.datepicker) {
$("input.qmatic-dateslot", e.args.data).each(function () {
var inp = $(this);
if (inp.is(":disabled")) return;
var tabindex = inp.attr("tabindex");
var dateFormat = $.xforms.getProperty(inp, 'dateFormat') || 'd-M-yy';
dateFormat = dateFormat.replace(/m/g, '0').replace(/h/gi, '0').replace(/t/g, '').replace(/M/g, 'm').replace('yyyy', 'yy');
$("#" + inp.attr("id") + " ~ button.ui-datepicker-trigger").attr("tabindex", tabindex);
var clearBtn = $('<button class="ui-datepicker-clear" type="button" tabindex="' + tabindex + '">x</button>').click(function () { inp.val(''); inp.change(); return false; });
inp.after(clearBtn);
inp.datepicker({
dateFormat: dateFormat,
beforeShowDay: function (date) {
var dt = $.datepicker.formatDate('yy-mm-dd', date, "getDate")
return [$('#form_one3 > option:gt(0)[value="' + dt + 'T00:00:00Z"]').length != 0];
},
changeMonth: true,
changeYear: true,
showWeek: true,
firstDay: 1,
yearRange: "c-100:c+15",
showOn: inp.hasClass("ui-date-picker-onfocus") ? "focus" : "button"
})
var dateVal = $("#form_inp1").datepicker("getDate");
alert(dateVal);
});
$("#ui-datepicker-div").hide();
}
}
})
})
})(jQuery);
다음과 같이 시도합니다.
inp.datepicker({
dateFormat: dateFormat,
beforeShowDay: function (date) {
var dt = $.datepicker.formatDate('yy-mm-dd', date, "getDate")
return [$('#form_one3 > option:gt(0)[value="' + dt + 'T00:00:00Z"]').length != 0];
},
changeMonth: true,
changeYear: true,
showWeek: true,
firstDay: 1,
yearRange: "c-100:c+15",
showOn: inp.hasClass("ui-date-picker-onfocus") ? "focus" : "button"
})
var dateVal = $("#form_inp1").datepicker("getDate");
alert(dateVal);
});
$("#ui-datepicker-div").hide();
이제 다음과 같이합니다.
inp.datepicker({
dateFormat: dateFormat,
beforeShowDay: function (date) {
var dt = $.datepicker.formatDate('yy-mm-dd', date, "getDate")
return [$('#form_one3 > option:gt(0)[value="' + dt + 'T00:00:00Z"]').length != 0];
},
onSelect: function (dateText, inst) {
var dateval = $("#form_inp1").datepicker("getDate");
alert(dateval);
// alert(dateText);
},
changeMonth: true,
changeYear: true,
showWeek: true,
firstDay: 1,
yearRange: "c-100:c+15",
showOn: inp.hasClass("ui-date-picker-onfocus") ? "focus" : "button"
})
onSelect로. 그러나 예를 들어 출력으로 wed jul 29 00:00:00 UTC + 0200 2015를 얻습니다. 텍스트 필드에서와 동일한 출력을 얻는 방법. 따라서 출력은 29-7-2015이어야합니다.
감사합니다
Oke, 이제 다음과 같이 있습니다.
onSelect: function (dateText, inst) {
dateText = $("#form_inp1").val();
},
하지만 텍스트 필드를 보면
<input name="form_inp1" title="" class="xforms-input xforms-control qmatic-dateslot xforms-incremental xforms-ap-default hasDatepicker" id="form_inp1" type="text" x-incremental="1" value=""/>
값이 아직 비어 있습니다
출력의 실제 값 : 2015-08-04T00 : 00 : 00Z.
하지만 datepicker에서 선택한 값을 얻습니다. 4-8-2015T00 : 00 : 00Z
따라서 다음과 같이 올바른 반환 날짜를 얻는 방법 : 2015-08-04T00 : 00 : 00Z.
감사합니다
먼저 datepicker를 오른쪽 요소에 할당했는지 확인한 다음 입력 요소를 선택하고 요소에 사용 .val()합니다.
예:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Datepicker - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
$( "#datepicker" ).datepicker();
//selecting the button and adding a click event
$("#alert").click(function() {
//alerting the value inside the textbox
var date = $("#datepicker").datepicker("getDate");
alert($.datepicker.formatDate("dd-mm-yy", date));
});
});
</script>
</head>
<body>
<p>Date: <input type="text" id="datepicker"></p>
<p>Alert the value: <button id="alert">Alert!</button>
</body>
</html>도움이 되었기를 바랍니다.
추신 : 다음은 필요한 경우 공식 문서에 대한 링크입니다. https://jqueryui.com/datepicker/
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다