Conditional remote validation

Question

I have a form which I am validating through the jQuery Validate plugin. Everything is working fine except just one thing.

I have a field that I using, the remote rule, and I am using AJAX to check if there is already an application record with the same name. I need to perform this validation only if the user changes the value in the field.

This is the validate code I have:

$('#createapp').validate({
    rules: {
      appname: {
        minlength: 8,
        required: true,
        remote: {
                url: "<?php echo base_url();?>app/application/check_app",
                type:"POST",
                async: false,
                data:  {
                appname: function() {
                return $("#appname").val();
          }
        }  
      }
      },
      apptitle: {
        required: true
      }
    },
    messages: {
        appname: {
      remote: "Application with same name already exists"
      }
     },
    highlight: function(label) {
        $(label).closest('.control-group').addClass('error');
    },
    success: function(label) {
        label
            .text('OK!').addClass('valid')
            .closest('.control-group').addClass('success');
    }
  });

I need to do this:

Perform remote validation only if the user changes the text in the appname field. I tried using depends but am not able to make it work. This is basically what I tried:

remote: {
            depends: function(element){
            return ($('#appname').val() != "<?php echo trim($application[0]->app_name) ?>" );
            }

This may help you: http://forum.jquery.com/topic/jquery-validate-remote-vs-depends — Andrew Whitaker, May 12 '12 at 14:45
The topic was posted 3 years ago and it says that this is a bug. Was it ever fixed or I need to go with a workaround??? — Neel, May 12 '12 at 15:21
I don't think it's been fixed; I would go with the workaround for now. I can't find an issue on the plugins github page, but it's worth looking:https://github.com/jzaefferer/jquery-validation/issues/search?q=remote+depends — Andrew Whitaker, May 15 '12 at 00:21

score 0 · Accepted Answer · answered May 20 '12 at 03:04

I finally used a workaround. Which is as following

Pass the original name as hidden parameter

<input type="hidden" name="orgappletname" id="orgappletname"
  value="<?php echo $applet[0]->applet_name ?>">

setup jQuery to compare against the original name and see if something has changed on blur. If yes then trigger ajax request to check for the changed name.

$('#appletname').blur(function(){
 if($(this).val() != $('#orgappname').val()){
    $.ajax({
        url: "<?php echo base_url() . "apl/applet/check_applet" ?>",
        data: "appletname=" + $(this).val(),
        type: "POST",
        success: function (msg) {
        }
    });
  }
  });

I am not sure if this is right way to do it, but it works for me.

score 0 · Answer 2 · answered Jun 13 '12 at 19:16

@user1017268

this works as well, not sure why, expected it to fail ;-) If you swap out the remote validation rule into a separate method, then you can do something like (coffeescript):

getEmailRule = () ->
  which = window.location.pathname.split('/')[1]
  if which == 'renew' then required: true
  else remote: { url: "/user/exists", type: "POST", async: false } 

isValid = $('#subscriptionForm').validate({
  rules: {
    email:      getEmailRule()
    password:   "strongPass"
    orderTotal: "gtZero"
  }
}).form()

Which only performs remote email-exists check for subscription non-renewal (i.e. signup) since the email must exist when renewing user is already logged in ;-)

Conditional remote validation

2 Answers2