Abrir PDF no Formulario

Abrir PDF diretamente no formulario

by Rapha Souza

HTML

<script src="//code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<link rel="stylesheet" href="//stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
<script src="//stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<!DOCTYPE html>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>PDFObject Example</title>
<script>
function visualizarDoc() {

	var arquivo = document.getElementById("caminholink").value;

	document.getElementById("linkoculto").innerHTML = arquivo;

	var documentIdCampo = document.getElementById("linkoculto").innerHTML;

	document.getElementById("documentopdf").setAttribute("src", documentIdCampo);
    
  document.getElementById("documento").setAttribute("style", "display: ");
}

function fechar(){

  document.getElementById("documento").setAttribute("style", "display: none");

}
</script>
</head>

<body cz-shortcut-listen="true">

<div id="my-pdf">

  <h1>Abrir Documento pelo Link</h1>
  <label>Caminho</label>
  <input type="text" id="caminholink" class="form-control" >
  <p style="display: " id="linkoculto"></p>
  <button onclick="visualizarDoc();" class="btn btn-info">Visualizar Documento</button>
  
   <div  style="display: none" id="documento">
  <button onclick="fechar();" class="btn btn-danger">X</button>
  <iframe id="documentopdf" width="600" height="780" style="border: none;"></iframe>
  </div>
  
  <h1>PDFObject Example</h1>
    <iframe  src="http://www.pdf995.com/samples/pdf.pdf" width="600" height="780" style="border: none;"></iframe>
</div>
</body>
</html>