2013-06-12 6 views
2

사용자에게 HTML5 날짜 입력을 사용하여 모바일 웹을 통해 기본 날짜 선택기를 호출 할 수있는 옵션을 제공하려고합니다. 사용자 장치가 HTML5를 지원하든 지원하지 않든 동일한 메서드에 대해 중복 호출을 원하지 않으므로이 장치를 사용할 수있는 사용자에게 type = "date"입력 만 표시 할 계획입니다. 제출시 날짜 입력 값을 가져 와서 세 개의 정의 된 값으로 전달하고 싶습니다. 기본적으로 사용자가 제출 요청을 받으면 날짜를 월, 일 및 연도로 나눠 양식 프로세서가 수신 할 것으로 예상하는 필드에 추가합니다.HTML5를 날짜 입력 값 3 개로 분할

나는 내가 찾은 샘플을 기반으로 이런 일을 가지고 있지만 그것은 작동하지 않습니다 :

$(document).ready(function() { 
$('#submit').click(function(){ 
var dateVal = $('#dateCL').val() 
var dateLength = dateVal.length; 
var dateSplit = dateVal.split('\/'); 
var dateMonthLength = dateSplit['\/'].length + 0; 
var monthCL = dateVal.slice(monthCLLength); 
var dayCL = dateVal.slice(dayCLLength); 
var yearCL = dateVal.slice(yearCLLength); 
$('#dateCL').val(dateSplit[0]); 
$('#month').val(monthCL); 
$('#day').val(yearCL); 
$('#year').val(monthCL); 
return false; 
}); 
}); 

<form action="mailto:[email protected]"> 
    <input name="name" id="name" type="text"> 
    <input name="first_name" id="first_name" type="text"/> 
    <input name="last_name" id="last_name" type="text"/> 
    <input type="submit" id="submit"> 
</form> 
<form action="mailto:[email protected]"> 
    <input name="dateCL" id="dateCL" type="date" min="1909" max="2009"> 
    <input name="monthCL" id="monthCL" type="hidden"/> 
    <input name="dayCL" id="dayCL" type="hidden"/> 
    <input name="yearCL" id="yearCL" type="hidden"/> 

    <input type="submit" id="submit"> 
</form> 

http://jsfiddle.net/7xK53/5/

+0

대신 서버 측 서버를 처리 할 수 ​​있습니까? – Mooseman

+0

이를 피하려고합니다. 내 Java 녀석은 이미 변화가 깊어 프론트 엔드에서 접근하기 쉽습니다. –

+0

업데이트 할 때 내 피들을 잃었습니다 : http://jsfiddle.net/7xK53/5/ ' –

답변

1

이 내가 로컬 또는 내 웹에서 실행하면 크롬에 jQuery를없이 작동하는 것 같다 서버를 사용하지만 피들에서 시도하면 오류가 발생합니다.

function PassTheMic(){ 
document.getElementById('myField1').value = document.getElementById('myFieldx').value; 

} 


</script> 

<form method="post" action="mailto:[email protected]"> 
<input type="date" id="myFieldx" value="" name="myFieldx" onBlur="PassTheMic()" min="2012-01-01" max="2013-01-01"/> 
<input type="hidden" id="myField1" value="" name="myField1" /> 
<input type="submit" value="submit" name="submit"> 
</form>