Requiere Jquery Validate desplegable si el campo está vacío

Question

Estoy tratando de hacer el menú desplegable requerido si el campo #category está vacío.

Gracias!

JQUERY ATTEMPT # 1:

$("#uploadDocsForm").validate({ 
    rules: { 
     name: { 
      required: true, 
      minlength: 2, 
      maxlength: 255 
     }, 
     cat_id: { 
      required: function(element) { 
       return $("#category").val() == ''; 
      } 
     } 
    }, 
    messages: { 
     name: 'Please enter a <b>Document Name</b>.', 
     cat_id: 'Please select a <b>Category</b>.' 
    } 
}); 

JQUERY ATTEMPT # 2:

$("#uploadDocsForm").validate({ 
    rules: { 
     name: { 
      required: true, 
      minlength: 2, 
      maxlength: 255 
     }, 
     cat_id: { 
      required: { 
       depends: function(element) { 
        return $("#category").val() == ''; 
       } 
      } 
     } 
    }, 
    messages: { 
     name: 'Please enter a <b>Document Name</b>.', 
     cat_id: 'Please select a <b>Category</b>.' 
    } 
}); 

HTML:

<form name="uploadDocsForm" id="uploadDocsForm"> 
    <label for="name">Document Name</label> 
    <input name="name" id="name" type="text" class="textbox"/> 
    <label for="cat_id">Category</label> 
    <select name="cat_id" id="cat_id" class="dropdown"> 
    <option selected>Please Select Category</option> 
    <option>------------------------</option> 
    <option value="1">test cat</option> 
    </select> 
    <label for="category">New Category</label> 
    <input name="category" id="category" type="text" class="textbox"/> 
    </form> 

Answer 1

$("#uploadDocsForm").validate({ 
    rules: { 
     name: { 
      required: true, 
      minlength: 2, 
      maxlength: 255 
     }, 
     cat_id: { 
      required: { 
       depends: function(element) { 
        return $("#category").val() == ''; 
       } 
      } 
     } 
    }, 
    messages: { 
     name: 'Please enter a <b>Document Name</b>.', 
     cat_id: 'Please select a <b>Category</b>.' 
    } 
}); 

La función depende ahora comprueba si el elemento de categoría es lleno, y si es así el segundo es requerido . De lo contrario, es opcional (es decir, se puede completar).

Casos de uso:

• Categoría lleno, cat_id vacío: no válidos
• Categoría llenos, cat_id llenos: válido
• categoría vacía, cat_id vacío: válido
• categoría vacía, cat_id llenos: válido

Answer 2

Parece que 'depende' ya no es compatible.

que utilizó la siguiente y funciona:

<form name="uploadDocsForm" id="uploadDocsForm"> 
    <label for="name">Document Name</label> 
    <input name="name" id="name" type="text" class="textbox"/> 
    <label for="cat_id">Category</label> 
    <select name="cat_id" id="cat_id" class="dropdown"> 
    <option value="" selected>Please Select Category</option> 
    <option>------------------------</option> 
    <option value="1">test cat</option> 
    </select> 
    <label for="category">New Category</label> 
    <input name="category" id="category" type="text" class="textbox"/> 
    </form> 

Aviso el valor opción = "" que causan la validación a fallar ya val está vacía

$("#uploadDocsForm").validate({ 
    rules: { 
     name: { 
      required: true, 
      minlength: 2, 
      maxlength: 255 
     }, 
     cat_id: { 
      required: true 
      } 
     } 
    }, 
    messages: { 
     name: 'Please enter a <b>Document Name</b>.', 
     cat_id: 'Please select a <b>Category</b>.' 
    } 
});