Load link in a div on button press

From what you say in the question and in the comments, the URL to consult is generated by means of the ID (cc) based on any URL that, I suppose for security reasons, cannot be shown here.

It is assumed that the content to be retrieved is on the same domain. If not, check the CORS rules on the destination server.

Knowing this, all you have to do is make an AJAX request to that URL to download the HTML:

$('form').on('submit', function (e) {
  e.preventDefault();

  let cc = $(this).find('#cc').val();
  $('.container').load(BASE_URL + '?cc=' + cc); 
});

If that request returns dynamic content, it's better to use an objector iframeto load that URL directly into the document. For example:

HTML

<obejct data="" type="text/html" id="certificado"></object>

javascript

$('form').on('submit', function (e) {
  e.preventDefault();

  let cc = $(this).find('#cc').val();
  $('certfificado').attr('data', BASE_URL + '?cc=' + cc);
});

The URL is external and I can't consume it from the client. What I can do?

In that case, you just download the HTML on the server instead of the client:

// archivo get_external_html.php
<?php echo file_get_contents($_GET['url']); ?>

And the AJAX request must be made to this file.

$('.container').load('//get_external_html.php?url=http://externo.com?cc=' + cc);

Or embedded:

<object data="'//get_external_html.php?url=http://externo.com?cc=af7s5f5w" type="text/html"></object>

First I would modify a few things to your form

• Remove the action="#"solo to avoid refreshing the page when sending the form.
• Change the inputto a buttonand remove the type submitsince we are not going to refresh the page or refresh it.

<form name="Certificado">
  <div class="form-group">
    <label for="dirigido">Dirigido a:</label>
    <input type="text" class="form-control" name="dirigido" id="dirigido" placeholder="Ingrese un valor">
  </div>
  <div class="form-group">
    <label for="cc">Cedula:</label>
    <input type="password" class="form-control" name="cc" id="cc" placeholder="Ingrese Cedula">
  </div>
  <button name="Generar" class="btn btn-sm" style="color: white; background: #006050;">Generar</button>
</form>

<br><br><br>
<div class="container" style="width: 100%; height: 490px; background-color: #A7A7A7"></div>

I would do the submitcom function clickwith jQuery

$('button[name="Generar"]').on('click', function(){
  //serializamos el formulario el cual el formato a serializar seria
  //dirigido=embajada&cc=123456
  var datos = $('form[name="Certificado"]').serialize();
  //hacemos la peticion ajax para enviar la informacion del formulario y mostrar los datos en el div
  $.ajax({
    type: 'POST',
    url: 'url/destino',
    data: datos,
    success: function (data) {
      //mostrando que recibe data
      console.log(data)
      //mostrando los datos en el div si recibe un html
      $('.container').html(data);
    },
    error: function(objXMLHttpRequest){
      //mostrando el error
      alert("error" );
    }
  });
});

Create an 'Onclick' function and fill in the record you need or create a JQuery function that checks when it's a submit event then performs the function you need

Using the function .load()you will be able to load what is on another page and put it where you want

function cargaContenido() {
  $('#container').load('documento.php');
}

<input type="submit" value="Generar" name="Generar" ... onclick='cargaContenido()'>