Update a table with ajax

Question

Update a table with ajax

Navigation

#1 by (-1 votes)

0

How can I update a table using ajax , I have the following table:

$("#venta").bootstrapTable({
                url:'<?= base_url(); ?>index.php/ejemlo/usuarios/datos'
                columns:[
                  {field: 'reStatus'},
                  {field: 'ocTipoUs'},
                  {field: 'faClave'},
                  {field: 'tiPeso'},
                  {field: 'inpo'}
                ],

                pagination: true,
                showFooter: true,
                search: true,
                showExport:true,
                filter: true,
                method: 'post',
                showRefresh:true,
                pageList:[10, 25, 50, 100, 'All'],
                showPaginationSwitch: true
                });
            });

The table is formed with the data of json , the problem is to apply a filter of dates, I send the data, the query is made and it brings me the new data but I do not know how I can paint the table with the new ones data of json .

json ajax codeigniter

asked by Soldier 19.08.2017 в 17:03

source

1 answer

How do arrays work with C pointers? Php Math Game [closed]

score -1 · Answer 1

Review this example

<script>
	$(document).ready(function() {
		$('#submit').click(function(event) {
			var nombreVar = $('#nombre').val();
			var apellidoVar = $('#apellido').val();
			var edadVar = $('#edad').val();
			$.post('ActionServlet', {
				nombre : nombreVar,
				apellido: apellidoVar,
				edad: edadVar
			}, function(responseText) {
				$('#tabla').html(responseText);
			});
		});
	});
</script>
</head>
<body>
	<h2>Ejemplo de AJAX con JSP y Servelts</h2>
	<form id="form1">
		Nombre:<input type="text" id="nombre" /> <br>
		Apellido: <input type="text" id="apellido" /> <br>
		Edad: <input type="text" id="edad" /> <br>
		<input type="button" id="submit" value="Añadir" /> 
	</form>
	<br>
	<div id="tabla"></div>
</body>

A java file is involved, where you have your Person class and you record the values

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub	
		
		response.setContentType( "text/html; charset=iso-8859-1" );
		PrintWriter out = response.getWriter();
		
		// Obtengo los datos de la peticion
		String nombre = request.getParameter("nombre");
		String apellido = request.getParameter("apellido");
		String edad = request.getParameter("edad");
		
		if (!nombre.equals("") && !apellido.equals("") && !edad.equals("")) {
			// Creo el objeto persona y lo añado al arrayList
			Persona persona = new Persona(nombre, apellido, edad);
			personas.add(persona);
		}
		
		out.println("<table style= cellspacing=\"1\" bgcolor=\"#0099cc\">");
		out.println("<tr>");
		out.println("<td style= rowspan=\"7\" align=\"center\" bgcolor=\"#f8f8f8\"> NOMBRE </td>");			
		out.println("<td style= rowspan=\"7\" align=\"center\" bgcolor=\"#f8f8f8\">APELLIDO</td>");
		out.println("<td style= rowspan=\"7\" align=\"center\" bgcolor=\"#f8f8f8\">EDAD</td>");
		out.println("</tr>");
		for(int i=0; i<personas.size(); i++){
			Persona persona = personas.get(i);
			out.println("<tr>");
			out.println("<td style= rowspan=\"7\" align=\"center\" bgcolor=\"#f8f8f8\">"+persona.getNombre()+"</td>");			
			out.println("<td style= rowspan=\"7\" align=\"center\" bgcolor=\"#f8f8f8\">"+persona.getApellido()+"</td>");
			out.println("<td style= rowspan=\"7\" align=\"center\" bgcolor=\"#f8f8f8\">"+persona.getEdad()+"</td>");
			out.println("</tr>");
		}
		out.println("</table>");		
		
	}