Skip to main content
se añadieron 6 caracteres en el cuerpo
Origen Enlace
JuankGlezz
  • 5.6k
  • 10
  • 34
  • 59

Primero modificaría unas cuantas cosa a tu formulario

  • Quite el action="#" solo para evitar refrescar la pagina al enviar el form.
  • Cambie el input por un button y quite el tipo submit ya que no vamos a actualizar la pagina ni refrescarla.

 

<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>

yo haria el submitsubmit com la función click con 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" );
    }
  });
});

Primero modificaría unas cuantas cosa a tu formulario

  • Quite el action="#" solo para evitar refrescar la pagina al enviar el form.
  • Cambie el input por un button y quite el tipo submit ya que no vamos a actualizar la pagina ni refrescarla.

 

<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>

yo haria el submit la función click con 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" );
    }
  });
});

Primero modificaría unas cuantas cosa a tu formulario

  • Quite el action="#" solo para evitar refrescar la pagina al enviar el form.
  • Cambie el input por un button y quite el tipo submit ya que no vamos a actualizar la pagina ni refrescarla.

 

<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>

yo haria el submit com la función click con 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" );
    }
  });
});
Origen Enlace
JuankGlezz
  • 5.6k
  • 10
  • 34
  • 59

Primero modificaría unas cuantas cosa a tu formulario

  • Quite el action="#" solo para evitar refrescar la pagina al enviar el form.
  • Cambie el input por un button y quite el tipo submit ya que no vamos a actualizar la pagina ni refrescarla.

 

<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>

yo haria el submit la función click con 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" );
    }
  });
});