Semantic UI(Formularios y validaciones)

Hola bienvenido al segundo aporte que hago, en este apartado aprenderás como crear tu primer formulario en semantic-ui y como validar los campos de este.

Lo primero que tenemos que hacer es importar los archivos de semantic-ui y jquery, primero importaremos el archivo .css de semantic.

Lo siguiente que haremos es importar los archivos de semantic y jquery .js

Con esto ya tendremos a nuestra disposición todos los elementos de semantic-ui los siguiente que haremos es agregar las etiqueta html para crear nuestro formulario, nota las clases que uso en el ejemplo como “ui container” las cuales son propias de semantic-ui.

Con esto tendremos un formulario con tres campos y un botón como el siguiente:

Ahora viene lo interesante, como validar los campos con semantic-ui, es simple. Tenemos que hacer referencia al formulario en este caso con la sintaxis de Jquery $(‘.ui.form’) y llamar al método .form(), dentro del método buscaremos los campos con la propiedad fields de la siguiente manera:

Y listo no tenemos que hacer nada mas si los campos no cumplen con la condición que nosotros le agregamos en la propiedad type no se hara el post del formulario.