ajaxCRUD.com

Modify Field With Class

Consider the following table:

CREATE TABLE tblFriend (
pkFriendID int(11) PRIMARY KEY AUTO_INCREMENT,
fldName varchar(25),
fldAddress varchar(30),
fldCity varchar(20),
fldState char(2),
fldZip varchar(5),
fldPhone varchar(15),
fldEmail varchar(35),
fldDateMet date,
);

Class Implementation:

---your class.php---

#required file and class
require_once ('preheader.php');
include_once ('ajaxCRUD.class.php')

#create an instance of the class
$tblFriend = new ajaxCRUD("Friend", "tblFriend", "pkFriendID");

//if we only want to show a few of the fields in the table
$tblFriend->showOnly("fldName, fldPhone, fldZip, fldDateMet");

#set the number of rows to display (per page)
$tblFriend->setLimit(10);

#set a filter box at the top of the table
$tblFriend->addAjaxFilterBox('fldName', 20);

#modify field with class
#for masking and for adding calendar widget
$tblFriend->modifyFieldWithClass("fldDateMet", "datepicker");
$tblFriend->modifyFieldWithClass("fldZip", "zip");
$tblFriend->modifyFieldWithClass("fldPhone", "phone");

#show CSV export button
$tblFriend->showCSVExportOption();

#order the table by any field you want
$tblFriend->addOrderBy("ORDER BY fldName");

$tblFriend->showTable();


---validation.js---

// mask some fields with desired input mask
$("input.phone").mask("(999) 999-9999");
$("input.zip").mask("99999");

//put a date picker on a field
$( ".datepicker" ).datepicker({
	dateFormat: 'yy-mm-dd',
	showOn: "button",
		buttonImage: "includes/images/calendar.gif",
		buttonImageOnly: true,
	onClose: function(){
		this.focus();
		//$(this).submit();
	}
});

View Example by Itself

Click here to view example outside of the template.