Solved

Could you explain why 02 Bootscrap modal screens running at the same form could have different behaviours?

Posted on 2016-10-05
16
87 Views
Last Modified: 2016-10-07
Hi Experts

Could you explain why 02 Bootscrap modal screens running at the same form could have different behaviours?

 1st:  Edit

 <!-- Begin: Modal Edit -->
        <div id="edit" class="modal fade" tabindex="-1" role="dialog">
            <div class="modal-dialog modal-width-meeta">
                <div class="modal-content">

Open in new window


2nd:  View
       <div id="view" class="modal fade" tabindex="-1" role="dialog">
            <div class="modal-dialog modal-width-meeta">
                <div class="modal-content">

Open in new window


Every modal contains this same code content:

<<div class="col-xs-4 mb20">
 <div class="input-group">
	<span class="validar">
		<button type="button" class="btn btn-primary" id="download" name="download">Download do Arquivo</button>
	</span>
 </div>
</div>

Open in new window


And  access the same jQuery code:

var baseurl = "<?php print base_url(); ?>";

$("#download").click(function(){

	var serv = $('#id_reclamacao').val();
	
	$.ajax({
		url: baseurl+'reclamacao/get/' + serv,
		type: 'post',
		cache: false,
		contentType: false,
		processData: false,
		dataType: 'json',
		data: serv,
		success: function (data) {
		var anexo = data['anexo'];

		// Download
		window.open(anexo);
		
		},
		error: function(jqXHR) {
			bootbox.alert(jqXHR.responseText);
		}
	});
});

Open in new window


The modal edit runs perfectly, the view edit simply doesn't run (aparently the jQuery isn't fired)

Thanks in advance.
0
Comment
Question by:Eduardo Fuerte
  • 7
  • 4
  • 3
  • +2
16 Comments
 
LVL 22

Expert Comment

by:Ferruccio Accalai
ID: 41830071
<<div class="col-xs-4 mb20">
 <div class="input-group">
	<span class="validar">
		<button type="button" class="btn btn-primary" id="download" name="download">Download do Arquivo</button>
	</span>
 </div>
</div>

Open in new window

Is this code copied from the "view" modal?
Because here I see a double << at the start. Is it a typo when you posted the code here or is it a coding error in the "view" modal?
0
 

Author Comment

by:Eduardo Fuerte
ID: 41830093
Hi

It was just a copy error, it's correct at my code
<div class="col-xs-4 mb20">                                      
<hr>  
<div class='row'>
 <div class="col-xs-4 mb20">
		<div class="input-group">
			<span class="validar">
				<button type="button" class="btn btn-primary" id="download" name="download">Download do Arquivo</button>
			</span>
		</div>
	</div>
</div>
</div>

Open in new window

0
 
LVL 51

Expert Comment

by:Julian Hansen
ID: 41830094
If the << was a typo then we would need to see the code in context. Something missing or an ordering issue somewhere?
0
 
LVL 108

Expert Comment

by:Ray Paseur
ID: 41830103
You can use the Chrome browser and turn on the developer tools to see the console log and watch the JavaScript run.  This will show you any JS errors.  It can also let you manipulate JS and CSS.  Really useful!
https://developer.chrome.com/devtools
http://discover-devtools.codeschool.com/
http://tutorialzine.com/2015/03/15-must-know-chrome-devtools-tips-tricks/
0
 
LVL 30

Expert Comment

by:Marco Gasi
ID: 41830104
If the 2 modals are in the same view, the issue is that you have 2 buttons with id="download": change id to class.
<div class="col-xs-4 mb20">
 <div class="input-group">
	<span class="validar">
		<button type="button" class="btn btn-primary" class="download" name="download">Download do Arquivo</button>
	</span>
 </div>
</div>

Open in new window

And obviously change the jquery:
var baseurl = "<?php print base_url(); ?>";

$(".download").click(function(){

	var serv = $('#id_reclamacao').val();
	
	$.ajax({
		url: baseurl+'reclamacao/get/' + serv,
		type: 'post',
		cache: false,
		contentType: false,
		processData: false,
		dataType: 'json',
		data: serv,
		success: function (data) {
		var anexo = data['anexo'];

		// Download
		window.open(anexo);
		
		},
		error: function(jqXHR) {
			bootbox.alert(jqXHR.responseText);
		}
	});
});

Open in new window

1
 

Author Comment

by:Eduardo Fuerte
ID: 41830231
I changed to class for the 02 modals and the "download" stopped working in Edit too....

<button type="button" class="btn btn-primary" class="download" name="download">Download do Arquivo</button>

Open in new window


Another try is to change another repeated id :

<input type="hidden" class="id_reclamacao" name="id_reclamacao" value="">

Open in new window



In jQuery
var serv = $('.id_reclamacao').val();

Open in new window


My other try was change the id for the modal view to a different id:   modal view
 <button type="button" class="btn btn-primary" id="download_v" name="download_v">Download do Arquivo</button>

Open in new window

And a copy of the jQuery to be called to download_v


The download of edit view runs perfect.  If the download of edit modal is first called then the download of view modal runs ok.

But if I reload the form and first call the view modal - even changing the textbox  to "id_reclamacao_v" this error arises.
 
img002
0
 
LVL 30

Expert Comment

by:Marco Gasi
ID: 41830337
I changed to class for the 02 modals and the "download" stopped working in Edit too....
Have you changed jquery code to $('.download').click?
Do a thing: post here the 2 modals and the jquery call you are using, tht is all the code involved. The error message you get is identical to the previous one so probably it means that you can't get the value for serv variable and this is relted to the change made to ids and classes. But instead of guesing the whole markup and current jquery it's better to see it :)
0
 
LVL 51

Expert Comment

by:Julian Hansen
ID: 41830346
Please post the markup for both modals and the buttons that launch them along with any relevant JavaScript - it is not easy to see from the pieces you have posted what is going on. I am pretty sure it is a very small issue but to see it we need to see the code in context.
0
How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

 

Author Comment

by:Eduardo Fuerte
ID: 41830412
I changed to class acordingly to your suggestion.

Here is the code.
<!-- Begin: Content -->
<section id="content" class="table-layout animated fadeIn">
	<!-- Begin: .tray-center -->
	<div class="tray tray-center">
	
		<!-- Begin: Listagem -->
        <div class="panel">
            <div class="panel-menu admin-form theme-primary">
                <div class="row">
                    <div class="col-sm-12">
                        <span class="fa fa-building mr10"></span>
                        <span>Solicitações de Reembolso</span>
                    </div>
                </div>
            </div>
            <div class="panel-body pn">
				<button class='btn btn-primary btn-gradient btn-alt item-active' onClick ="$('#datatables').tableExport({type:'excel',escape:'false'});">Excel</button>
                <div class="col-sm-12">
                   
                </div>
            </div>
        </div>
        <!-- End: Listagem -->

        <!-- Modal View !!!!!!!!!!!!!!!!!!!!!!! -->

        <!-- Begin: Modal Edit -->
        <div id="edit" class="modal fade" tabindex="-1" role="dialog">
            <div class="modal-dialog modal-width-projeto">
                <div class="modal-content">
                    <!-- Begin: Modal Header -->
                    <div class="modal-header bg-info bg-projeto">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">×</span>
                        </button>
                        <h4 class="modal-title">
                            <i class="mr10 fa fa-building"></i>
                            <span>Reclamação</span>
                        </h4>
                    </div>
                    <!-- End: Modal Header -->
                    <!-- Beign: Modal Body -->
                    <div class="modal-body modal-body-projeto">
                        <div class="panel panel-projeto mt-10">
                            <!-- Begin: Form Edit -->
                            <form method="post" action="#" id="entity-form" enctype="multipart/form-data">
                                <input type="hidden" class="id_reclamacao" name="id_reclamacao" value="">

                                <div class="panel-body panel-body-projeto p10 pb10 tab-content pn br-n admin-form">
                                    <!-- Begin: Campos -->
                                    <div class="row">
                                        <!-- Seguradora -->
                                        <div class="col-xs-12 mb15">
                                            <label for="fk_seguradora" class="field-label text-muted mb10">Seguradora</label>
                                            <label for="fk_seguradora" class="validar field select">
                                                <?php echo $fk_seguradora;?>
                                                <i class="arrow double"></i>
                                            </label>
                                        </div>
                                    </div>
                                    <div class="row">
                                    	<!-- Data -->
                                        <div class="col-xs-4 mb15">
                                            <label for="data" class="field-label text-muted mb10">Data</label>
                                            <label for="data" class="validar field select">
                                                <input type='text'id='data' name='data' class="form-control gui-input br-light light" placeholder=""/>
                                            </label>
                                        </div>
                                        <!-- Interna/Externa -->
                                        <div class="col-xs-4 mb20">
                                            <label for="interna_externa" class="field-label text-muted mb10">Interna/Externa</label>
											<div class="mt15">
												<label class="radio-inline mr10">
													<input type="radio" name="interna_externa" id="interna" value="I">Interna
												</label>
												<label class="radio-inline mr10">
													<input type="radio" name="interna_externa" id="externa" value="E">Externa
												</label>
											</div>
                                        </div>
                                    </div>
                                    <hr>
                                    <div class="row">
                                    	<!-- Enviado Por -->
                                        <div class="col-xs-6 mb20">
                                            <label for class="field-label text-muted mb10">Enviado Por</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-cog c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="enviado_por" id="enviado_por" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                        <!-- Nome Reclamante -->
                                        <div class="col-xs-6 mb20">
                                            <label for class="field-label text-muted mb10">Nome do cliente (Reclamante)</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-user c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="nome_reclamante" id="nome_reclamante" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                    	<!-- Genero -->
                                        <div class="col-xs-4 mb20">
                                            <label for="genero" class="field-label text-muted mb10">Genero</label>
                                            <label for="genero" class="validar field select">
                                                <select name="genero" id='genero'>
                                                    <option value="">Selecione ...</option>
                                                    <option value="M">Masculino</option>
                                                    <option value="F">Feminino</option>
                                                </select>
                                            </label>
                                        </div>
                                        <!-- Interna/Externa -->
                                        <div class="col-xs-4 mb20">
                                            <label for="fisica_juridica" class="field-label text-muted mb10">Pessoa Fisica/Juridica</label>
                                            <div class="mt15">
                                                <label class="radio-inline mr10">
                                                    <input type="radio" name="fisica_juridica" id="fisica" value="F">Fisica
                                                </label>
                                                <label class="radio-inline mr10">
                                                    <input type="radio" name="fisica_juridica" id="juridica" value="J">Juridica
                                                </label>
                                            </div>
                                        </div>
                                        <!-- CPF CNPJ -->
                                        <div class="col-xs-4 mb20">
                                            <label for class="field-label text-muted mb10">CPF/CNPJ</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-cog c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="cpf_cnpj" id="cpf_cnpj" class="form-control gui-input br-light light" onkeypress='mascaraMutuario(this,cpfCnpj)' onblur='clearTimeout()' maxlength="18">
                                                </span>
                                            </div>
                                        </div>
                                        <!-- Data de Atendimento -->
                                        <div class="col-xs-4 mb15">
                                            <label for="data_atendimento" class="field-label text-muted mb10">Data de Atendimento</label>
                                            <label for="data_atendimento" class="validar field select">
                                                <input type='text'id='data_atendimento' name='data_atendimento' class="form-control gui-input br-light light" placeholder=""/>
                                            </label>
                                        </div>
                                        <!-- SISE -->
                                        <div class="col-xs-6 mb20">
                                            <label for class="field-label text-muted mb10">SISE</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-cog c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="sise" id="sise" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                    <hr>
                                    <div class="row">
                                    	<!-- Nome do Produto -->
                                        <div class="col-xs-8 mb15">
                                            <label for="fk_nome_produto" class="field-label text-muted mb10">Nome do Produto</label>
                                            <label for="fk_nome_produto" class="validar field select">
                                                <?php echo $fk_nome_produto;?>
                                                <i class="arrow double"></i>
                                            </label>
                                        </div>
                                        <!-- Servico -->
                                        <div class="col-xs-6 mb15">
                                            <label for="fk_servico" class="field-label text-muted mb10">Serviço</label>
                                            <label for="fk_servico" class="validar field select">
                                                <?php echo $fk_servico;?>
                                                <i class="arrow double"></i>
                                            </label>
                                        </div>
                                        <!-- Sub_servico -->
                                        <div class="col-xs-6 mb15">
                                            <label for="fk_sub_servico" class="field-label text-muted mb10">Sub Serviço!</label>
                                            <label for="fk_sub_servico" class="validar field select">
                                                <?php echo $fk_sub_servico;?>
                                                <i class="arrow double"></i>
                                            </label>
                                        </div>
                                        <!-- UF -->
                                        <div class="col-xs-2 mb15">
                                            <label for="uf" class="field-label text-muted mb10">UF</label>
                                            <label for="uf" class="validar field select">
                                                <select name="uf" id="uf">
                                                    <option value="">Selecione ...</option>
                                                    <option value="AC">AC</option>
                                                    <option value="AL">AL</option>
                                                    <option value="AP">AP</option>
                                                    <option value="AM">AM</option>
                                                    <option value="BA">BA</option>
                                                    <option value="CE">CE</option>
                                                    <option value="DF">DF</option>
                                                    <option value="ES">ES</option>
                                                    <option value="GO">GO</option>
                                                    <option value="MA">MA</option>
                                                    <option value="MT">MT</option>
                                                    <option value="MS">MS</option>
                                                    <option value="MG">MG</option>
                                                    <option value="PA">PA</option>
                                                    <option value="PB">PB</option>
                                                    <option value="PR">PR</option>
                                                    <option value="PE">PE</option>
                                                    <option value="PI">PI</option>
                                                    <option value="RJ">RJ</option>
                                                    <option value="RN">RN</option>
                                                    <option value="RS">RS</option>
                                                    <option value="RO">RO</option>
                                                    <option value="RR">RR</option>
                                                    <option value="SC">SC</option>
                                                    <option value="SP">SP</option>
                                                    <option value="TO">TO</option>
                                                </select>
                                            </label>
                                        </div>
                                        <!-- Cidade -->
                                        <div class="col-xs-10 mb20">
                                            <label for="cidade" class="field-label text-muted mb10">Cidade</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-map-marker c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="cidade" id="cidade" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                    <hr>
                                    <div class="row">
                                        <!-- Origem do Problema -->
                                        <div class="col-xs-6 mb15">
                                            <label for="fk_origem_problema" class="field-label text-muted mb10">Origem do Problema</label>
                                            <label for="fk_origem_problema" class="validar field select">
                                                <?php echo $fk_origem_problema;?>
                                                <i class="arrow double"></i>
                                            </label>
                                        </div>

                                        <script type="text/javascript">
                                            //Carrega o Dropdown de motivo_reclamação de acordo com a origem selecionada
                                            $(function () {
                                                $("#fk_origem_problema").change(function() {
                                                    var serv = $('#fk_origem_problema').val();
                                                    
                                                    $(".validar.field.select.fk_motivo_reclamacao").empty();
                                                    
                                                    $.ajax({
                                                        url: base_url('reclamacao/get_motivo/' + serv),
                                                        type: 'post',
                                                        cache: false,
                                                        contentType: false,
                                                        processData: false,
                                                        dataType: 'json',
                                                        data: serv,
                                                        success: function (data) {
                                                            $(".validar.field.select.fk_motivo_reclamacao").append(data);
                                                        },
                                                        error: function(jqXHR) {
                                                            bootbox.alert(jqXHR.responseText);
                                                        }
                                                    });

                                                });
                                            });
                                        </script>

                                        <!-- Motivo da Reclamacao -->
                                        <div class="col-xs-6 mb15">
                                            <label for="fk_motivo_reclamacao" class="field-label text-muted mb10">Motivo da Reclamação</label>
                                            <label for="fk_motivo_reclamacao" class="validar field select fk_motivo_reclamacao">
                                                <i class="arrow double"></i>
                                            </label>
                                        </div>
                                        <!-- Base Prestador -->
                                        <div class="col-xs-6 mb15">
                                            <label for="fk_base_prestador" class="field-label text-muted mb10">Base Prestador</label>
                                            <label for="fk_base_prestador" class="validar field select">
                                                <?php echo $fk_base_prestador;?>
                                                <i class="arrow double"></i>
                                            </label>
                                        </div>
                                        <!-- Nome do Agente -->
                                        <div class="col-xs-12 mb20">
                                            <label for="nome_agente" class="field-label text-muted mb10">Nome do Agente</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-user  c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="nome_agente" id="nome_agente" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                    <hr>
                                    <div class="row">
                                    	<!-- Enviado ao Departamento em: -->
                                        <div class="col-xs-4 mb15">
                                            <label for="enviado_dpto_em" class="field-label text-muted mb10">Enviado ao Departamento em:</label>
                                            <label for="enviado_dpto_em" class="validar field select">
                                                <input type='text'id='enviado_dpto_em' name='enviado_dpto_em' class="form-control gui-input br-light light" placeholder=""/>
                                            </label>
                                        </div>
                                        <!-- Resposta do Departamento em: -->
                                        <div class="col-xs-4 mb15">
                                            <label for="resposta_dpto_em" class="field-label text-muted mb10">Resposta do Departamento em:</label>
                                            <label for="resposta_dpto_em" class="validar field select">
                                                <input type='text'id='resposta_dpto_em' name='resposta_dpto_em' class="form-control gui-input br-light light" placeholder=""/>
                                            </label>
                                        </div>
                                        <!-- Responsavel -->
                                        <div class="col-xs-12 mb20">
                                            <label for="responsavel" class="field-label text-muted mb10">Responsavel</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-user c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="responsavel" id="responsavel" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                        <!-- Ações do Departamento -->
                                        <div class="col-xs-12 mb20">
                                            <label for="acoes_dpto" class="field-label text-muted mb10">Ações do Departamento</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-pencil c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="acoes_dpto" id="acoes_dpto" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                        <!-- Comentários|Reclamações|Elogios -->
                                        <div class="col-xs-12 mb20">
                                            <label for="comentarios" class="field-label text-muted mb10">Comentários|Reclamações|Elogios</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-comment c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="comentarios" id="comentarios" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                        <!-- Parecer de Qualidade -->
                                        <div class="col-xs-12 mb20">
                                            <label for="parecer" class="field-label text-muted mb10">Parecer de Qualidade</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-pencil c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="parecer" id="parecer" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                    <hr>
                                    <div class="row">
                                    	<!-- Recebido em: -->
                                        <div class="col-xs-4 mb15">
                                            <label for="recebido_em" class="field-label text-muted mb10">Recebido em:</label>
                                            <label for="recebido_em" class="validar field select">
                                                <input type='text'id='recebido_em' name='recebido_em' class="form-control gui-input br-light light" placeholder=""/>
                                            </label>
                                        </div>
                                        <!-- Respondido em: -->
                                        <div class="col-xs-4 mb15">
                                            <label for="respondido_em" class="field-label text-muted mb10">Respondido em:</label>
                                            <label for="respondido_em" class="validar field select">
                                                <input type='text'id='respondido_em' name='respondido_em' class="form-control gui-input br-light light" placeholder=""/>
                                            </label>
                                        </div>
                                        <!-- Tempo Resposta -->
                                        <div class="col-xs-4 mb20">
                                            <label for="tempo_resposta" class="field-label text-muted mb10">Tempo Resposta</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-clock-o c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="tempo_resposta" id="tempo_resposta" class="form-control gui-input br-light light" placeholder="" readonly aria-invalid="false">
                                                </span>
                                            </div>
                                        </div>

                                        <script type="text/javascript">
                                            $(function () {
                                                $('#tempo_resposta').click(function () {
                                                    var start_actual_time   =  $('#recebido_em').val();
                                                    var end_actual_time     =  $('#respondido_em').val();
                                                    $('#tempo_resposta').val(null);

                                                    var formData = {'start':start_actual_time, 'end':end_actual_time};

                                                    if (start_actual_time != '' && end_actual_time != '') {
                                                        $.ajax({
                                                            url: base_url('reclamacao/tempo_resposta/'),
                                                            type: 'POST',
                                                            data: formData,
                                                            success: function (data) {
                                                                $('#tempo_resposta').val(data);
                                                            },
                                                            error: function(jqXHR) {
                                                                bootbox.alert(jqXHR.responseText);
                                                            }
                                                        });
                                                    }
                                                });
                                            });
                                        </script>
                                    </div>
                                    <hr>
                                    <div class="row">
                                        <!-- Houve Custo? -->
                                     
                                        <div class="col-xs-4 mb20">
                                            <label for="houve_custo" class="field-label text-muted mb10">Houve Custo?</label>
                                            <label for="houve_custo" class="validar field select">
                                                <select name="houve_custo" id='houve_custo'>
                                                    <option value="">Selecione ...</option>
                                                    <option value="S">Sim</option>
                                                    <option value="N">Não</option>
                                                </select>
                                            </label>
                                        </div>
                                      
                                        <!-- Custo -->
                                        <div class="col-xs-4 mb20 custo" style="display: none;">
                                            <label for="custo" class="field-label text-muted mb10">Custo</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-money c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="custo" id="custo" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                    </div>
               
                                    
                                    <!--   - div-->
                                    <div id="divReembolso">
                                    <div class="row">         
                                        <!--   - Houve Reembolso?-->
                                       
                                        <div class="col-xs-4 mb20">
                                            <label for="houve_reembolso" class="field-label text-muted mb10">Houve Reembolso?</label>
                                            <label for="houve_reembolso" class="validar field select">
                                                <select name="houve_reembolso" id='houve_reembolso'>
                                                    <option value="">Selecione ...</option>
                                                    <option value="S">Sim</option>
                                                    <option value="N">Não</option>
                                                </select>
                                            </label>
                                        </div>
                                      
                                         <!--  FIM  - Houve Reeembolso -->
                                   
                                    
                                        <!--   - Reembolso?-->
                                        <div class="col-xs-4 mb20 reembolso" style="display: none;">
                                            <label for="reembolso" class="field-label text-muted mb10">Reembolso</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-money c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="reembolso" id="reembolso" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                     <!--  FIM  - Reeembolso -->
                                      </div>
                        
                                    </div>
                                    <!--  FIM  - div -->
                                    
                       
                                    <!-- Anexo -->
                                    <hr>
                                    <div class='row'>
                                        <div class="col-xs-12 mb20">
                                            <label for="anexo" class="field-label text-muted mb10">Anexo</label>
                                            <input name="fileuser" id="fileuser" type="file" class="form-control gui-input br-light light" placeholder="">
                                        </div>
                                    </div>

                                    <script type="text/javascript">
                                        $(function () {
                                            $('#fileupload').fileupload({
                                                dataType: 'json',
                                                done: function (e, data) {
                                                    $.each(data.result.files, function (index, file) {
                                                        $('<p/>').text(file.name).appendTo(document.body);
                                                    });
                                                }
                                            });
                                        });
                                    </script>
      
                                  <!--  - 01 - Download do PDF  -->
                                  <div class="col-xs-4 mb20">                                      
                                  <hr>  
                                  <div class='row'>
                                  
                                  
                                     
                                        <div class="col-xs-4 mb20">
                                            <div class="input-group">
                                                <span class="validar">
                                                    <button type="button" class="btn btn-primary download" name="download">Download do Arquivo</button>
                                                </span>
                                            </div>
                                        </div>
                                        
                                        
                                        
                                    </div>
                                    <!-- teste FIM -->
         
                                    <!-- End: Campos-->
                                </div>
							</form>
							<!-- End: Form Edit -->
						</div>
					</div>                                
                    <!-- End: Modal Body-->

                    <!-- Begin: Modal Footer -->
                    <div class="modal-footer actions">
                        <div class="col-xs-3 col-xs-offset-1 pln">
                            <button class="btn btn-warning btn-gradient btn-alt btn-block item-active andamento save_edit" data-dismiss="modal">Em Análise</button>
                        </div>

                        <div class="col-xs-3 pln ">
                            <button class="btn btn-success btn-gradient btn-alt btn-block item-active save_edit">Procedente</button>
                        </div>

                        <div class="col-xs-3 pln ">
                            <button class="btn btn-danger btn-gradient btn-alt btn-block item-active improcedente save_edit" >Improcedente</button>
                        </div>

                    </div>
                    <!-- End: Modal Footer -->
                </div>
            </div>
            
            
            
            
        </div>
        
        </div>
        <!--  - 01 - FIM Modal de Edição -->
        
        <!--  - 01 - Modal de Visualização -->
        <!-- Begin: Modal View -->
            <div id="view" class="modal fade" tabindex="-1" role="dialog">
            <div class="modal-dialog modal-width-projeto">
                <div class="modal-content">
                    <!-- Begin: Modal Header -->
                    <div class="modal-header bg-info bg-projeto">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">×</span>
                        </button>
                        <h4 class="modal-title">
                            <i class="mr10 fa fa-building"></i>
                            <span>Reclamação</span>
                        </h4>
                    </div>
                    <!-- End: Modal Header -->
                    <!-- Beign: Modal Body -->
                    <div class="modal-body modal-body-projeto">
                        <div class="panel panel-projeto mt-10">
                            <!-- Begin: Form Edit -->
                            <form method="post" action="#" id="entity-form" enctype="multipart/form-data">
                                <input type="hidden" class="id_reclamacao" name="id_reclamacao" value="">

                                <div class="panel-body panel-body-projeto p10 pb10 tab-content pn br-n admin-form">
                                    <!-- Begin: Campos -->
                                    <div class="row">
                                        <!-- Seguradora -->
                                        <div class="col-xs-12 mb15">
                                            <label for="fk_seguradora" class="field-label text-muted mb10">Seguradora</label>
                                            <label for="fk_seguradora" class="validar field select">
                                                <?php echo $fk_seguradora;?>
                                                <i class="arrow double"></i>
                                            </label>
                                        </div>
                                    </div>
                                    <div class="row">
                                    	<!-- Data -->
                                        <div class="col-xs-4 mb15">
                                            <label for="data" class="field-label text-muted mb10">Data</label>
                                            <label for="data" class="validar field select">
                                                <input type='text'id='data' name='data' class="form-control gui-input br-light light" placeholder=""/>
                                            </label>
                                        </div>
                                        <!-- Interna/Externa -->
                                        <div class="col-xs-4 mb20">
                                            <label for="interna_externa" class="field-label text-muted mb10">Interna/Externa</label>
											<div class="mt15">
												<label class="radio-inline mr10">
													<input type="radio" name="interna_externa" id="interna" value="I">Interna
												</label>
												<label class="radio-inline mr10">
													<input type="radio" name="interna_externa" id="externa" value="E">Externa
												</label>
											</div>
                                        </div>
                                    </div>
                                    <hr>
                                    <div class="row">
                                    	<!-- Enviado Por -->
                                        <div class="col-xs-6 mb20">
                                            <label for class="field-label text-muted mb10">Enviado Por</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-cog c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="enviado_por" id="enviado_por" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                        <!-- Nome Reclamante -->
                                        <div class="col-xs-6 mb20">
                                            <label for class="field-label text-muted mb10">Nome do cliente (Reclamante)</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-user c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="nome_reclamante" id="nome_reclamante" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                    	<!-- Genero -->
                                        <div class="col-xs-4 mb20">
                                            <label for="genero" class="field-label text-muted mb10">Genero</label>
                                            <label for="genero" class="validar field select">
                                                <select name="genero" id='genero'>
                                                    <option value="">Selecione ...</option>
                                                    <option value="M">Masculino</option>
                                                    <option value="F">Feminino</option>
                                                </select>
                                            </label>
                                        </div>
                                        <!-- Interna/Externa -->
                                        <div class="col-xs-4 mb20">
                                            <label for="fisica_juridica" class="field-label text-muted mb10">Pessoa Fisica/Juridica</label>
                                            <div class="mt15">
                                                <label class="radio-inline mr10">
                                                    <input type="radio" name="fisica_juridica" id="fisica" value="F">Fisica
                                                </label>
                                                <label class="radio-inline mr10">
                                                    <input type="radio" name="fisica_juridica" id="juridica" value="J">Juridica
                                                </label>
                                            </div>
                                        </div>
                                        <!-- CPF CNPJ -->
                                        <div class="col-xs-4 mb20">
                                            <label for class="field-label text-muted mb10">CPF/CNPJ</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-cog c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="cpf_cnpj" id="cpf_cnpj" class="form-control gui-input br-light light" onkeypress='mascaraMutuario(this,cpfCnpj)' onblur='clearTimeout()' maxlength="18">
                                                </span>
                                            </div>
                                        </div>
                                        <!-- Data de Atendimento -->
                                        <div class="col-xs-4 mb15">
                                            <label for="data_atendimento" class="field-label text-muted mb10">Data de Atendimento</label>
                                            <label for="data_atendimento" class="validar field select">
                                                <input type='text'id='data_atendimento' name='data_atendimento' class="form-control gui-input br-light light" placeholder=""/>
                                            </label>
                                        </div>
                                        <!-- SISE -->
                                        <div class="col-xs-6 mb20">
                                            <label for class="field-label text-muted mb10">SISE</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-cog c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="sise" id="sise" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                    <hr>
                                    <div class="row">
                                    	<!-- Nome do Produto -->
                                        <div class="col-xs-8 mb15">
                                            <label for="fk_nome_produto" class="field-label text-muted mb10">Nome do Produto</label>
                                            <label for="fk_nome_produto" class="validar field select">
                                                <?php echo $fk_nome_produto;?>
                                                <i class="arrow double"></i>
                                            </label>
                                        </div>
                                        <!-- Servico -->
                                        <div class="col-xs-6 mb15">
                                            <label for="fk_servico" class="field-label text-muted mb10">Serviço</label>
                                            <label for="fk_servico" class="validar field select">
                                                <?php echo $fk_servico;?>
                                                <i class="arrow double"></i>
                                            </label>
                                        </div>
                                        <!-- Sub_servico -->
                                        <div class="col-xs-6 mb15">
                                            <label for="fk_sub_servico" class="field-label text-muted mb10">Sub Serviço!</label>
                                            <label for="fk_sub_servico" class="validar field select">
                                                <?php echo $fk_sub_servico;?>
                                                <i class="arrow double"></i>
                                            </label>
                                        </div>
                                        <!-- UF -->
                                        <div class="col-xs-2 mb15">
                                            <label for="uf" class="field-label text-muted mb10">UF</label>
                                            <label for="uf" class="validar field select">
                                                <select name="uf" id="uf">
                                                    <option value="">Selecione ...</option>
                                                    <option value="AC">AC</option>
                                                    <option value="AL">AL</option>
                                                    <option value="AP">AP</option>
                                                    <option value="AM">AM</option>
                                                    <option value="BA">BA</option>
                                                    <option value="CE">CE</option>
                                                    <option value="DF">DF</option>
                                                    <option value="ES">ES</option>
                                                    <option value="GO">GO</option>
                                                    <option value="MA">MA</option>
                                                    <option value="MT">MT</option>
                                                    <option value="MS">MS</option>
                                                    <option value="MG">MG</option>
                                                    <option value="PA">PA</option>
                                                    <option value="PB">PB</option>
                                                    <option value="PR">PR</option>
                                                    <option value="PE">PE</option>
                                                    <option value="PI">PI</option>
                                                    <option value="RJ">RJ</option>
                                                    <option value="RN">RN</option>
                                                    <option value="RS">RS</option>
                                                    <option value="RO">RO</option>
                                                    <option value="RR">RR</option>
                                                    <option value="SC">SC</option>
                                                    <option value="SP">SP</option>
                                                    <option value="TO">TO</option>
                                                </select>
                                            </label>
                                        </div>
                                        <!-- Cidade -->
                                        <div class="col-xs-10 mb20">
                                            <label for="cidade" class="field-label text-muted mb10">Cidade</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-map-marker c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="cidade" id="cidade" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                    <hr>
                                    <div class="row">
                                        <!-- Origem do Problema -->
                                        <div class="col-xs-6 mb15">
                                            <label for="fk_origem_problema" class="field-label text-muted mb10">Origem do Problema</label>
                                            <label for="fk_origem_problema" class="validar field select">
                                                <?php echo $fk_origem_problema;?>
                                                <i class="arrow double"></i>
                                            </label>
                                        </div>

                                        <script type="text/javascript">
                                            //Carrega o Dropdown de motivo_reclamação de acordo com a origem selecionada
                                            $(function () {
                                                $("#fk_origem_problema").change(function() {
                                                    var serv = $('#fk_origem_problema').val();
                                                    
                                                    $(".validar.field.select.fk_motivo_reclamacao").empty();
                                                    
                                                    $.ajax({
                                                        url: base_url('reclamacao/get_motivo/' + serv),
                                                        type: 'post',
                                                        cache: false,
                                                        contentType: false,
                                                        processData: false,
                                                        dataType: 'json',
                                                        data: serv,
                                                        success: function (data) {
                                                            $(".validar.field.select.fk_motivo_reclamacao").append(data);
                                                        },
                                                        error: function(jqXHR) {
                                                            bootbox.alert(jqXHR.responseText);
                                                        }
                                                    });

                                                });
                                            });
                                        </script>

                                        <!-- Motivo da Reclamacao -->
                                        <div class="col-xs-6 mb15">
                                            <label for="fk_motivo_reclamacao" class="field-label text-muted mb10">Motivo da Reclamação</label>
                                            <label for="fk_motivo_reclamacao" class="validar field select fk_motivo_reclamacao">
                                                <i class="arrow double"></i>
                                            </label>
                                        </div>
                                        <!-- Base Prestador -->
                                        <div class="col-xs-6 mb15">
                                            <label for="fk_base_prestador" class="field-label text-muted mb10">Base Prestador</label>
                                            <label for="fk_base_prestador" class="validar field select">
                                                <?php echo $fk_base_prestador;?>
                                                <i class="arrow double"></i>
                                            </label>
                                        </div>
                                        <!-- Nome do Agente -->
                                        <div class="col-xs-12 mb20">
                                            <label for="nome_agente" class="field-label text-muted mb10">Nome do Agente</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-user  c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="nome_agente" id="nome_agente" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                    <hr>
                                    <div class="row">
                                    	<!-- Enviado ao Departamento em: -->
                                        <div class="col-xs-4 mb15">
                                            <label for="enviado_dpto_em" class="field-label text-muted mb10">Enviado ao Departamento em:</label>
                                            <label for="enviado_dpto_em" class="validar field select">
                                                <input type='text'id='enviado_dpto_em' name='enviado_dpto_em' class="form-control gui-input br-light light" placeholder=""/>
                                            </label>
                                        </div>
                                        <!-- Resposta do Departamento em: -->
                                        <div class="col-xs-4 mb15">
                                            <label for="resposta_dpto_em" class="field-label text-muted mb10">Resposta do Departamento em:</label>
                                            <label for="resposta_dpto_em" class="validar field select">
                                                <input type='text'id='resposta_dpto_em' name='resposta_dpto_em' class="form-control gui-input br-light light" placeholder=""/>
                                            </label>
                                        </div>
                                        <!-- Responsavel -->
                                        <div class="col-xs-12 mb20">
                                            <label for="responsavel" class="field-label text-muted mb10">Responsavel</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-user c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="responsavel" id="responsavel" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                        <!-- Ações do Departamento -->
                                        <div class="col-xs-12 mb20">
                                            <label for="acoes_dpto" class="field-label text-muted mb10">Ações do Departamento</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-pencil c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="acoes_dpto" id="acoes_dpto" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                        <!-- Comentários|Reclamações|Elogios -->
                                        <div class="col-xs-12 mb20">
                                            <label for="comentarios" class="field-label text-muted mb10">Comentários|Reclamações|Elogios</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-comment c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="comentarios" id="comentarios" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                        <!-- Parecer de Qualidade -->
                                        <div class="col-xs-12 mb20">
                                            <label for="parecer" class="field-label text-muted mb10">Parecer de Qualidade</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-pencil c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="parecer" id="parecer" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                    <hr>
                                    <div class="row">
                                    	<!-- Recebido em: -->
                                        <div class="col-xs-4 mb15">
                                            <label for="recebido_em" class="field-label text-muted mb10">Recebido em:</label>
                                            <label for="recebido_em" class="validar field select">
                                                <input type='text'id='recebido_em' name='recebido_em' class="form-control gui-input br-light light" placeholder=""/>
                                            </label>
                                        </div>
                                        <!-- Respondido em: -->
                                        <div class="col-xs-4 mb15">
                                            <label for="respondido_em" class="field-label text-muted mb10">Respondido em:</label>
                                            <label for="respondido_em" class="validar field select">
                                                <input type='text'id='respondido_em' name='respondido_em' class="form-control gui-input br-light light" placeholder=""/>
                                            </label>
                                        </div>
                                        <!-- Tempo Resposta -->
                                        <div class="col-xs-4 mb20">
                                            <label for="tempo_resposta" class="field-label text-muted mb10">Tempo Resposta</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-clock-o c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="tempo_resposta" id="tempo_resposta" class="form-control gui-input br-light light" placeholder="" readonly aria-invalid="false">
                                                </span>
                                            </div>
                                        </div>

                                        <script type="text/javascript">
                                            $(function () {
                                                $('#tempo_resposta').click(function () {
                                                    var start_actual_time   =  $('#recebido_em').val();
                                                    var end_actual_time     =  $('#respondido_em').val();
                                                    $('#tempo_resposta').val(null);

                                                    var formData = {'start':start_actual_time, 'end':end_actual_time};

                                                    if (start_actual_time != '' && end_actual_time != '') {
                                                        $.ajax({
                                                            url: base_url('reclamacao/tempo_resposta/'),
                                                            type: 'POST',
                                                            data: formData,
                                                            success: function (data) {
                                                                $('#tempo_resposta').val(data);
                                                            },
                                                            error: function(jqXHR) {
                                                                bootbox.alert(jqXHR.responseText);
                                                            }
                                                        });
                                                    }
                                                });
                                            });
                                        </script>
                                    </div>
                                    <hr>
                                    <div class="row">
                                        <!-- Houve Custo? -->
                                     
                                        <div class="col-xs-4 mb20">
                                            <label for="houve_custo" class="field-label text-muted mb10">Houve Custo?</label>
                                            <label for="houve_custo" class="validar field select">
                                                <select name="houve_custo" id='houve_custo'>
                                                    <option value="">Selecione ...</option>
                                                    <option value="S">Sim</option>
                                                    <option value="N">Não</option>
                                                </select>
                                            </label>
                                        </div>
                                      
                                        <!-- Custo -->
                                        <div class="col-xs-4 mb20 custo" style="display: none;">
                                            <label for="custo" class="field-label text-muted mb10">Custo</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-money c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="custo" id="custo" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                    </div>
               
                                    
                                    <!--   - div-->
                                    <div id="divReembolso">
                                    <div class="row">         
                                        <!--   - Houve Reembolso?-->
                                       
                                        <div class="col-xs-4 mb20">
                                            <label for="houve_reembolso" class="field-label text-muted mb10">Houve Reembolso?</label>
                                            <label for="houve_reembolso" class="validar field select">
                                                <select name="houve_reembolso" id='houve_reembolso'>
                                                    <option value="">Selecione ...</option>
                                                    <option value="S">Sim</option>
                                                    <option value="N">Não</option>
                                                </select>
                                            </label>
                                        </div>
                                      
                                         <!--  FIM  - Houve Reeembolso -->
                                   
                                    
                                        <!--   - Reembolso?-->
                                        <div class="col-xs-4 mb20 reembolso" style="display: none;">
                                            <label for="reembolso" class="field-label text-muted mb10">Reembolso</label>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="fa fa-money c-gray"></i>
                                                </span>
                                                <span class="validar">
                                                    <input type="text" name="reembolso" id="reembolso" class="form-control gui-input br-light light" placeholder="">
                                                </span>
                                            </div>
                                        </div>
                                     <!--  FIM  - Reeembolso -->
                                      </div>
                        
                                    </div>
                                    <!--  FIM  - div -->
                        
      
                                  <!--  - 01 - Download do PDF  -->
                                  <div class="col-xs-4 mb20">                                      
                                  <hr>  
                                  <div class='row'>
                                     <div class="col-xs-4 mb20">
                                            <div class="input-group">
                                                <span class="validar">
                                                    <button type="button" class="btn btn-primary download" name="download_v">Download do Arquivo</button>
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                    
                                    <!-- teste FIM -->
         
                                    <!-- End: Campos-->
                                </div>
							</form>
							<!-- End: Form Edit -->
						</div>
					</div>                                
                    <!-- End: Modal Body-->

        
                </div>
            </div>
      
        </div>
        
        </div>
     
       <!--   - FIM  Modal de Visualização -->
            
      

	</div>

	<!-- Begin: Barra a direita -->
    <aside class="tray tray-right tray290" data-tray-height="match">
        <div class="row">
            <div class="col-xs-12 pln">
                <button 
                    class="btn btn-primary btn-gradient btn-alt btn-block item-active save_button" 
                    id="create" 
                    style="width:100%" 
                    type="submit">Novo</button>
            </div>
        </div>
        <hr class="short">
        <form id="pesquisar_groups_form">
            <div class="admin-form">
                <h4>Pesquisar</h4>
                <div class="row">
                    <div class="col-xs-12 mb15">
                        <div class="input-group">
                            <span class="input-group-addon ">
                                <i class="fa fa-search c-gray"></i>
                            </span>
                            <input type="text" name="sise" id="sise" class="form-control gui-input br-light light" placeholder="SISE">
                        </div>
                    </div>
                </div>
                
                <!-- --- Novos campos de filtro -->
                <div class="row">
                <div class="col-xs-12 mb15">
                    <div class="input-group">
                        <span class="input-group-addon ">
                            <i class="fa fa-search c-gray"></i>
                        </span>
                        <span class="select">
                            <select id="fk_seguradora" name="fk_seguradora">
                                <option value="" selected="selected">...Seguradora...</option>
                                <option value="1">xxx</option>
                                <option value="2">xxx</option>
                                <option value="3">xxx</option>
                            </select>
                        </span>
                    </div>
                </div>
               </div>
                
                 <div class="row">
                <div class="col-xs-12 mb15">
                    <div class="input-group">
                        <span class="input-group-addon ">
                            <i class="fa fa-search c-gray"></i>
                        </span>
                        <input type="text" name="nome_reclamante" id="nome_reclamante" class="form-control gui-input br-light light" placeholder="Nome Reclamante">
                    </div>
                </div>
                </div>
                
                 <div class="row">
                <div class="col-xs-12 mb15">
                    <div class="input-group">
                        <span class="input-group-addon ">
                            <i class="fa fa-search c-gray"></i>
                        </span>
                        <input type="text" name="data" id="data" class="form-control gui-input br-light light" placeholder="Data">
                    </div>
                </div>
                </div>
                
                        
                  <!--  - 01 filtro de SLA  -->
                  
                    <div class="row">
                    <div class="col-xs-12 mb15">
                        <div class="input-group">
                            <span class="input-group-addon ">
                                <i class="fa fa-search c-gray"></i>
                            </span>
                            <span class="select">
                                <select id="sla" name="sla">
                                    <option value="" selected="selected">...SLA...</option>
                                    <option value="V">Verde</option>
                                    <option value="A">Amarelo</option>
                                    <option value="L">Laranja</option>
                                    <!--  - 01 Trocou a abreviação para 01 letra -->
                                    <option value="R">Vermelho</option>
                                </select>
                            </span>
                        </div>
                    </div>
                   </div>
                   
                   <!----- FIM  ---->
                    
      
                  
                <div class="row">  
                <div class="col-xs-12 mb15">
                    <div class="input-group">
                        <span class="input-group-addon ">
                            <i class="fa fa-search c-gray"></i>
                        </span>
                        <input type="text" name="nome_agente" id="nome_agente" class="form-control gui-input br-light light" placeholder="nome agente">
                    </div>
                </div>
            </div>
      
       
             
            <!--   Combo de Status -->
            <div class="row">
            <div class="col-xs-12 mb15">
                <div class="input-group">
                    <span class="input-group-addon ">
                        <i class="fa fa-search c-gray"></i>
                    </span>
                    <span class="select">
                        <select id="procedencia" name="procedencia">
                            <option value="" selected="selected">...procedência...</option>
                            <option value="P">Procedente</option>
                            <option value="I">Improcedente</option>
                            <option value="A">Em Análise</option>
                        </select>
                    </span>
                </div>
            </div>
           </div>
           <!----- FIM  ---->
    
             
             <!-- --- FIM  Novos campos de filtro -->
      
                
                <hr class="short">

                <div class="row">
                    <div class="col-xs-6">
                        <button type="button" id="create" class="btn btn-primary btn-gradient btn-alt btn-block item-active search_submit">Buscar</button>
                    </div>
                    <div class="col-xs-6">
                        <button type="reset" id="create" class="btn btn-primary btn-gradient btn-alt btn-block item-active clear_pesquisa">Limpar</button>
                    </div>
                    <label class="field option ml15">
                        <input type="checkbox" name="info">
                    </label>
                </div>
            </div>
        </form>
    </aside>
    <!-- End: Barra a direita -->

</section>

<!-- JQuery PDF -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/0.9.0rc1/jspdf.min.js"></script>

<link href="<?php echo base_url(); ?>public/vendor/plugins/datepicker/css/bootstrap-datetimepicker.css" rel="stylesheet" type="text/css">

<script src="<?php echo base_url(); ?>public/vendor/plugins/moment/moment.js"></script>

<script src="<?php echo base_url(); ?>public/vendor/plugins/datepicker/js/bootstrap-datetimepicker.js"></script>

<!-- jQuery Validate Plugin-->
<script src="<?php echo base_url(); ?>/public/assets/admin-tools/admin-forms/js/jquery.validate.min.js"></script>

<!-- jQuery Validate Addon -->
<script src="<?php echo base_url(); ?>/public/assets/admin-tools/admin-forms/js/additional-methods.min.js"></script>

<script type="text/javascript">

  $(function () {
        $('#data, #recebido_em, #respondido_em, #data_atendimento, #enviado_dpto_em, #resposta_dpto_em').datetimepicker({
            format:'DD/MM/YYYY HH:mm:SS',
        });

        $('').datetimepicker({
            format:'DD/MM/YYYY',
        });
        
        
        // - 01
        $.validator.addMethod('regex', function (value, element, regexp) { 
            var pattern = new RegExp(regexp);
            return pattern.test(value); 
        }, 'Use o formato correto');
        
        //
        $("#divReembolso").hide();
        $("#divReembolso_v").hide();
        
        $("#houve_custo").change(function() {
            var serv = $( "#houve_custo option:selected" ).text();

            if (serv != 'Sim')
            {
                $(".custo").hide();
                
                  //
                $("#divReembolso").hide();
                
            }
            else
            
            {
                 $(".custo").show();              
                 //
                $("#divReembolso").show();
               
            }
        });


        //  Valor de Reembolso
        $("#houve_reembolso").change(function() {
            var serv = $( "#houve_reembolso option:selected" ).text();''

            if (serv != 'Sim')
                $(".reembolso").hide();
                
            else
                $(".reembolso").show();
                
        });
        //  - FIM


         $("#houve_custo_v").change(function() {
            var serv_v = $( "#houve_custo_v option:selected" ).text();

            if (serv_v != 'Sim')
            {
                $(".custo_v").hide();
                
                  //
                $("#divReembolso_v").hide();
                
            }
            else
            {
                 $(".custo_v").show();
                 
                 //
                $("#divReembolso_v").show();
                
                $(".reembolso_v").show();
                
                $('#download').prop("disabled", false);
               
            }
        });


        //  Valor de Reembolso
        $("#houve_reembolso_v").change(function() {
            var serv2 = $( "#houve_reembolso_v option:selected" ).text();

            if (serv2 != 'Sim')
                $(".reembolso_v").hide();
                
            else
                $(".reembolso_v").show();
                
        });
        //  - FIM
    
 

        $("body").on("click", ".dataTable td .crud-laudo", function(e) {
            e.preventDefault();

            var
                $this = $(this),
                id = $this.data("id"),
                $form = $("#view form")
            ;
            
            $.ui.loader("show");
            
            window.location.replace(base_url('pdf/reclamacao/' + id));
            
            $.ui.loader("hide");
        });

    });

                 
    //  - 01
    var baseurl = "<?php print base_url(); ?>";
   
    $(".download").click(function(){
    
    	var serv = $('.id_reclamacao').val();
    	alert(serv);
        
    	$.ajax({
    		url: baseurl+'reclamacao/get/' + serv,
    		type: 'post',
    		cache: false,
    		contentType: false,
    		processData: false,
    		dataType: 'json',
    		data: serv,
    		success: function (data) {
    		var anexo = data['anexo'];
    		alert(anexo);
  
            // Faz o download
            window.open(anexo);
            
    		},
    		error: function(jqXHR) {
    			bootbox.alert(jqXHR.responseText);
    		}
    	});
    });
    
    
                                   


    $('.andamento').click(function() {
        $( "#entity-form" ).append( '<input type="hidden" id="procedencia" name="procedencia" value="A">' );
    });

    $('.improcedente').click(function() {
        $( "#entity-form" ).append( '<input type="hidden" id="procedencia" name="procedencia" value="I">' );
    });

    $('#entity-form').on('submit', function (e) {
        e.preventDefault();
    }).validate({

        ignore: ".ignore",
        errorClass: "state-error",
        validClass: "state-success",
        errorElement: "em",
        rules: {
            nome_reclamante: {
                required: true,
            },
            data: {
                required: true,
            },
            sise: {
                number: true,
            },
            
             //  -  - 01  pattern, retirar number
            //
            custo: {
               
                    // - 01
                    required: true,
                    regex:/^[0-9]{1,2}([,.][0-9]{1,2})?$/
                    //regex: /d+(\,\d{1,2})?/
 
            },
                reembolso: {
                //number: true,
                
                    // - 01      
                    required: true,
                    regex:/^[0-9]{1,2}([,.][0-9]{1,2})?$/
 
            },
            // - FIM
   
            
        },
        messages: {
            nome_reclamante: {
                required: '',
            },
            sise: {
                number: '',
            },
            
            
            //
            custo: {
                number: '',
            },
                    
            reembolso: {
                number: '',
            },
           /// - FIM
            
            
        },
        highlight: function (element, errorClass, validClass) {

            $(element).closest('.validar').addClass(errorClass).removeClass(validClass);
        },
        unhighlight: function (element, errorClass, validClass) {
            $(element).closest('.validar').removeClass(errorClass).addClass(validClass);
        },
        submitHandler: function (form) {
            
            var formData = new FormData(form);

            $.ajax({
                url: base_url('reclamacao/save'),
                type: 'post',
                cache: false,
                contentType: false,
                processData: false,
                dataType: 'json',
                data: formData,
                success: function (data) {

                    $("#procedencia").remove();
                    
                    if(data.hasOwnProperty('message')) {
                        
                        time_alert(data.message);
                        $('#entity-form').trigger('reset');
                    }
                    else if(data.hasOwnProperty('erro')) {
                        bootbox.alert(data.erro);
                    }

                    redrawDataTables();
                },
                error: function(jqXHR) {
                    bootbox.alert(jqXHR.responseText);
                }
            });
        }
    });


	<?php
        echo datatables_crud_modal(array(
            'controller' => 'reclamacao',
            'edit' => array(
                'action' => array(
                    'save' => 'save',
                    'entity' => 'get',   
                    'status' => 'update',
                ),
            ),
            'view' => array(
                'action' => 'view'
            ),
        ));
    ?>
    

    

