键入时显示值，但仅限前6个数字，并更改数字的顺序

I have 2 fields when I type in ID NO field (first six number is date of birth with YYMMDDxxxxxx, (always contains 12 number), the DOB field will auto filled, based on ID NO, but the value of DOB only contains first 6 number in ID NO field and the order will be DDMMYY.

Example:

ID NO: 931121091010 (YYMMDD)
DOB : 211193 (DDMMYY)

var $dob = $("#dob");
   $("#id_no").keyup(function() {
   $dob.val(this.value);
   });
  $("#id_no").blur(function() {
    $dob.val(this.value);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<form>
  <div>
  <label>ID NO</label>
    <input type="text" name="id_no" id="id_no" class="form-control" onKeyPress="return 
       goodchars(event,'1234567890',this)" required="" value="">
  </div>
  <div>
  <label>DOB</label>
    <input type="text" name="dob" id="dob" class="form-control" value="">
  </div>
</form>

</div>

See the live example below:

var $dob = $("#dob");
$("#id_no").keyup(function() {
  var str = this.value;
  var strYYMMDD = str.substring(0, 6);
  if (str.length > 6) {
    var strDDMMYY = strYYMMDD.substring(4, 6) + strYYMMDD.substring(2, 4) + strYYMMDD.substring(0, 2);
    $dob.val(strDDMMYY);
  } else {
    $dob.val("");
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <div>
    <label>ID NO</label>
    <input type="text" name="id_no" id="id_no" class="form-control" maxlength="12" onKeyPress="return 
       goodchars(event,'1234567890',this)" required="" value="">
  </div>
  <div>
    <label>DOB</label>
    <input type="text" name="dob" id="dob" class="form-control" value="">
  </div>
</form>

</div>