0

Cree mi formulario en mi controlador y puedo registrar datos de manera normal, pero no puedo manejar los campos con JavaScript.

  • CREE MI FORMULARIO DE LA SIGUIENTE MANERA EN MI CONTROLADOR:

      $form =$this->createFormBuilder()
          ->add('tipo_comprobante')
          ->add('serie_comprobante')
          ->add('num_comprobante')
          ->add('fecha_hora',DateType::class)
          ->add('estado')
          ->add('tipo_pago')
          ->add('total_compra')
          ->add('deuda')
          ->add('cantidad', NumberType::class)
          ->add('precio_compra', NumberType::class)
          ->add('Guardar',SubmitType::class) 
      ->getForm();
    
  • TRATE DE "PERSONALIZAR" LOS CAMPOS EN EL TEMPLATE DE LA SIGUIENTE FORMA:

    {{ form_start(form) }}
      <div class="col-lg-2 col-sm-2 col-md-2 col-xs-2">
          <label>DETALLE SALIDA</label>
          <div class="col" name="ccantidad_ingreso" id="ccantidad_ingreso">
               {{ form_row(form.cantidad) }}
          </div>
          <div class="col" name="pprecio_compra" id="pprecio_compra">
               {{ form_row(form.precio_compra) }}
          </div>
          <label> Medicamento </label>                     
          <input type="text" name="z" id="z">
      </div>
    
      <div class="row">
         <div class="form-group">
             <div class="col-lg-8 col-sm-8 col-md-8 col-xs-8">
                 <button type="button" id="bt_add" class="btn btn-primary">Agregar</button>
             </div>
         </div>
       </div>
     {{ form_end(form) }}
    
  • TRATE DE MANIPULARLO CON JAVASCRIPT:

    {% block javascripts %}
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    
    <script>
    $(document).ready(function()
     {
       $('#bt_add').click(function()
     {
          agregar();
      });
    });
    
    function agregar()
      {
          //$("#").val()
          precio_compra = document.getElementById("pprecio_compra").value;
          cantidad_ingreso = document.getElementById("ccantidad_ingreso").value;
          z = document.getElementById("z").value;
    
          console.log(precio_compra);
          console.log(cantidad_ingreso); 
          console.log(z);
      }
    </script>
    
    {% endblock %}
    
  • MI PROBLEMA:

No puedo capturar los valores del formulario que cree en el controlador, pero si captura los valores del "input" que cree para probar y solo ignora los valores del formulario.

introducir la descripción de la imagen aquí

1
  • 1
    Parece error de tecleo, porque en Symfony defines campos precio_compra y cantidad, pero en Javascript tratas de acceder con: pprecio_compra y ccantidad_ingreso.
    – Triby
    el 17 ago. 2021 a las 14:45

1 respuesta 1

1

Al llamar a precio_compra = document.getElementById("pprecio_compra").value estas cogiendo el value del div en lugar del input. Lo que necesitas es hacerle un .value del elemento input.

Utiliza la consola del navegador para saber que nombre de clase o id tiene realmente, ya que symfony crea sus propios valores para los atributos class y name.

Otra de las opciones que tienes es asignarle un id tu mismo al input en la vista utilizando los Form Rendering Variables:

{{ form_widget(form.campo1, { 'id': 'id_del_campo' }) }}

En tu caso como estas usando form_row sería así:

{{ form_row(form.campo1, { 'id': 'id_del_campo' }) }}

Lo mismo, pero añadiendo un class en lugar de un id:

{{ form_widget(form.campo1, { 'attr': { 'class': 'class_del_campo' } }) }}

Haciendo estos últimos evitas usar los name y class creados por el formulario de Symfony. De esta manera, cualquier script que tengas llamando a un id o un class del form seguirá funcionando incluso después de cambiar nombres de campos o el formulario en sí del FormType.

1
  • Gracias me funcionó. :D el 19 ago. 2021 a las 5:59

Tu Respuesta

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

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.