function mascaraMutuario(o,f){
	v_obj=o
	v_fun=f
	setTimeout('execmascara()',1)
}
function execmascara(){
	v_obj.value=v_fun(v_obj.value)
}
function cpfCnpj(v){
	
	v=v.replace(/\D/g,"")
	if (v.length <= 14) { //CPF
	
		v=v.replace(/(\d{3})(\d)/,"$1.$2")
		
		
		v=v.replace(/(\d{3})(\d)/,"$1.$2")
		
		v=v.replace(/(\d{3})(\d{1,2})$/,"$1-$2")
		} else { //CNPJ
		
		v=v.replace(/^(\d{2})(\d)/,"$1.$2")
	
		v=v.replace(/^(\d{2})\.(\d{3})(\d)/,"$1.$2.$3")
	
		v=v.replace(/\.(\d{3})(\d)/,".$1/$2")
		
		v=v.replace(/(\d{4})(\d)/,"$1-$2")
	}
	return v
}
</script>

Open in new window

0
 

Author Comment

by:Eduardo Fuerte
ID: 41830428
Just to clear:

The 1st try using  Marco's class suggestion I didn't coded correctly this:

<button type="button" class="btn btn-primary download" name="download">Download do Arquivo</button>

Open in new window


After correction it correctly  works for modal edit, nothing yet for modal view.
0
 
