2017-10-13 8 views
1

J'ai une méthode ajax qui récupère les données d'un contrôleur et les affiche dans la boîte de dialogue Jquery. Mon but est d'avoir un bouton dans la boîte de dialogue qui permettra les données avec un clic au lieu de l'utilisateur mettant en évidence les données en utilisant la souris et la copie.Comment copier le résultat du succès ajax à clipbaord

Ajax

function GrabLink(surveyName) { 
    $.ajax({ 
     type: "GET", 
     url: "/Survey/sendLink", 
     data: { test: surveyName }, 
     contentType: "application/json; charset=utf-8", 
     success: function (data) { 

      $('#my-dialog').html(data); 
      $("#my-dialog").dialog("open"); 

      //alert(data); 
      //$("#my-dialog").show(data); 
     } 
    }) 
} 

Jquery Dialog

$('#my-dialog').dialog({ 
    autoOpen: false, 
    width: 400, 
    resizable: false, 
    modal: true, 
    buttons: { 
     'Copy': function() 
     { 
      //window.prompt("Copy to clipboard: Ctrl+C, Enter", text); 
      // $(this).dialog('close'); 

     } 

    } 
}); 
+0

Jetez un oeil à [presse-papiers. js] (https://clipboardjs.com/). –

+0

Est-ce que ma solution répond à votre problème? –

+1

oui il l'a marqué comme une réponse valide – cedPound

Répondre

1

Vous pouvez utiliser execCommand pour copier le presse-papiers avec javascript. Créer une entrée dans le temps, mettre les données à l'intérieur et retirez-le:

function clipboard(){ 
    var mydata = document.createElement("input"); 
    document.body.appendChild(mydata); 
    mydata.setAttribute("id", "mydata_id"); 
    document.getElementById("mydata_id").value=Yourdata-success-response; 
    mydata.select(); 
    document.execCommand("copy"); 
    document.body.removeChild(mydata); 
} 
-1

Essayez ci-dessous le code qui copie des données sans sélection de texte/données

<head> 
 
    <script type="text/javascript"> 
 
     function CopyToClipboard() { 
 
      var input = document.getElementById ("toClipboard"); 
 
      var textToClipboard = input.value; 
 
      
 
      var success = true; 
 
      if (window.clipboardData) { // Internet Explorer 
 
       window.clipboardData.setData ("Text", textToClipboard); 
 
      } 
 
      else { 
 
        // create a temporary element for the execCommand method 
 
       var forExecElement = CreateElementForExecCommand (textToClipboard); 
 

 
         /* Select the contents of the element 
 
          (the execCommand for 'copy' method works on the selection) */ 
 
       SelectContent (forExecElement); 
 

 
       var supported = true; 
 

 
        // UniversalXPConnect privilege is required for clipboard access in Firefox 
 
       try { 
 
        if (window.netscape && netscape.security) { 
 
         netscape.security.PrivilegeManager.enablePrivilege ("UniversalXPConnect"); 
 
        } 
 

 
         // Copy the selected content to the clipboard 
 
         // Works in Firefox and in Safari before version 5 
 
        success = document.execCommand ("copy", false, null); 
 
       } 
 
       catch (e) { 
 
        success = false; 
 
       } 
 
       
 
        // remove the temporary element 
 
       document.body.removeChild (forExecElement); 
 
      } 
 

 
      if (success) { 
 
       alert ("The text is on the clipboard, try to paste it!"); 
 
      } 
 
      else { 
 
       alert ("Your browser doesn't allow clipboard access!"); 
 
      } 
 
     } 
 

 
     function CreateElementForExecCommand (textToClipboard) { 
 
      var forExecElement = document.createElement ("div"); 
 
       // place outside the visible area 
 
      forExecElement.style.position = "absolute"; 
 
      forExecElement.style.left = "-10000px"; 
 
      forExecElement.style.top = "-10000px"; 
 
       // write the necessary text into the element and append to the document 
 
      forExecElement.textContent = textToClipboard; 
 
      document.body.appendChild (forExecElement); 
 
       // the contentEditable mode is necessary for the execCommand method in Firefox 
 
      forExecElement.contentEditable = true; 
 

 
      return forExecElement; 
 
     } 
 

 
     function SelectContent (element) { 
 
       // first create a range 
 
      var rangeToSelect = document.createRange(); 
 
      rangeToSelect.selectNodeContents (element); 
 

 
       // select the contents 
 
      var selection = window.getSelection(); 
 
      selection.removeAllRanges(); 
 
      selection.addRange (rangeToSelect); 
 
     } 
 
    </script> 
 
</head> 
 
<body> 
 
    <input id="toClipboard" value="text to clipboard"/> 
 
    <button onclick='CopyToClipboard()'>Copy text to clipboard</button> 
 
</body