0

que tal amigos resulta que necesito validar un select2 dentro de mi view para lo cual tengo el siguiente código.

este codigo es el completo para la vista donde estoy cargando la información

<div class="row">
 <div class="col-md-12">
  <nav>
   <div class="nav nav-tabs nav-fill" id="nav-tab" role="tablist">
    <a class="nav-item nav-link active" id="nav-home-tab" data-toggle="tab" href="#nav-home" role="tab" aria-controls="nav-home" aria-selected="true">Datos Generales</a>
    <a class="nav-item nav-link" id="nav-profile-tab" data-toggle="tab" href="#nav-profile" role="tab" aria-controls="nav-profile" aria-selected="false">Cronograma</a>
    <a class="nav-item nav-link" id="nav-contact-tab" data-toggle="tab" href="#nav-contact" role="tab" aria-controls="nav-contact" aria-selected="false">Comentarios</a>
    @*<a class="nav-item nav-link" id="nav-about-tab" data-toggle="tab" href="#nav-about" role="tab" aria-controls="nav-about" aria-selected="false">About</a>*@
   </div>
  </nav>
  @using (Html.BeginForm("Create", "Procedimientos", FormMethod.Post, new { @id = "FrmProcedimiento", @class = ".formAjaxAdd" }))
  {
   HtmlHelper.UnobtrusiveJavaScriptEnabled = false;
   @Html.AntiForgeryToken()
   @Html.HiddenFor(model => model.MtoUsuarioId)
   @Html.HiddenFor(model => model.MtoCompaniaId)
   @Html.HiddenFor(model => model.MtoEstadoId)

   <div class="tab-content py-3 px-3 px-sm-0" id="nav-tabContent">
    <div class="tab-pane fade show active" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab">

     <div class="form-group row">
      <div class="col-md-3">
       @Html.LabelFor(model => model.Ejercicio, htmlAttributes: new { @class = "control-label" })
       @Html.EditorFor(model => model.Ejercicio, "", new { htmlAttributes = new { @class = "form-control", placeholder = "Ejercicio", autocomplete = "off",required="required" } })
       @Html.ValidationMessageFor(model => model.Ejercicio, "", new { @class = "text-danger" })
      </div>
      <div class="col-md-3">
       @Html.LabelFor(model => model.NoLicitacion, htmlAttributes: new { @class = "control-label" })
       @Html.EditorFor(model => model.NoLicitacion, new { htmlAttributes = new { @class = "form-control", @type = "text", placeholder = "Número de Procedimiento", autocomplete = "off", required = "required" } })
       @*@Html.ValidationMessageFor(model => model.NoLicitacion, "", new { @class = "text-danger" })*@
      </div>
      <div class="col-md-2">
       <div class="form-group">
        @Html.LabelFor(model => model.MtoTipoCompraId, htmlAttributes: new { @class = "control-label " })
        @Html.DropDownListFor(model => model.MtoTipoCompraId, Model._ListMtoTipoCompras, new { @class = "form-control", required = "required" })
        @Html.ValidationMessageFor(model => model.MtoTipoCompraId, "", new { @class = "text-danger" })
       </div>
      </div>
      <div class="col-md-2">
       <div class="form-group">
        @Html.LabelFor(model => model.MtoTipoEventoId, htmlAttributes: new { @class = "control-label " })
        @Html.DropDownListFor(model => model.MtoTipoEventoId, Model._ListMtoTipoEventos, new { @class = "form-control", required = "required" })
        @Html.ValidationMessageFor(model => model.MtoTipoEventoId, "", new { @class = "text-danger" })
       </div>
      </div>
      <div class="col-md-2">
       <div class="form-group">
        @Html.LabelFor(model => model.MtoCaracterId, htmlAttributes: new { @class = "control-label " })
        @Html.DropDownListFor(model => model.MtoCaracterId, Model._ListMtoCaracteres, new { @class = "form-control" , required = "required" })
        @Html.ValidationMessageFor(model => model.MtoCaracterId, "", new { @class = "text-danger" })
       </div>
      </div>
     </div>
     <div class="form-group row">
      <div class="col-md-2">
       <div class="form-group">
        @Html.LabelFor(model => model.MtoArticuloId, htmlAttributes: new { @class = "control-label " })
        @Html.DropDownListFor(model => model.MtoArticuloId, Model._ListMtoArticulos, new { @class = "form-control" })
        @Html.ValidationMessageFor(model => model.MtoArticuloId, "", new { @class = "text-danger" })
       </div>
      </div>
      <div class="col-md-2">
       @Html.LabelFor(model => model.DetalleArticuloId, htmlAttributes: new { @class = "control-label " })
       @Html.DropDownListFor(model => model.DetalleArticuloId, Model._ListDetalleArticulos, new { @class = "form-control" })
       @Html.ValidationMessageFor(model => model.DetalleArticuloId, "", new { @class = "text-danger" })
      </div>
      <div class="col-md-2">
       @Html.LabelFor(model => model.FechaRecepcion, htmlAttributes: new { @class = "control-label " })
       <div class="input-group date datepicker-popup">        
        @Html.EditorFor(model => model.FechaRecepcion, new { htmlAttributes = new { @class = "form-control datepicker-popup", @type = "text", placeholder = "Fecha CCA",@value="" } })
        <span class="input-group-addon input-group-append border-left">
         <span class="mdi mdi-calendar input-group-text"></span>
        </span>
        @Html.ValidationMessageFor(model => model.FechaRecepcion, "", new { @class = "text-danger" })
       </div>
      </div>
      <div class="col-md-2">
       @Html.LabelFor(model => model.OficioPeticion, htmlAttributes: new { @class = "control-label" })
       @Html.EditorFor(model => model.OficioPeticion, new { htmlAttributes = new { @class = "form-control", @type = "text",  placeholder = "Oficio CCA", autocomplete = "off", required="required" } })
       @Html.ValidationMessageFor(model => model.OficioPeticion, "", new { @class = "text-danger" })
      </div>
      <div class="col-md-2">
       @Html.LabelFor(model => model.PreConvocatoria, htmlAttributes: new { @class = "control-label" })
       @Html.EditorFor(model => model.PreConvocatoria, new { htmlAttributes = new { @class = "form-control", @type = "text", placeholder = "Pre Convocatoria", autocomplete = "off" } })
       @Html.ValidationMessageFor(model => model.PreConvocatoria, "", new { @class = "text-danger" })
      </div>
      <div class="col-md-2">
       <div class="form-group">
        @Html.LabelFor(model => model.MtoTipoMercadoId, htmlAttributes: new { @class = "control-label " })
        @Html.DropDownListFor(model => model.MtoTipoMercadoId, Model._ListMtoTipoMercados, new { @class = "form-control" })
        @Html.ValidationMessageFor(model => model.MtoTipoMercadoId, "", new { @class = "text-danger" })
       </div>
      </div>
     </div>
     <div class="form-group row">
         <div class="col-md-6">
             <div class="form-group">
                 @Html.LabelFor(model => model.Fundamento, htmlAttributes: new { @class = "control-label" })
                 @Html.EditorFor(model => model.Fundamento, new { htmlAttributes = new { @class = "form-control", @rows = 4, @cols = 40, placeholder = "Fundamento legal del Procedimiento de contratación", autocomplete = "off" } })
                 @Html.ValidationMessageFor(model => model.Fundamento, "", new { @class = "text-danger" })
             </div>
         </div>

         <div class="col-md-6">
             <div class="form-group">
                 @Html.LabelFor(model => model.Descripcion, htmlAttributes: new { @class = "control-label" })
                 @Html.EditorFor(model => model.Descripcion, new { htmlAttributes = new { @class = "form-control", @rows = 4, @cols = 40, placeholder = "Descripción del Procedimiento", autocomplete = "off" } })
                 @Html.ValidationMessageFor(model => model.Descripcion, "", new { @class = "text-danger" })
             </div>
         </div>
     </div>

     <div class="for-group row">


      <div class="col-md-6">
       <div class="form-group">
        <label>Investigación de Mercado</label>
        <select id="SelectInvestigacionMercado" class="js-example-basic-single" style="width:100%" name="states[]" multiple="multiple"></select>
       </div>
      </div>


      <div class="col-md-6">
       <div class="form-group">
        <label>Areá(s) Requirente(s)</label>
        <select id="SelectRequirentes" class="js-example-basic-single" style="width:100%" name="states[]" multiple="multiple"></select>
       </div>
      </div>

     </div>

    </div>
    <div class="tab-pane fade" id="nav-profile" role="tabpanel" aria-labelledby="nav-profile-tab">

    </div>
    <div class="tab-pane fade" id="nav-contact" role="tabpanel" aria-labelledby="nav-contact-tab">

    </div>
    <div class="tab-pane fade tab" id="nav-about" role="tabpanel" aria-labelledby="nav-about-tab">
     Et et consectetur ipsum labore excepteur est proident excepteur ad velit occaecat qui minim occaecat veniam. Fugiat veniam incididunt anim aliqua enim pariatur veniam sunt est aute sit dolor anim. Velit non irure adipisicing aliqua ullamco irure incididunt irure non esse consectetur nostrud minim non minim occaecat. Amet duis do nisi duis veniam non est eiusmod tempor incididunt tempor dolor ipsum in qui sit. Exercitation mollit sit culpa nisi culpa non adipisicing reprehenderit do dolore. Duis reprehenderit occaecat anim ullamco ad duis occaecat ex.
    </div>
   </div>
   <div class="form-group row">
    <div class="col-md-12">
     @*<button id="BtnGuardarProcedimiento" class="btn-style-one" type="submit"><i class="fa  fa-check"></i> Guardar</button>*@
     <input class="btn btn-primary" id="Btn-GuardarEditarProcedimiento" type="submit" value="Submit">
     <button class="btn btn-light">Cancel</button>
    </div>
   </div>
  }
 </div>
