Question

我有一个带有两个日期选择器的表单。我正在使用JS来启动datepicker，然后JS使用值来构建提交的URL。

我希望我的日期格式以mm / dd / yy显示给用户，但我需要将日期添加到网址中作为yy-m-d

这是我的表单和处理表单的JS：

<script type="text/javascript">
// Booking Mask Submission
jQuery(function() {
	var form = jQuery('form#form1');
	form.submit(function(e) {
		var checkin = form.find('input[name="date_from"]').val();
		var nights = form.find('input[name="date_to"]').val();
		var guests = form.find('select[name="person"]').val();
		
		var bookingLink = "https://example.com" + checkin + "&depart=" + nights + "&adult=" + guests + "&?";
		form.attr('action',bookingLink);
	});
});
</script>

<form class="book-form"  method="post" id="form1" >	
<div class="container">		
<span class="title">book a room</span>		
<div class="area">			
<div class="col date-holder">				
<div class="date">	<input type="text" name="date_from" class="from" placeholder="ARRIVAL">				</div>		
			
<div class="date">	<input type="text" name="date_to" placeholder="DEPARTRUE" class="to" >				</div>	
		</div>			
<div class="col">				<select class="person" name="person" placeholder="GUESTS">					<option>1</option>					<option>2</option>					<option>3</option>					<option>4</option>					<option>5</option>				</select>			</div>
<div class="col">	<input type="submit" value="get rates" class="btn">			</div>		</div>		</div></form>

这是我的datepicker js：

// datepicker
function initDatepicker() {
	jQuery('.date-holder').each(function() {
		var holder = jQuery(this);
		var from = holder.find('input.from');
		var to = holder.find('input.to');
		from.datepicker({
			dateFormat: 'mm-dd-yy',
			hiddenName: true,
			onClose: function(selectedDate) {
				to.datepicker('option', 'minDate', selectedDate);
		 }
		});
		to.datepicker({
			dateFormat: 'yy-m-d',
			onClose: function(selectedDate) {
				from.datepicker('option', 'maxDate', selectedDate);
			}
		});
	});
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>

此外，我还有一些代码可以将第二个日期选择器日历自动设置为第一个日期之后的第二天。

总结一下，我希望输入字段显示mm / dd / yy但转换为yy-m-d进行提交

Answer 1

您可以创建一个函数来手动为您设置日期格式。例如，在提交功能中：

checkin = formatDate(checkin);

function formatDate(myDate) {
    var date = new Date(myDate);
    var yearFormatted = date.getFullYear().toString().substr(-2);
    var monthFormatted = date.getMonth() + 1;
    var dayFormatted = date.getDate();

    var dateFormatted = yearFormatted + '-' + monthFormatted + '-' + dayFormatted;

    return dateFormatted;
}

在提交（JS）上更改datepicker格式

1 个答案: