I am working on a php program that requires javascript on every form control. Once the onblur event takes place the value will automatically be sent to the server to update the database.
I have possibly 50 form controls spread over 5 tabs so I don't want to hardcode the information on the php file.
I could co-opt an idea from HTML5 and create new properties for this such as
data-table='user' data-column='firstname'
for every item, and then javascript could pull those values out and send them to the php file.
I don't know if there is a better way to manage the mapping between these form controls and the several tables/columns?
HTML
<input id='data-base*data-colum' onblur='preupdate(this);' value='' />
Javascript
function preupdate(el){
var idData = el.getAttribute('id').split('*');
var dataBase = idData[0];
var dataColum = idData[1];
update(el.value, dataBase, dataColum);
}
Actually I think that's the best option you have. If you use jquery, you can do something like this :
$("input").blur(function () {
var data-table = $(this).attr('data-table');
var data-column = $(this).attr('data-column');
$.ajax({
type: 'post',
url: your_url,
data: your_get_data
});
});
I'd use PHP to generate a data structure mapping the controls (hopefully they have unique names/ids) to the db info. Then I'd spit this out in JSON as inline javascript in .
Then your on_blur
attributes on all your fields can be the same (or each pass a unique id for that field) and call a javascript function that looks up the db info from the data structure.