ejemplo de código de bootstrap 4 de entrada de tabla

Después de de esta extensa selección de información solucionamos este atasco que presentan algunos lectores. Te regalamos la respuesta y esperamos resultarte de gran apoyo.

Ejemplo 1: tabla bootstrap 4

<tableclass="table table-bordered"><thead><tr><thscope="col">#th><thscope="col">Firstth><thscope="col">Lastth><thscope="col">Handleth>tr>thead><tbody><tr><thscope="row">1th><td>Marktd><td>Ottotd><td>@mdotd>tr><tr><thscope="row">2th><td>Jacobtd><td>Thorntontd><td>@fattd>tr><tr><thscope="row">3th><tdcolspan="2">Larry the Birdtd><td>@twittertd>tr>tbody>table>

Ejemplo 2: tabla con bootstrap de entradas

//html
<linkhref="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css"rel="stylesheet"id="bootstrap-css"><scriptsrc="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js">script><scriptsrc="//code.jquery.com/jquery-1.11.1.min.js">script><divclass="container"><divclass="row clearfix"><divclass="col-md-12 column"><tableclass="table table-bordered table-hover"id="tab_logic"><thead><tr><thclass="text-center">"#"th><thclass="text-center">Nameth><thclass="text-center">Mailth><thclass="text-center">Mobileth>tr>thead><tbody><trid='addr0'><td>1td><td><inputtype="text"name='name[]'placeholder='Enter Full Name'class="form-control"/>td><td><inputtype="email"name='mail[]'placeholder='Enter Mail'class="form-control"/>td><td><inputtype="number"name='mobile[]'placeholder='Enter Mobile'class="form-control"/>td>tr><trid='addr1'>tr>tbody>table>div>div><buttonid="add_row"class="btn btn-default pull-left">Add Rowbutton><buttonid='delete_row'class="pull-right btn btn-default">Delete Rowbutton>div>

//js
$(document).ready(function()
      var i=1;
     $("#add_row").click(function()b=i-1;
      $('#addr'+i).html($('#addr'+b).html()).find('td:first-child').html(i+1);
      $('#tab_logic').append('<trid="addr'+(i+1)+'">tr>');
      i++; 
  );
     $("#delete_row").click(function()
    	 if(i>1)
		 $("#addr"+(i-1)).html('');
		 i--;
		 
	 );
);

Si estás de acuerdo, puedes dejar una división acerca de qué te ha parecido este post.

---

---

Utiliza Nuestro Buscador