Showing posts with label jQuery. Show all posts
Showing posts with label jQuery. Show all posts

Thursday, May 19, 2011

jQuery - Tables - Show and Hide Columns

You can hide and show columns in a table by specifying a column index where 1 is the first column in the table.

function toggleColumn(column) {
  $('#iTable tr *:nth-child('+ column +')').toggle();
}

Note: iTable is the name of the HTML table.
Note: The * is used to ensure you show / hide both the TH and TD tags.

Friday, May 6, 2011

jQuery - Datepicker - Disable Specific Dates

You can disable specific dates with the jQuery Datepicker using the beforeShowDay event.

var unavailableDates = ["9-5-2011","14-5-2011","15-5-2011"];

function unavailable(date) {
  dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
  if ($.inArray(dmy, unavailableDates) < 0) {
    return [true
,"","Book Now"];
  } else {
    return [false
,"","Booked Out"];
  }
}

$('#iDate').datepicker({ beforeShowDay: unavailable });

Note: iDate in the last line is the name of the HTML form input element.

To see a working example with some more features please see the jsFiddle example: HERE