1

el script es el siguiente:

<script type="text/javascript">
    $(".cpyBtn").click(function () {
        $.ajax({
            url: '@Url.Action("GetPassword","Credential")',
            type: "get",
            data: {
                idCredential: @Model.ID
            },
            traditional: true,
            cache: false,
            success: function (process) {
                $("#passDecrypted-" + @Model.ID).val(process);
                let copyFrom = document.createElement("textarea");
                document.body.appendChild(copyFrom);
                copyFrom.textContent = $("#passDecrypted-" + @Model.ID).val();
                copyFrom.select();
                document.execCommand("copy");
                copyFrom.remove();
                console.log($("#passDecrypted-" + @Model.ID).val());
            }
        });
    });
</script>

mirandolo con la herramienta de desarrollo de firefox en consola cuando pulso sobre el icono me salta el siguiente mensaje:

document.execCommand('cut'/'copy') ha sido denegado porque no ha sido llamado desde dentro de un manejador de eventos generado por el usuario de ejecución breve.

1 respuesta 1

1

Como se indica en el error document.execCommand('cut'/'copy') sólo está permitido usarlo (sin permisos) en manejadores de eventos de corta duración generados por el usuario (por ejemplo, un click). En tu caso (aunque la llamada a ajax esté englobada en un click el contexto no es el mismo por lo que no te va a dejar). Más info

Existe la opción de dar permisos al navegador para permitir esto pero no es una solución global.

En esta pregunta de SO proponen varias soluciones. Una de ellas es lanzar la llamada ajax en vez de en el click en el mouseenter (guardando el valor en un input) y luego cuando se hace el click copiar en el portapapeles. Evidentemente esto no es muy eficiente ya que hará una llamada cada vez que el usuario ponga el ratón encima del botón... así que habría que valorar si merece la pena.

Te dejo este ejemplo modificado de una de las respuestas:

$('.list').on('click', function() {  
  	let copyFrom = document.createElement("textarea");
    document.body.appendChild(copyFrom);
    //Obtenemos el valor del hidden
    copyFrom.textContent = $("#hidClip").val();
    copyFrom.select();
    document.execCommand("copy");
    copyFrom.remove();  
});

$('.list').on('mouseenter', function() {
    $.get("http://echo.jsontest.com/uid/12345/value/nuno_bettencourt", function(data) {
        var json = {
            json: JSON.stringify(data),
            delay: 1
        };
        //Guardamos en el hidden el JSON obtenido (o lo que interese de la respuesta)
        $("#hidClip").val(JSON.stringify(data)); 
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="button" class="list" value="Copiar en el portapapeles"></input>
<input type="text" placeholder="¡Pégame el texto!"/>
<input type="hidden" id="hidClip"/>

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.