javascript - How can I modify a date type field based when changing another date type field -
i have 2 input type date fields , when changing first 1 need add 14 business days set second one. how can this?
here code:
{% extends 'daciproveedorbundle::main.html.twig'%} {% form_theme form 'dacicontratosbundle:form:my_form_theme.html.twig' %} {% block title %}{{ parent() }} - edición de contratos{% endblock %} {% block css1st %} <link rel="stylesheet" href="{{ asset('bootstrap/css/custom-bootstrap-header.css') }}" > <link rel="stylesheet" href="{{ asset('bootstrap/css/custom-bootstrap-collapse.css') }}" > <link rel="stylesheet" href="{{ asset('bootstrap/css/custom-bootstrap-grid_and_table.css') }}" > <link rel="stylesheet" href="{{ asset('bootstrap/css/custom-bootstrap-tabs.css') }}" > {% endblock css1st %} {% block css2nd %} <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <link href="{{ asset('bundles/genemuform/select2-3.5.0/select2.css') }}" rel="stylesheet"/> <script src="{{ asset('bundles/genemuform/select2-3.5.0/select2.js') }}"></script> {{ form_javascript(form) }} {% endblock css2nd %} {% block javascripts %} <script type="text/javascript" src="{{ asset('bundles/dacicontratos/js/jquery-2.0.3.js') }}"></script> <!-- <script type="text/javascript" src="{{ asset('bundles/dacicontratos/js/set_form_seguimiento.js') }}"></script> --> <!-- <script type="text/javascript" src="{{ asset('bundles/dacicontratos/js/set_form_garantia.js') }}"></script> --> <script type="text/javascript" src="{{ asset('bundles/dacicontratos/js/set_form_contratos_completo.js') }}"></script> <!-- jquery ui --> <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" /> <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script> {% endblock %} {% block page_content %} {{ form_start(form) }} <ul id="mytab" class="nav nav-tabs" role="tablist"> <li {{ tab_selector|default('evaluacion') in ['evaluacion'] ? 'class="active"' : '' }} style="padding: 0px;"><a href="#evaluacion" role="tab" data-toggle="tab">evaluación</a></li> <li {{ tab_selector|default('seguimiento') in ['seguimiento'] ? 'class="active"' : '' }} style="padding: 0px;"><a href="#seguimiento" role="tab" data-toggle="tab">seguimientos</a></li> <li {{ tab_selector|default('garantia') in ['garantia'] ? 'class="active"' : '' }} style="padding: 0px;"><a href="#garantia" role="tab" data-toggle="tab">garantías y pólizas</a></li> <li {{ tab_selector|default('visita') in ['visita'] ? 'class="active"' : '' }} style="padding: 0px;"><a href="#visita" role="tab" data-toggle="tab">visitas de campo</a></li> </ul> <div id="mytabcontent" class="tab-content"> <div class="tab-pane fade {{ tab_selector|default('evaluacion') in ['evaluacion'] ? 'in active' : '' }}" id="evaluacion"> <br/><br/> <h2 style="font-family: 'oswald', sans-serif; font-weight: 300;">contratos</h2> <br/><br/> <ul> <li>{{ form_row(form.proveedor) }}</li> <li>{{ form_label(form.codigo_referencia, 'código referencia') }}{{ form_widget(form.codigo_referencia) }}</li> <li>{{ form_row(form.nombre) }}</li> <li>{{ form_label(form.contratotipo, 'tipo') }}{{ form_widget(form.contratotipo) }}</li> <li>{{ form_row(form.fecha_inicio) }}</li> <li>{{ form_row(form.fecha_fin) }}</li> <li>{{ form_row(form.monto) }}</li> <li><p class="subtitle">unidades</p></li> <div class="panel-group" id="accordion"> {% set counter = 0 %} {% array_unidad in unidades %} {% set counter = counter + 1 %} {% set unidad_nombre = "unidad_nombre" ~ counter %} {% set unidad_id = array_unidad.id %} <div class="panel panel-default"> <div class="panel-heading" data-toggle="collapse" {# data-parent="#accordion" #} href="#{{ unidad_nombre }}"> <h4 class="panel-title"> {{ array_unidad.nombre }} </h4> </div> <div id="{{ unidad_nombre }}" class="panel-collapse collapse in"> <div class="panel-body"> <ul class="wide_label"> {% array_contacto in array_unidad.contactos %} {% contacto in form.contactos %} {% if contacto.vars.value == array_contacto.id %} <li> {{ form_widget(contacto) }} {{ form_label(contacto) }} {{ form_errors(contacto) }} </li> {% endif %} {% endfor %} {% endfor %} </ul> </div> </div> </div> {% endfor %} </div> <li><p class="subtitle">sets de preguntas</p></li> {% set contador = 1 %} {% set count = 0 %} {% set cerrar_div = 'si' %} {% conjunto in form.conjuntos %} {% if contador == 1 , count == 0 %} <div class="row bg-custom-default"> {% set count = 1 %} {% else %} {% if contador == 1 , count == 1 %} <div class="row bg-custom-white"> {% set count = 0 %} {% endif %} {% endif %} <div class="col-md-3"> {{ form_widget(conjunto) }} {{ form_label(conjunto) }} </div> {% if contador == 3 %} </div> <!-- <br/><br/> --> {% set contador = 1 %} {% set cerrar_div = 'no' %} {% else %} {% set contador = contador + 1 %} {% set cerrar_div = 'si' %} {% endif %} {% endfor %} {% if cerrar_div == 'si' %} </div> <!-- <br/><br/> --> {% endif %} <br/> <br/> <li>{{ form_row(form.archivo) }}</li> {% if file_url defined , file_url != "" %} <div id="file_attached"> <li>{{ asset(file_url) }} - <a href="{{ asset(file_url) }}">descargar <br/><img src="{{ asset('images/attachment.png')}}"></a></li> </div> {% endif %} </ul> </div> <div class="tab-pane fade {{ tab_selector|default('seguimiento') in ['seguimiento'] ? 'in active' : '' }}" id="seguimiento"> <br/><br/> <h2 style="font-family: 'oswald', sans-serif; font-weight: 300;">registro</h2> <br/><br/> <table style="width: 750px; text-align: justify; border-collapse:separate; border-spacing:1em;"> <tr> <td>{{ form_label(form.proveedor, 'proveedor') }}</td> <td> {% set label = '' %} {% choice in form.proveedor.vars.choices %} {% if choice.value == form.proveedor.vars.value %} {% set label = choice.label %} {% endif %} {% endfor %} {{ label }} </td> </tr> <tr> <td>{{ form_label(form.nombre, 'nombre contrato') }}</td> <td>{{ form.nombre.vars.value }}</td> </tr> </table> <!-- <hr/> --> <ul> <li><ul class="seguimientos" data-prototype="{{ form_widget(form.seguimientos.vars.prototype)|e }}"> {% pregunta in form.seguimientos %} <li> {{ form_row(pregunta.titulo) }} {# <!-- {{ form_row(pregunta.seguimientotipo) }} --> #} {{ form_row(pregunta.fecha_entrega) }} {# <!-- {{ form_row(pregunta.fecha_prorroga) }} --> #} {{ form_row(pregunta.descripcion) }} {{ form_row(pregunta.loqueseespera) }} {{ form_row(pregunta.isrecibido) }} {{ form_row(pregunta.contactos) }} {{ form_row(pregunta.comentarios) }} {{ form_row(pregunta.archivo) }} {% if pregunta.archivo.vars.value.name defined %} {% if pregunta.archivo.vars.value.name not null %} <label style="padding-bottom: 40px;">descargar archivo: </label> <a href="{{ asset( pregunta.archivo.vars.value.webpath ) }}">{{ pregunta.archivo.vars.value.name }}</a> {% else %} <label style="padding-bottom: 40px;">descargar archivo: </label> <a href="{{ asset( pregunta.archivo.vars.value.webpath ) }}">clic aquí</a> {% endif %} {% endif %} {{ form_row(pregunta.cumplimientonocumplimiento) }} </li> {% endfor %} </ul> </li> </ul> </div> <div class="tab-pane fade {{ tab_selector|default('garantia') in ['garantia'] ? 'in active' : '' }}" id="garantia"> <br/><br/> <h2 style="font-family: 'oswald', sans-serif; font-weight: 300;">registro</h2> <br/><br/> <table style="width: 750px; text-align: justify; border-collapse:separate; border-spacing:1em;"> <tr> <td>{{ form_label(form.proveedor, 'proveedor') }}</td> <td> {% set label = '' %} {% choice in form.proveedor.vars.choices %} {% if choice.value == form.proveedor.vars.value %} {% set label = choice.label %} {% endif %} {% endfor %} {{ label }} </td> </tr> <tr> <td>{{ form_label(form.nombre, 'nombre contrato') }}</td> <td>{{ form.nombre.vars.value }}</td> </tr> </table> <ul> <li><ul class="garantias" data-prototype="{{ form_widget(form.garantias.vars.prototype)|e }}"> {% set cuenta = 0 %} {% garantia in form.garantias %} <li> {{ form_row(garantia.garantiatipo) }} {{ form_row(garantia.fecha_emision) }} {{ form_row(garantia.fecha_vencimiento) }} {{ form_row(garantia.fecha_recibido_daci) }} {{ form_row(garantia.fecha_entrega) }} {# fecha entrega al proveedor #} {{ form_row(garantia.empresa_emite_garantia) }} {{ form_row(garantia.tiempo_de_garantia) }} {{ form_row(garantia.estado) }} {{ form_row(garantia.isrecibido) }} {{ form_row(garantia.porcentaje) }} {{ form_row(garantia.monto) }} {{ form_row(garantia.comentarios) }} {{ form_row(garantia.archivo) }} {% if garantia.archivo.vars.value.name defined %} {% if garantia.archivo.vars.value.name not null %} <label style="padding-bottom: 40px;">descargar archivo: </label> <a href="{{ asset( garantia.archivo.vars.value.webpath ) }}">{{ garantia.archivo.vars.value.name }}</a> {% else %} <label style="padding-bottom: 40px;">descargar archivo: </label> <a href="{{ asset( garantia.archivo.vars.value.webpath ) }}">clic aquí</a> {% endif %} {% endif %} </li> {% set cuenta = cuenta + 1 %} {% endfor %} <script> (function($) { $(document).ready(function(){ //alert("hola"); /* var $second = jquery('#contratos_garantias_0_fecha_entrega').datepicker({ dateformat: 'yy-mm-dd' });*/ var prefix = 'myclass'; var $inputs = $('.' + prefix); $inputs.each(function (k, v) { if (k % 2 === 0) { var $second = jquery($inputs.get(k +1)).datepicker({ dateformat: 'yy-mm-dd' }); var $first = jquery(v).datepicker({ dateformat: 'yy-mm-dd', onselect: function (datestr) { var newdate = jquery.datepicker.parsedate('yy-mm-dd', datestr); newdate.setdate(newdate.getdate() + 10); $second.datepicker('setdate', newdate); } }); } }); }); })(jquery); </script> </ul> </li> </ul> </div> <div class="tab-pane fade {{ tab_selector|default('visita') in ['visita'] ? 'in active' : '' }}" id="visita"> <br/><br/> <h2 style="font-family: 'oswald', sans-serif; font-weight: 300;">registro</h2> <br/><br/> <table style="width: 750px; text-align: justify; border-collapse:separate; border-spacing:1em;"> <tr> <td>{{ form_label(form.proveedor, 'proveedor') }}</td> <td> {% set label = '' %} {% choice in form.proveedor.vars.choices %} {% if choice.value == form.proveedor.vars.value %} {% set label = choice.label %} {% endif %} {% endfor %} {{ label }} </td> </tr> <tr> <td>{{ form_label(form.nombre, 'nombre contrato') }}</td> <td>{{ form.nombre.vars.value }}</td> </tr> </table> <ul> <li><ul class="visitas" data-prototype="{{ form_widget(form.visitas.vars.prototype)|e }}"> {% visita in form.visitas %} <li> {{ form_row(visita.fechaprogramada) }} {{ form_row(visita.fechadevisita) }} {{ form_row(visita.isrealizada) }} {{ form_row(visita.observaciones) }} {{ form_row(visita.archivoinforme) }} {% if visita.archivoinforme.vars.value.name defined %} {% if visita.archivoinforme.vars.value.name not null %} <label style="padding-bottom: 25px;">descargar informe: </label> <a href="{{ asset( visita.archivoinforme.vars.value.webpath ) }}">{{ visita.archivoinforme.vars.value.name }}</a> {% else %} <label style="padding-bottom: 25px;">descargar informe: </label> <a href="{{ asset( visita.archivoinforme.vars.value.webpath ) }}">clic aquí</a> {% endif %} {% endif %} {{ form_row(visita.archivoimagen) }} {% if visita.archivoimagen.vars.value.name defined %} {% if visita.archivoimagen.vars.value.name not null %} <label style="padding-bottom: 25px;">descargar imagen: </label> <a href="{{ asset( visita.archivoimagen.vars.value.webpath ) }}">{{ visita.archivoimagen.vars.value.name }}</a> {% else %} <label style="padding-bottom: 25px;">descargar imagen: </label> <a href="{{ asset( visita.archivoimagen.vars.value.webpath ) }}">clic aquí</a> {% endif %} {% endif %} </li> {% endfor %} </ul> </li> </ul> </div> </div> {{ form_end(form) }} {% endblock %} here generated code have 3 of them because have many contratos_garantias_ _fecha_recibido_daci , contratos_garantias_ _fecha_entrega fields
<div> <label style="vertical-align: top; padding-bottom: 35px;" for="contratos_garantias_0_fecha_recibido_daci" class="required">fecha de recibido daci</label> <input type="date" id="contratos_garantias_0_fecha_recibido_daci" name="contratos[garantias][0][fecha_recibido_daci]" required="required" class="myclass" value="2014-12-12" /></div> <div><label style="vertical-align: top; padding-bottom: 35px;" for="contratos_garantias_0_fecha_entrega" class="required">fecha de devolución al proveedor</label> <input type="date" id="contratos_garantias_0_fecha_entrega" name="contratos[garantias][0][fecha_entrega]" required="required" class="myclass" value="2014-10-15" /></div> this part of code working right problem new fields added prototype capability added after page has loaded
<ul> <li><ul class="garantias" data-prototype="{{ form_widget(form.garantias.vars.prototype)|e }}"> {% set cuenta = 0 %} {% garantia in form.garantias %} <li> {{ form_row(garantia.garantiatipo) }} {{ form_row(garantia.fecha_emision) }} {{ form_row(garantia.fecha_vencimiento) }} {{ form_row(garantia.fecha_recibido_daci) }} {{ form_row(garantia.fecha_entrega) }} {# fecha entrega al proveedor #} {{ form_row(garantia.empresa_emite_garantia) }} {{ form_row(garantia.tiempo_de_garantia) }} {{ form_row(garantia.estado) }} {{ form_row(garantia.isrecibido) }} {{ form_row(garantia.porcentaje) }} {{ form_row(garantia.monto) }} {{ form_row(garantia.comentarios) }} {{ form_row(garantia.archivo) }} {% if garantia.archivo.vars.value.name defined %} {% if garantia.archivo.vars.value.name not null %} <label style="padding-bottom: 40px;">descargar archivo: </label> <a href="{{ asset( garantia.archivo.vars.value.webpath ) }}">{{ garantia.archivo.vars.value.name }}</a> {% else %} <label style="padding-bottom: 40px;">descargar archivo: </label> <a href="{{ asset( garantia.archivo.vars.value.webpath ) }}">clic aquí</a> {% endif %} {% endif %} </li> {% set cuenta = cuenta + 1 %} {% endfor %} <script> (function($) { $(document).ready(function(){ //alert("hola"); /* var $second = jquery('#contratos_garantias_0_fecha_entrega').datepicker({ dateformat: 'yy-mm-dd' });*/ var prefix = 'myclass'; var $inputs = $('.' + prefix); $inputs.each(function (k, v) { if (k % 2 === 0) { var $second = jquery($inputs.get(k +1)).datepicker({ dateformat: 'yy-mm-dd' }); var $first = jquery(v).datepicker({ dateformat: 'yy-mm-dd', onselect: function (datestr) { var newdate = jquery.datepicker.parsedate('yy-mm-dd', datestr); newdate.setdate(newdate.getdate() + 10); $second.datepicker('setdate', newdate); } }); } }); }); })(jquery); </script> </ul> the answer works charm tomanow solution had add code related javascript file makes prototype functionality work. this, every use case covered, mean when adding , modifying item.
var prefix = 'myclass'; var $inputs = $('.' + myclass); $inputs.each(function (k, v) { if (k % 2 === 0) { var $second = $($inputs.get(k +1)).datepicker({ dateformat: 'yy-mm-dd' }); var $first = $(v).datepicker({ dateformat: 'yy-mm-dd', onselect: function (datestr) { var newdate = $.datepicker.parsedate('yy-mm-dd', datestr); newdate.setdate(newdate.getdate() + 14); $second.datepicker('setdate', newdate); } }); } }); 
Comments
Post a Comment