<div id="addressForm" action='create' class="modal fade addModal">
    <div class="modal-dialog modal-lg modal-simple">
        <div class="modal-content">
            <div class="modal-header">
                <h4 id="labelTitleConfirmDialog" class="modal-title"><?= lang('ClienteDirecciones.direccionTitle') ?></h4>
            </div>
            <div class="modal-body">
                <div class="mb-3">
                    <label for="add_alias" class="form-label">
                        <?= lang('ClienteDirecciones.alias') ?>*
                    </label>
                    <input type="text" id="add_alias" tabindex="1" maxLength="100" class="form-control">
                </div><!--//.mb-3 -->
                <div class="mb-3">
                    <label for="add_att" class="form-label">
                        <?= lang('ClienteDirecciones.att') ?>*
                    </label>
                    <input type="text" id="add_att" tabindex="1" maxLength="100" class="form-control">
                </div><!--//.mb-3 -->
                <div class="mb-3">
                    <label for="add_email" class="form-label">
                        <?= lang('ClienteDirecciones.email') ?>
                    </label>
                    <input type="text" id="add_email" tabindex="2" maxLength="100" class="form-control">
                </div><!--//.mb-3 -->
                <div class="mb-3">
                    <label for="add_direccion" class="form-label">
                        <?= lang('ClienteDirecciones.direccion') ?>*
                    </label>
                    <input type="text" id="add_direccion" tabindex="3" maxLength="255" class="form-control">
                </div><!--//.mb-3 -->

                <div class='row'>

                    <div id='divPais' class="col-md-12 col-lg-12 pl-4">                    
                        <div class="mb-3">
                            <label for="add_pais_id" class="form-label">
                                <?=lang('ClienteDirecciones.pais') ?>*
                            </label>
                            <select id="add_pais_id" tabindex="4" class="form-control select2bs" style="width: 100%;" >
                                <option value="" disabled selected><?=lang('ClienteDirecciones.selectPais') ?></option>
                                <?php foreach ($paisList as $item) : ?> 
                                    <option value="<?=$item->id ?>">
                                        <?=$item->nombre ?>
                                    </option>
                                <?php endforeach; ?>
                            </select>
                        </div><!--//.mb-3 -->
                    </div>


                </div> <!-- //.row -->

                <div class='row'>

                    <div id='divMunicipio' class="col-md-12 col-lg-12 pl-4">                    
                        <div class="mb-3">
                            <label for="add_municipio" class="form-label">
                                <?=lang('ClienteDirecciones.municipio') ?>*
                            </label>
                            <input type="text" id="add_municipio" tabindex="6" maxLength="100" class="form-control">
                        </div><!--//.mb-3 -->
                    </div>

                    <div class="col-md-12 col-lg-6 pl-4 spain-data" style="display: none;">                    
                        <div class="mb-3">
                            <label for="add_provincia" class="form-label">
                                <?=lang('ClienteDirecciones.provincia') ?>
                            </label>
                            <input type="text" id="add_provincia" tabindex="7" maxLength="100" class="form-control">
                        </div><!--//.mb-3 -->
                    </div>

                </div> <!-- //.row -->

                <div class='row'>

                    <div class="col-md-12 col-lg-6 pl-4">                    
                        <div class="mb-3">
                            <label for="add_cp" class="form-label">
                                <?=lang('ClienteDirecciones.cp') ?>*
                            </label>
                            <input type="text" id="add_cp" tabindex="8" maxLength="100" class="form-control">
                        </div><!--//.mb-3 -->
                    </div>

                    <div class="col-md-12 col-lg-6 pl-4">                    
                        <div class="mb-3">
                            <label for="add_telefono" class="form-label">
                                <?=lang('ClienteDirecciones.telefono') ?>
                            </label>
                            <input type="text" id="add_telefono" tabindex="9" maxLength="100" class="form-control"></input>
                        </div><!--//.mb-3 -->
                    </div>

                </div> <!-- //.row -->

            </div>
            <div class="modal-footer">
                <button id="saveAdd"
                        type="button"
                        class="btn btn-primary"
                >Guardar</button>
                <button id="cancelAdd"
                        type="button"
                        class="btn btn-default"
                >Cancelar</button>
            </div>
        </div>
    </div>
</div>


<?= $this->section("additionalInlineJs") ?>

$('#cancelAdd').on('click', function(){
    $('#addressForm').modal("hide");
})


$('#saveAdd').on('click', function(){
    saveAdd_callback()
})



$('#add_pais_id').on('change', function(){
    var nombre_pais = $("#add_pais_id option:selected" ).text().trim();
    if(nombre_pais.localeCompare('España')==0){
        $('#divPais').removeClass('col-lg-12').addClass('col-lg-6')
        $('#divMunicipio').removeClass('col-lg-12').addClass('col-lg-6')
        $('.spain-data').css('display', 'inline')
    }
    else{
        $('.spain-data').css('display', 'none')
        $('#divPais').removeClass('col-lg-6').addClass('col-lg-12')
        $('#divMunicipio').removeClass('col-lg-6').addClass('col-lg-12')
    }
})


// clear modal items when close
$('#addressForm').on('hidden.bs.modal', function () {
    $('#add_alias').val("")
    $('#add_att').val("")
    $('#add_email').val("")
    $('#add_direccion').val("")
    $("#add_pais_id").val("").change()
    $('#add_municipio').val("")
    $('#add_provincia').val("")
    $('#add_cp').val("")
    $('#add_telefono').val("")
})

<?=$this->endSection() ?>