Ruby en los rieles: usando los rieles paralelos

Question

Estoy tratando de validar los campos de entrada usando Parsely. Lo he descubierto es que si agrego <form data-parsley-validate> ... </form>, ninguno de mis botones funciona, así que no puedo navegar (continuar a la página siguiente).

Así que aquí hay un ejemplo de lo que tengo, y todo lo que me gustaría hacer es hacerlo requerido, y dentro de un rango de 100-350.

<form data-parsley-validate>
  <ol>
<li>
  <p>
    <div class="measure_question">
          <b>Weight</b><i>(pounds):</i>
        </div> 
    <div class="measure_answer">
          <%= text_field(:baseline, :base_weight, :style => "width:100px;") %>
        </div> 
  </p>
</li>    
  </ol>
</form>

Cualquier ayuda sería muy apreciada. Ya tengo la gema instalada, creo que solo necesito averiguar cómo ingresar para interactuar con el front-end.

Editar. Un simple tutorial para obtener los rieles de perejil trabajando, con 1 ejemplo.

Me alejé de este proyecto por un corto tiempo, luego regresé y lo puse a trabajar. Quería proporcionar rápidamente una guía que obtendrá el perejil trabajando para los rieles para cualquier otra persona que necesita una respuesta rápida.

Paso 1: incluyen la gema "Parsley-Rails". Asegúrese de ejecutar su comando paquete.

Paso 2: Incluya los siguientes CSS, que es solo un código de inicio para la visualización de errores / éxitos.

Activos / STYLESSHEET / Custom.CSS.SSSS

/* Parsley */

input.parsley-success,
select.parsley-success,
textarea.parsley-success {
  color: #468847;
  background-color: #DFF0D8;
  border: 1px solid #D6E9C6;
}

input.parsley-error,
select.parsley-error,
textarea.parsley-error {
  color: #B94A48;
  background-color: #F2DEDE;
  border: 1px solid #EED3D7;
}

.parsley-errors-list {
  margin: 2px 0 3px 0;
  padding: 0;
  list-style-type: none;
  font-size: 0.9em;
  line-height: 0.9em;
  opacity: 0;
  -moz-opacity: 0;
  -webkit-opacity: 0;

  transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  -ms-transition: all .3s ease-in-;
  -moz-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
}

.parsley-errors-list.filled {
  opacity: 1;
}

Paso 3: Agregar 'Data-perejil-validate' a sus formularios.

antes:

<%= form_for @your_form do |f| %>

Después:

<%= form_for @your_form, html: {"data-parsley-validate" => ''} do |f| %>

Paso 4: Haz que algún campo sea necesario.

<%= text_field(:your_table, :weight_variable, :style => "width:100px;", :required => '') %>

y eso es todo. Espero que esto ayude a alguien más en el futuro.

Answer 1

Supongo que está utilizando la última versión de la gema "Parsley-Rails", y ha requerido Parsley en su archivo de manifiesto de tuberías de activos, ya que las instrucciones dicen.

Primero, debe agregar 'Data-Parsley-Valideate' a cada formulario, como lo ha hecho. Estoy usando Form_For, y la sintaxis que funcionó para mí fue:

<%= form_for @user, html: { 'data-parsley-validate' => '' } do |f| %>

Para los campos que desea validado, el validadores incorporados sección de la sección La documentación es útil para mostrarle las diferentes técnicas para la validación. Puede usar el validador de "rango" para verificar que los valores estén dentro de un rango dado.

Parsley.js admite algunos atributos HTML5, como "Requerido", además de su propia lista. Aquí hay un ejemplo de cómo validar que un campo de texto "Nombre" está presente y al menos dos caracteres de largo, desencadenando la validación en Blur:

<%= f.text_field :name, required: true, 'data-parsley-minlength' => '2', 'data-parsley-trigger' => 'blur' %>

Opciones de activación Use jQuery, y la sintaxis se enumera en la sección "UI para Field" de los documentos.

Por último, me pareció útil verificar la ejemplos proporcionados en el sitio de parsley.js . Asegúrese de que su HTML generado coincida con su sintaxis si no está viendo el comportamiento deseado.