Why do not you put the edges in red to the select as you do with the input? using the formValidation.io plugin

0

I'm using the plugin select2 but if I remove the library it does not mark the select.

Here is my form:

Here is a simpler one:

Here is the HTML code:

<form class="form-horizontal" role="form" id="form-crear" class="form_con_select2">
<div class="modal-body"> 
	<div class="form-group">
		<label for="crear_nombre" class="control-label col-sm-2">Nombre: </label>
		<div class="col-sm-10">
			<input type="text" class="form-control" id="crear_nombre" name="crear_nombre">
		</div>
	</div> 
	<div class="form-group">
		<label for="crear_descripcion" class="control-label col-sm-2">Descripción: </label>
		<div class="col-sm-10">
			<input type="text" class="form-control" id="crear_descripcion" name="crear_descripcion">
		</div> 
	</div>
	<div class="form-group">
		<label for="crear_marca" class="control-label col-sm-2">Marca:</label>
		<div class="col-sm-8 selectContainer">
			<select id="crear_marca" name="crear_marca" style="width: 100%;">
				@foreach($marcas as $marca) 
					<option value="{{$marca->id}}">{{$marca->nombre}}</option>
				@endforeach
			</select>
		</div>
	</div>
</div>
<div class="modal-footer">
	<button type="button" class="btn btn-default" data-dismiss="modal">
		<span class="glyphicon glyphicon-remove"></span> Cerrar 
	</button>
	<button type="button" id="Guardar" name="Guardar" class="btn btn-primary">
		<span class="fa fa-save"> Guardar</span>
	</button>
</div>
</form>

Here is the script:

$('#form-crear').formValidation({
	framework: 'bootstrap',
	excluded: ':disabled',
	button: {
		selector: '#Guardar',
		disabled: 'disabled'
	},
	icon: {
		valid: 'glyphicon glyphicon-ok',
		invalid: 'glyphicon glyphicon-exclamation-sign',
		validating: 'glyphicon glyphicon-refresh'
	},
	fields: {
		crear_nombre: {
			validators: {
				notEmpty: {
					message: 'Campo requerido'
				},
				stringLength: {
					min: 5,
					max: 50,
					message: 'Introduzca un valor entre 5 a 50 caracteres de largo'
				},
				regexp: {
					regexp: /^[a-zA-Zá-úÁ-Ú ñÑ]+$/,
					message: 'Solo se permite letras'
				},
				remote: {
					message: 'Ya esta registrado',
					url: "personas/comprobacion",  
					type: "post",
						global: false,
					data: {
						valor: 'crear'
					},
					async: true
				}
			}
		},
		crear_descripcion: {
			validators: {
				notEmpty: {
					message: 'Campo requerido'
				},
				stringLength: {
					min: 5,
					max: 50,
					message: 'Introduzca un valor entre 5 a 50 caracteres de largo'
				},
				regexp: {
					regexp: /^[a-zA-Zá-úÁ-Ú ñÑ]+$/,
					message: 'Solo se permite letras'
				}
			}
		},
		crear_marca: {
			validators: {
				notEmpty: {
					message: 'Campo requerido'
				}
			}
		}
	}
})
.on('err.form.fv', function(e, data) {
})
.on('success.form.fv', function(e) {
});

and here is an example of the plugin's website: link

    
asked by Pablo Contreras 27.01.2017 в 08:16
source

1 answer

1

Looking at the example of the web plugin, I see that you need to put the class "select2-select" to the select . It could be that this library initializes the select searching for that class in your HTML.

<select id="crear_marca" name="crear_marca" class="select2-select" style="width: 100%;">
    @foreach($marcas as $marca) 
        <option value="{{$marca->id}}">{{$marca->nombre}}</option>
    @endforeach
</select>
    
answered by 27.01.2017 в 08:35