0

Tengo un botón en mi tabla que abre un modal de bootstrap para agregar un servicio que presta mi empresa, pero al enviar no envía nada, el formulario llega vacío al método AddServicios del view.py, cuando pregunto si el formulario es válido, me devuelve False(valido=form.is_valid()) y me envía solo el parametro csrfmiddlewaretoken del formulario

view.py:

def AddServicios(request):
   data=dict()
  if request.method=='POST':
    form=ServiciosForm(request.POST)
    valido=form.is_valid()
    if form.is_valid():
        form.save()
  else:
      form= ServiciosForm()
 area_List = Area.objects.filter()
 context = { 'form': form}
 data['html_form'] = render_to_string('precios/add_servicios2.html', context, request=request)
 return JsonResponse(data)

forms.py:

   class ServiciosForm(ModelForm):
       class Meta:
          model = Servicios
          fields = [ 'tiposervicio', 'unidadM', 'precioCUP', 'precioCUC',  'precioT', 'anno', 'areaS']

add_servicios2.html:

<form  class="create_form" method="POST" action="{% url 'eicma:add_servicios1' %}">
    {% csrf_token %}
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">Adicionar Servicio</h4>
    </div>
    <div class="modal-body">
        <div class="panel-body">
                <label for="servicio" class="control-label col-lg-2">Tipo de Servicio:</label>
                <div class="col-lg-8">
                    <input class="form-control" id="servicio" type="text"
                           placeholder="Tipo de Servicio" value="epepe">
                </div>
                <label for="area" class="control-label col-lg-2">Área:</label>
                <div class="col-lg-5">
                    <select class="form-control" id="area"  >
                        <option value="">Seleccionar ...</option>
                        {% for area in area_List %}
                            <option value="{{ area.area }}">{{ area.area }}</option>
                        {% endfor %}
                    </select>
                </div>
                <label for="unidadmedida" class="control-label col-lg-2 ">U/M:*</label>
                <div class="col-lg-3">
                    <select class="form-control" id="unidadmedida">
                        <option value="">Seleccionar ...</option>
                        <option value="Uno">Uno</option>
                        <option value="">Hora</option>
                        <option value="Hora">Horas/Alumno</option>
                        <option value="Mes">Mes</option>
                        <option value="Mes/Uno">Mes/Uno</option>
                        <option value="Mes/Busón">Mes/Busón</option>
                        <option value="Mes/Cta">Mes/Cta</option>
                    </select>
                </div>
                <label for="precioP" class="control-label col-lg-2">Precio MN:</label>
                <div class="col-lg-3  ">
                    <div class="input-group">
                        <input class="form-control" id="precioP" type="text" placeholder="Precio MN" value="444">
                        <span class="input-group-addon">$</span>
                    </div>
                </div>
                <label for="precioC" class="control-label col-lg-2">Precio CUC:</label>
                <div class="col-lg-3  ">
                    <div class="input-group">
                        <input class="form-control" id="precioC" type="text" placeholder="Precio CUC">
                        <span class="input-group-addon">$</span>
                    </div>
                </div>
                <label for="precioT" class="control-label col-lg-2">Precio Total:</label>
                <div class="col-lg-3  ">
                    <div class="input-group">
                        <input class="form-control" id="precioT" type="text" placeholder="Precio Total">
                        <span class="input-group-addon">$</span>
                    </div>
                </div>
                <label for="anno" class="control-label col-lg-2">Año:</label>
                <div class="col-lg-2">
                    <input class="form-control" id="anno" type="text" placeholder="Año">
                </div>
        </div>

    </div>
    <div class="modal-footer">

        <button type="submit" id="adicionar" class="btn btn-primary">Adicionar</button>
        <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
    </div>
</form>

listado.html:

  <botton class="btn btn-primary show-form" ><span class="glyphicon glyphicon-plus"></span> Crear Servicio</botton>
  <div class="row col-lg-12 ">
        <div class="  table-responsive table-bordered">
            <table id="tabla" class=" table table-striped table-bordered table-hover table-condensed "
                   cellspacing="0" width="100%">
                <thead>
                <tr class="bg-danger">
                    <th class="text-center col-lg-1">Número</th>
                    <th class="text-center  col-lg-3">Tipo Servicio</th>
                    <th class="text-center  col-lg-2">Unidad Medida</th>
                    <th class="text-center  col-lg-1">Precio Total</th>
                    <th class="text-center  col-lg-1">Año</th>
                    <th class="text-center  col-lg-2">Área Servicio</th>
                    <th class="text-center  col-lg-1">Opciones</th>
                </tr>
                </thead>
                <tbody class="table">
                {% for servicio in servicios_List %}
                    <tr>
                        <td  class=" text-center">{{ servicio.id }}</td>
                        <td>{{ servicio.tiposervicio }}</td>
                        <td class=" text-center">{{ servicio.unidadM }}</td>
                        <td class=" text-center">{{ servicio.precioT }}</td>
                        <td class=" text-center">{{ servicio.anno }}</td>
                        <td class=" text-center">{{ servicio.areaS }}</td>                            
                    </tr>
                {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
    <div id="popup" class="modal fade" role="dialog">
    </div>
</div>
<div id="modal-servicios" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
        </div>
    </div>
</div>

modal.js:

 $(document).ready(function () {
     $('.show-form').click(function () {
        $.ajax({
           url: '/eicma/add_servicios1',
           type: 'get',
           dataType: 'json',
           beforeSend: function () {
              $('#modal-servicios').modal('show')
          },
         success: function (data) {
              $('#modal-servicios .modal-content').html(data.html_form)
           }
      })
  })
  $('#modal-servicios').on('submit', '.create_form', function () {
    var form = $(this);
    $.ajax({
        url: form.attr('action'),
        data: form.serialize(),
        type: form.attr('method'),

        success: function (data) {
            console.log(data)
        }
    })
    return false;
})
1
  • Los comentarios no deben usarse para discusiones extendidas; esta conversación ha sido trasladada a un chat.
    – lois6b
    Commented el 13 oct. 2017 a las 13:36

2 respuestas 2

0

Te envia el formulario vacío por que el orm de django recoge el atributo name del POST.

Añade a tus inputs el atributo "name" y ponle en mismo que tienes en id, deberias poder recibir en el POST esos elementos.

 <input class="form-control" id="precioP" name="precioP" type="text" placeholder="Precio MN" value="444">
0
0

De nuevo por acá, estoy ahora trabado con el editar, estoy enviando al model el formulario con el modelo pero los input y los seleccionar no me coge los valores, le tengo puesto el name con el mismo nombre que en el modelo y nada, me he guiado por este ejemplo https://simpleisbetterthancomplex.com/tutorial/2016/11/15/how-to-implement-a-crud-using-ajax-and-json.html

Tu Respuesta

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

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