input[type="date"]の年月日を分けてpostする

はじめまして、さブといいます。
web業界に生きる人間として、学んだことを少しでもアウトプットして行こうと思っています。

今回はタイトルの通り、input[type="date"]で日付を選択した際に、
年、月、日に分けて送信する方法をまとめます。

<input type="date" name="date"> 
<input type="hidden" name="date-y">
<input type="hidden" name="date-m">
<input type="hidden" name="date-d">

$(function(){
   //スマホで日付選択したときに年月日別に値を格納
   $('input[name="date"]').on('change',function(){ 
     var str = $(this).val();//選択した日付を取得
     var date = str.split('-');//配列化 

     $('input[name="date-y"]').val(date[0]);
     $('input[name="date-m"]').val(date[1]);
     $('input[name="date-d"]').val(date[2]);
   });
});

カレンダーの日付を取得したくて組んだのですが、
UI的に年月日別にプルダウンで選択できた方が主流で良いとの事だったのでボツに＾＾；
よく調べてから作りましょうという教訓を持ちつつ
いつか使うかもしれないと思っての備忘録的なやつです。