How can I use the jQuery Validation Plugin to validate this form that have this specific constraint?

I am pretty new in jQuery and I have the following problem related to a form validation.

So I think to not write the validator by myself but to use the jQuery Validation Plugin, this one: http://jqueryvalidation.org/

From what I have understand it provide me the built in required() method that make a specific field required (if the user don't insert a value for this field an error message is shown).

OK... my problem is that in my form I have something like this:

<form method="post" action="consultazioneRicercaForm" id="consultazioneRicercaForm">

    <div class="row">
        <div class="col-md-4">

            <label style="display: block;">Regioni:</label>
            <select name="regioneSelezionata" id="selReg">
                <option value="-">--SELEZIONARE UNA REGIONE--</option>
                <option value="AB">ABRUZZO</option><option value="BA">BASILICATA</option><option value="CA">CAMPANIA</option><option value="CL">CALABRIA</option><option value="EE">REGIONE ESTERA</option><option value="EM">EMILIA ROMAGNA</option><option value="FR">FRIULI-VENEZIA GIULIA</option><option value="LA">LAZIO</option><option value="LI">LIGURIA</option><option value="LO">LOMBARDIA</option><option value="MA">MARCHE</option><option value="MO">MOLISE</option><option value="PI">PIEMONTE</option><option value="PU">PUGLIA</option><option value="SA">SARDEGNA</option><option value="SI">SICILIA</option><option value="TO">TOSCANA</option><option value="TR">TRENTINO-ALTO ADIGE</option><option value="UM">UMBRIA</option><option value="VA">VALLE D' AOSTA</option><option value="VE">VENETO</option>
            </select>
        </div>


        <div class="col-md-4">
            <label style="display: block;">Province:</label>
            <select name="provinciaSelezionata" id="selProv"><option value="">--SELEZIONARE UNA PROVINCIA--</option></select>
        </div>


        <div class="col-md-4">
        </div>

    </div>

    <div style="margin-top: 30px;" class="row">
        <div class="col-md-4">
            <label style="display: block;">Codice Meccanografico:</label>
            <input type="text" value="" name="codMec" id="selCodMec">
            </div>

            <div class="col-md-4">
                <label style="display: block;">Tipologia Progetto:</label>
                <select name="tipologiaProgettoSelezionato" id="selTipologiaProgetto">
                    <option value="-">--TIPOLOGIA--</option>
                    <option value="WIFI">WIFI</option><option value="LIM">LIM</option><option value="Altro">Altro</option><option value="Classi 2.0">Classi 2.0</option><option value="Scuola 2.0">Scuola 2.0</option><option value="CSD">CSD</option>
                </select>

            </div>


            <div class="col-md-4">
                <label style="display: block;">Stato Progetto:</label>
                <select name="statoProgettoSelezionato" id="selStatoProgetto">
                    <option value="-">--STATO PROGETTO--</option>
                    <option value="Da compilare">Da compilare</option><option value="In lavorazione">In lavorazione</option><option value="Da validare">Da validare</option><option value="Validato">Validato</option><option value="Rendicontato pregresso">Rendicontato pregresso</option>
                </select>

            </div>

        </div>

        <div style="margin-top: 30px;" class="row">
            <div class="col-md-12">
                <input type="submit" value="Cerca">
            </div>
        </div>
</form>

As you can see it contains some field of which those that have id="selReg" and id="selCodMec".

So my validation is focused only on the previous 2 fields and in particular the form can be considered valid if the field having id="selReg" OR the field having id="selCodMec" have a value setted. So if at least one of these 2 fields is valorized by the user my form is considered valid.

I think that in this case I can't use the required() method because it seems to me that the required() method is refered on a specific field and don't implement the previous logic.

How can I solve this problem? Can I use this JQuery Validation Plugin for my purpose?

Solution

I use in one of my project the jQuery Validation as well.

Try to add a own validation rule:

$.validator.addMehtod('oneOrOther',function(value) {
  if(!$("#selReg").val() && !$("#selCodMec").val())
    return false;
  else
    return true;
});

Assign the validation to the field:

$("#consultazioneRicercaForm").validate({
  ...
  rules: {
    regioneSelezionata: {
      oneOrOther: true
    }
   ...
  }
});

I hope, I understood your question correctly.