Validate URL Field using Jeditable plugin

i want to validate a URL. i am using jquery plugin jeditable. i want when some one click on the field and enter an invalid URL it show error.

here is my code. how can i modify . please help

$(function() {
 $("#url").editable(
         function(data)
         {seller=new BHSeller();
          seller.updateSellerOfferGeneric('need_url',data,<?php echo $need_id?>);}
         , { 
      indicator : "<img src='layout/images/loader.gif'>",
      type : 'text',
         width:'450px', 
          select : true, 
          开发者_开发知识库submit : 'Save', 
        cssclass : "editable", 
        style  : "display:inline"
  });
});

how can i add validation in the above code.

You are already passing a function instead of an URL, you can do validation before calling "updateSellerOfferGeneric()"

function(url) {
    if (validateUrl(url) {
        seller = new BHSeller();
        seller.updateSellerOfferGeneric('need_url', url, <?php echo $need_id; ?>);
    } else {
        // Show error message
    }
}

Where "validateUrl()" can be either a function or a regular expression. You can also add a seperate event if you want instant validation.

For example:

$('#url').bind('keyup', function() {
    if (!validateUrl(this.value)) {
        // Show error message
    }
});

The most beautiful solution would be to use the onsubmit event and return false if the url is invalid:

$('#url').editable(function(value) {
    seller=new BHSeller();
    seller.updateSellerOfferGeneric('need_url',data,<?php echo $need_id?>);
    return value;
}, {
    submit: 'Save',
    width: 200,
    placeholder: 'Enter URL...',
    onblur: 'submit',
    onsubmit: function() {
        var value = $(':input', this).val();

        if (!validateUrl(value)) {
            // Show error message...

            // Prevent form submission
            return false;
        }
    }
});

onsubmit: function (settings, original) {
    var myForm = $('form', original);
    $(myForm).validate({
        rules: {
            value: { url: true} //from jEditable configuration of ... name: 'value',...
        },
        messages: {
            value: { url : 'YOUR MESSAGE COMES HERE' }
        },
        onkeyup: false
    });
    return $('form', original).valid();
},