LVL 51

Expert Comment

by:Julian Hansen
ID: 41830503
I can't see any of the buttons that are meant to invoke the modals in that code
Can you do a view source of the page and post that - the php script is not enough for us to see what is going on.
0
 

Author Comment

by:Eduardo Fuerte
ID: 41830529
Julian

This view uses Codeigniter helpers to some functionalities. I'm still catching the meaning of these. To simplify I omited in this code... It uses the plugin "datatables" with a "gear" to open the modals.

img003
I'm afraid it will be dificult to  perfectly simulate...
0
 
LVL 30

Accepted Solution

by:
Marco Gasi earned 500 total points
ID: 41830574
Oh, yes, it's natural... var serv is an array because the code
var serv = $('.id_reclamacao').val();

Open in new window

always returns the value of the first element with the given class that is the input in Edit modal. If you fill that input dinamically when you show the modal, the value will be empty when you are on View modal and the code get the error you have attached.
Change the selector this way:
var serv = $(this).parents('.modal').find('.id_reclamacao').val();

Open in new window

This code starts from the clicked element - $(this) - navigates through the DOM up to the parent with 'modal' class and then go down looking for the input with class 'id_reclamacao': o it get the valuye of the id_reclamacao within the modal where the clicked button is.
0
 

Author Comment

by:Eduardo Fuerte
ID: 41830606
medal
0
 

Author Closing Comment

by:Eduardo Fuerte
ID: 41830614
Marco

Very elaborated and in depth solution.

Congratulations!

And thank you very much.
0
 
LVL 30

Expert Comment

by:Marco Gasi
ID: 41830817
Ah ah ah, glad to help you!
0

Featured Post

Free Trending Threat Insights Every Day

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

Join & Write a Comment

Suggested Solutions

I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
This article discusses how to create an extensible mechanism for linked drop downs.
Learn how to match and substitute tagged data using PHP regular expressions. Demonstrated on Windows 7, but also applies to other operating systems. Demonstrated technique applies to PHP (all versions) and Firefox, but very similar techniques will w…
The viewer will learn how to dynamically set the form action using jQuery.

746 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now