Joe - datepicker in table using jQuery

by Joe

HTML

<table id="example1" class="table table-bordered table-striped">
  <thead>
    <tr>
      <th class="text-center">
        Voc Type
      </th>
      <th class="text-center">
        Voc No
      </th>
      <th class="text-center">
        Date
      </th>
      <th class="text-center">
        Account
      </th>
      <th class="text-center">
        Narration*
      </th>
      <th class="text-center">
        Debit*
      </th>
      <th class="text-center">
        Credit
      </th>
      <th class="text-center">
        Realise*
      </th>
      <th class="text-center">
        Real.Date*
      </th>
    </tr>
  </thead>
  <tbody>
    <tr id="rcpt_mainrow">
      <td>
        <input type="text" id="voc_type" placeholder='Voucher Type' class="form-control" readonly />
      </td>
      <td>
        <a href="#" class="form-control voch_bank" id="voc_no">12344546</a>
      </td>
      <td>
        <input type="text" id="br_date" placeholder='DD-MM-YYYY' class="form-control" readonly />
      </td>
      <td>
        <input type="number" id="rcpt_code" placeholder='Account' class="form-control" readonly />
      </td>
      <td>
        <input type="text" id="br_narrate" placeholder='Some Text here' class="form-control" readonly />
      </td>
      <td>
        <input type="number" id="rcptDebit" value="" placeholder='Debit Amount' data-action="sumDebit" class="form-control" readonly />

      </td>
      <td>
        <input type="number" id="rcptCredit" placeholder='Credit Amount' data-action="sumCredit" class="form-control" readonly />
      </td>
      <td>
        <input type="checkbox" id="tableCbox" name="tableCheck" value="yes">
        <label class="tableBox" for="tableCbox"></label>
      </td>
      <td>
        <input type="text" class="form-control tableJ" id="rcpt_vochDate" />
      </td>
    </tr>
    <tr>
      <td>
        <input type="text" id="voc_type" placeholder='Voucher Type' class="form-control" readonly />
      </td>
      <td>
    ...

JavaScript

$(document).ready(function() {
    $("#rcpt_vochDate").datepicker({ dateFormat: "dd/mm/yy" }).datepicker("setDate", new Date());
});

$(document).ready(function() {
    $('table').on('focus', 'input.tableJ:not(.hasDatepicker)', function() {
        $('.tableJ').datepicker();
    });
});