0

tengo un código que genera una alerta de SweetAlert2, el mensaje de alerta tiene tildes, pero sale error en dichas tildes, he agregado el utf-8 pero el error persiste. Agradezco me puedan ayudar.

introducir la descripción de la imagen aquí

Tengo el siguiente código JS para la alerta

$("#alertTermContr").click(function(){
    Swal.fire({
        
          title: 'Terminacion Contrato',
          text: "¿Está seguro de generar certificado de Terminación de contrato?",
          icon: 'warning',
          showCancelButton: true,
          confirmButtonColor: '#3085d6',
          cancelButtonColor: '#d33',
          confirmButtonText: 'Yes, delete it!'
        }).then((result) => {
          if (result.isConfirmed) {
            Swal.fire(
              'Deleted!',
              'Your file has been deleted.',
              'success'
            )
          }
        })
    
});

El HTML

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ page import="java.util.*, Controller.*, Model.*" %>

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta charset="utf-8">
    
    <title>Liquidación</title>


    <link rel="icon" href="./assets/img/icon.ico" type="image/x-icon"/>

    <!-- Fonts and icons -->
    <script src="./assets/js/plugin/webfont/webfont.min.js"></script>
    <script>
        WebFont.load({
            google: {"families":["Lato:300,400,700,900"]},
            custom: {"families":["Flaticon", "Font Awesome 5 Solid", "Font Awesome 5 Regular", "Font Awesome 5 Brands", "simple-line-icons"], urls: ['./assets/css/fonts.min.css']},
            active: function() {
                sessionStorage.fonts = true;
            }
        });
    </script>

    <!-- CSS Files -->
    <link rel="stylesheet" href="./assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="./assets/css/atlantis.min.css">
    <link rel="stylesheet" href="./assets/css/style.css">
    <link rel="stylesheet" href="./assets/css/animate.css">
    <link rel="stylesheet" href="./assets/css/sweetalert2.min.css">
    




</head>


<body class="body">

<div class="container-fluid">
    <div class="page-inner">
        <div class="page-header">
            <h4 class="page-title"><i class="far fa-file-alt"></i> Certificados</h4>
            <ul class="breadcrumbs">
                <li class="nav-home">
                    <a href="#">
                        <i class="flaticon-home"></i>
                    </a>
                </li>
                <li class="separator">
                    <i class="flaticon-right-arrow"></i>
                </li>
                <li class="nav-item">
                    <a href="#">Empleados</a>
                </li>
                <li class="separator">
                    <i class="flaticon-right-arrow"></i>
                </li>
                <li class="nav-item">
                    <a href="#">Certificados</a>
                </li>
            </ul>
        </div>


        <div class="container">
            <div  class="col-md-12">
                <div style="background-color: rgba(162,203,255,0.5);" class="card">
                    <div class="card-header">
                        <div class="card-title">
                            <strong class="text-primary"> Certificados</strong>
                        </div>
                    </div>
                    <div class="card-body">
                        
                            <div class="row">
                                <div class="col-md-4 d-flex justify-content-center margen" >
                                    <button type="button" class="btn btn-info btn-lg btn-round " id="alertTermContr" >Terminación Contrato</button>
                                </div>
                                <div class="col-md-4 d-flex justify-content-center margen">
                                    <button type="button" class="btn btn-primary  btn-lg btn-round">Consentimiento Informado</button>
                                </div>
                                <div class="col-md-4 d-flex justify-content-center margen">
                                    <button type="button" class="btn btn-info btn-lg btn-round">Certificación Laboral</button>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-4 d-flex justify-content-center margen">
                                    <button type="button" class="btn btn-primary btn-lg btn-round"> Cancelación Contrato</button>
                                </div>
                                <div class="col-md-4 d-flex justify-content-center margen">
                                    <button type="button" class="btn btn-info btn-lg btn-round"> Anexo Contrato Trabajo</button>
                                </div>
                                <div class="col-md-4 d-flex justify-content-center margen">
                                    <button type="button" class="btn btn-primary btn-lg btn-round">Renuncia Voluntaria </button>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-4 d-flex justify-content-center margen">
                                    <button type="button" class="btn btn-info btn-lg btn-round">Periodo de Prueba</button>
                                </div>
                                <div class="col-md-4 d-flex justify-content-center margen">
                                    <button type="button" class="btn btn-primary btn-lg btn-round">Datos Personales </button>
                                </div>
                                <div class="col-md-4 d-flex justify-content-center margen">
                                    <button type="button" class="btn btn-info btn-lg btn-round">Compromiso SST</button>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-4 d-flex justify-content-center margen">
                                    <button type="button" class="btn btn-primary btn-lg btn-round">Paz y Salvo</button>
                                </div>
                                <div class="col-md-4 d-flex justify-content-center margen">
                                    <button type="button" class="btn btn-info btn-lg btn-round">Pago Vale</button>
                                </div>
                            </div>
        
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>