</div>

este es el codigo del script completo en el que quiero validar si el select con clase select2 tiene por lo menos una opción elegida.

$('.js-example-basic-multiple').select2();

$.validator.addMethod("validaSelect", function (value, element, arg) {
          return arg != value;
      }, "Seleccione una opción");


      $('form[id="FrmProcedimiento"]').validate({
          ignore: [],
    rules: {
     Ejercicio: "required",
     NoLicitacion: { required: true, minlength: 8},
     MtoTipoCompraId: { required: true, min: 1 },
     MtoCaracterId: { required: true, min: 1 },
     MtoTipoEventoId: { required: true, min: 1 },
     FechaRecepcion: "required",
     MtoTipoMercadoId: { required: true, min: 1 },
     Fundamento: "required",
     Descripcion: "required",
     OficioPeticion: "required",
        SelectInvestigacionMercado: {validaSelect: "SELECCIONE UNA OPCIÓN"},
     SelectRequirentes: { required: true, min: 1 }
    },
    messages: {
     Ejercicio: "Requerido",
     NoLicitacion: {required:"requerido",minlength: "Minimo 18 caracteres"},
     MtoTipoCompraId: { required: "requerido", min: "Requerido" },
     MtoCaracterId: { required: "requerido", min: "Requerido" },
     MtoTipoEventoId: { required: "requerido", min: "Requerido" },
     FechaRecepcion: "required",
     MtoTipoMercadoId: { required: "requerido", min: "Requerido" },
     Fundamento: 'Requerido',
     Descripcion: 'Requerido',
     OficioPeticion: 'Requerido',
     SelectInvestigacionMercado: { required: "requerido", min: "Requerido" },
     SelectRequirentes: { required: "requerido", min: "Requerido" }
    },
    submitHandler: function (form) {
     form.submit();
    }

el problema radica en que necesito validar si el select2 esta vacio y madnar mensaje ya intente con agregar reglas pero no he podido solucionarlo, agradecer si me ayudaran.

saludos.

2
  • 1
    como mapeas las validaciones con los controles en el html ? alli veo que dice Ejercicio, NoLicitacion, etc, eso que serian? No veo nada que relacione una validacion con ese select2 al cual te refieres, es mas salvo data-select2-id o class como serselect2-selection__choice__remove, select2-selection, no veo nada que permita seleccionar medianete jquery o una validacion. No queda claro que es este select2 quizas sea un combo de html, pero no veo que libreria le aplicas Commented el 5 feb. 2020 a las 22:31
  • que tal Leandro lo que quería evitar era el código completo la librería que aplico es la siguiente $('.js-example-basic-multiple').select2(); Commented el 6 feb. 2020 a las 16:18

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

Examina otras preguntas con la etiqueta o formula tu propia pregunta.