datatables jeditable validate input url how to combine this code? - validation

Question

I'm using datatables with the jeditable plugin, I have it setup to update directly to mysql, I need to validate some input fields to make sure a URL is being inserted. I have this code which validates jeditable fields (see jsfiddle) I need some help to integrate the jsfiddle with the table initializing code. I can add the onsubmit no problem but not sure how to add this part into my .makeEditable function, any help's appreciated thanks.
$('#url').editable(function(valurl) {
// Do your own stuff here...
return valurl;
},
http://jsfiddle.net/peter/CLuvp/
And my datatable is initialized with
var oTable3;
$(document).ready(function() {
oTable3 = $('#table3').dataTable( {
"sDom":'t<"bottom"ifpl><"clear">',
"bAutoWidth": false,
"sPaginationType": "full_numbers",
"aoColumns": [
{ "bSortable": false},
null,
null,
null,
null
]
}
).makeEditable({
sUpdateURL: "<?=$this->siteUrl()?>profiles/updatevalue",
"aoColumns": [null,
null,
{
type: 'text',
submit:'Ok',
cancel:'Cancel',
width: "100px"
}

Answer 1

I think you can simply include the options for each column in the aoColumns option, e.g.:
.makeEditable({
sUpdateURL: "<?=$this->siteUrl()?>profiles/updatevalue",
"aoColumns": [null, null,
{
submit: 'Save',
width: 200,
placeholder: 'Enter URL...',
onblur: 'submit',
onsubmit: function() {...}
}]
});
A cleaner way (or the aforementioned simply doesn't work) would be to use the url rule in that column:
.makeEditable({
sUpdateURL: "<?=$this->siteUrl()?>profiles/updatevalue",
"aoColumns": [null, null,
{
submit: 'Save',
width: 200,
placeholder: 'Enter URL...',
onblur: 'submit',
cssclass: 'url'
}]
});
See this demo for more details.