<script src="./assets/js/core/jquery.3.2.1.min.js"></script>
<script src="./assets/js/core/popper.min.js"></script>
<script src="./assets/js/core/bootstrap.min.js"></script>

<script src="./assets/js/myscript.js"></script>
<script src="./assets/js/sweetalert2.all.min.js"></script>

</body>
</html>

Hola Amigos, tengo un código que genera una alerta de SweetAlert2, el mensaje de alerta tiene tildes, pero sale error en dichas tildes. Agradezco me puedan ayudar. Hola Amigos, tengo un código que genera una alerta de SweetAlert2, el mensaje de alerta tiene tildes, pero sale error en dichas tildes, he agregado el utf-8 pero el error persiste. Agradezco me puedan ayudar.

4
  • veo Transitional//EN en tu tag HTML , eso es inglés el 28 ene. 2021 a las 15:03
  • Hola @L.Ronquillo acabo de actualizar a "ES" en español, pero sigue el error.
    – Alejandro
    el 28 ene. 2021 a las 15:23
  • Asegúrate de que el archivo está guardado con codificación UTF8 sin BOM. La mayoría de editores de texto te indican la codificación actual en la barra inferior. Sorprendentemente, el Bloc de Notas de Windows también lo hace.
    – Triby
    el 28 ene. 2021 a las 15:34
  • No conozco lo que hace esto: <%@ page pero lo que si veo es una incongruencia entre esto: contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1" y esto: <meta charset="utf-8"> que puede ser la causa de que luego salga mal.
    – masterguru
    el 1 abr. 2022 a las 17:57

2 respuestas 2

0

Utiliza la propiedad html de sweetAlert

$("#alertTermContr").click(function(){
Swal.fire({
    
      title: 'Terminacion Contrato',
      text: "¿Está seguro de generar certificado de Terminación de contrato?",
      icon: 'warning',
      showCancelButton: true,
      confirmButtonColor: '#3085d6',
      cancelButtonColor: '#d33',
      confirmButtonText: 'Yes, delete it!',
      html: text: "¿Está seguro de generar certificado de Terminación de contrato?",
    }).then((result) => {
      if (result.isConfirmed) {
        Swal.fire(
          'Deleted!',
          'Your file has been deleted.',
          'success'
        )
      }
    })

});

1
0

En vez de utilizar "text" utiliza "html", intenta con esta modificación:

$("#alertTermContr").click(function(){
    Swal.fire({
      title: 'Terminacion Contrato',
      html: "¿Está seguro de generar certificado de Terminación de contrato?",
      icon: 'warning',
      showCancelButton: true,
      confirmButtonColor: '#3085d6',
      cancelButtonColor: '#d33',
      confirmButtonText: 'Yes, delete it!'
    }).then((result) => {
      if (result.isConfirmed) {
        Swal.fire(
          'Deleted!',
          'Your file has been deleted.',
          'success'
        )
      }
    })
});

Solo revisa si esta bien cerrado el codigo

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

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