Foros del Web » Programando para Internet » Jquery »

No puedo abrir datatables

 Estas en el tema de No puedo abrir datatables en el foro de Jquery en Foros del Web. Estoy desarrollando un sistema en el cual el archivo obra.php contiene un formulario para crear una nueva obra y un boton que muestra un datatable ...
  #1 (permalink)  
Antiguo 19/01/2015, 07:32
 
Fecha de Ingreso: enero-2015
Ubicación: Valparaiso
Mensajes: 88
Antigüedad: 9 años, 3 meses
Puntos: 0
No puedo abrir datatables
Estoy desarrollando un sistema en el cual el archivo obra.php contiene un formulario para crear una nueva obra y un boton que muestra un datatable con todas las obras en la bd, el problema es que ninguna de las 2 funciones se ejecuta, lo extraño es que en otro modulo del sistema tengo implementadas estas mismas funciones para los clientes del sistema y funciona bien.

obra.php
Código HTML:
<!DOCTYPE html>
<html lang="es">
<body>
    <!-- main container -->
    <div class="content">

        <!-- end upper main stats -->

        <div id="pad-wrapper" class="form-page">

            <!-- statistics chart built with jQuery Flot -->
            <div class="row form-wrapper">
                <!-- left column -->
                <div id="miPagina" class="col-md-5 column">

                    <form method="POST">
    
                        <div class="field-box">
                            <label>Nombre:</label>
                            <div class="col-md-7">
                                <input name="nombre" id="nombre" class="form-control" required autofocus type="text">
                            </div>                            
                        </div>
                        <div class="field-box">
                            <label>Codigo Cliente:</label>
                            <div class="col-md-7">
                                <input name="cclte" id="cclte" class="form-control" required type="text">
                            </div>                            
                        </div>
                        <div class="field-box">
                            <label>Fecha Inicio:</label>
                            <div class="col-md-7">
                                <input name="feini" id="feini" class="form-control" required type="text">
                            </div>                            
                        </div>
                        <div class="field-box">
                            <label>Fecha Termino:</label>
                            <div class="col-md-7">
                                <input name="fefin" id="fefin" class="form-control" required type="text" >
                            </div>                            
                        </div>
                        <div class="action">
                            <input type="submit" class="btn-flat" id="registrar" value="Registrar" ></input>
                            <input type="button" onclick="listarObras();"  class="btn-flat" id="mostrar" value="Mostrar" ></input>
                        </div>                         
                    </form>
                    <div id="mensaje" class="col-md-6">                        
                    </div>
                </div>
                <!-- right column -->
                <div id="miTabla2" class="col-md-7 column pull-right">
                    <div id="cargando2"></div>
                </div>
            </div>
        </div>
    </div>
    <!-- scripts -->
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="js/wysihtml5-0.3.0.js"></script>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/bootstrap.datepicker.js"></script>
    <script src="js/jquery.uniform.min.js"></script>
    <script src="js/select2.min.js"></script>
    <script src="js/jquery-ui-1.10.2.custom.min.js"></script>  
    <script src="js/theme.js"></script>
    <script src="js/jquery.dataTables.js"></script>
    <script src="js/funciones.js"></script>
    <script type="text/javascript">
        registrarObra();
    </script>
</body>
</html>
registrarObra
Código HTML:
<?php 

	//include_once('conexion.php');
	$con=mysqli_connect("localhost","root","","proyecto7db");
	// Check connection
	if (mysqli_connect_errno())
	  {
	  echo "Failed to connect to MySQL: " . mysqli_connect_error();
	  }		
	$nombre = $_POST['nombre'];
	$cclte = $_POST['cclte'];
	$feini = $_POST['feini'];
	$fefin = $_POST['fefin'];
	$sql = "INSERT INTO obra (nombre, cod_cliente, fecha_inicio, fecha_final) 
				VALUES ('$nombre', '$cclte', '$feini', '$fefin')";
	$res = $con->query($sql);	
	if ( isset( $res ) )
		echo "correcto";
	else
		echo "error";	
?>
listarObra.php
Código HTML:
<?php 

	sleep(1);
	$con=mysqli_connect("localhost","root","","proyecto7db");
	// Check connection
	if (mysqli_connect_errno())
	  {
	  echo "Failed to connect to MySQL: " . mysqli_connect_error();
	  }
	$sql = "SELECT * FROM obra";
	$res = $con->query($sql);
	$ide = "";
	echo "<div id='pad-wrapper' class='datatables-page' style='margin-top:0px;'>";            
	echo "           <div class='row'>";
	echo "               <div class='col-md-8'>";
	echo "                    <table id='example2' class='table table-hover'>";
	echo "                        <thead>";
	echo "                            <tr>";
	echo "                                <th tabindex='0' rowspan='1' colspan='1'></th>";
	echo "                                <th tabindex='0' rowspan='1' colspan='1'></th>";
	echo "                                <th style = 'display:none;' tabindex='0' rowspan='1' colspan='1'>ID</th>";
	echo "                                <th tabindex='0' rowspan='1' colspan='1'>Nombre</th>";
	echo "                                <th tabindex='0' rowspan='1' colspan='1'>Fecha Inicio</th>";
	echo "                                <th tabindex='0' rowspan='1' colspan='1'>Fecha Final</th>";
	echo "                                <th tabindex='0' rowspan='1' colspan='1'>Egresos Totales</th>";
	echo "                                <th tabindex='0' rowspan='1' colspan='1'>Ingresos Totales</th>";
	echo "                                <th tabindex='0' rowspan='1' colspan='1'>Recepcion Total</th>";
	echo "                                <th tabindex='0' rowspan='1' colspan='1'>Recepcion Total de Combustibles</th>";
	echo "                                <th tabindex='0' rowspan='1' colspan='1'>Emision Total de Combustibles</th>";
	echo "                                <th tabindex='0' rowspan='1' colspan='1'>Saldo General</th>";
	echo "                            </tr>";
	echo "                        </thead>";
	echo "                        <tbody>";
			while ($edit_obras = $res->fetch_array()) {
	echo "                            <tr>";
	echo "                                <td class='center'><a onclick='LDO(".$ide=$edit_obras[0].");' data-toggle='modal' data-target='#myModal-EditOb' style='cursor:pointer;'><i class='icon-edit'></i></a></td>";
	echo "                                <td class='center'><a onclick='MO(".$ide=$edit_obras[0].");' data-toggle='modal' data-target='#myModal-DeleteOb' style='cursor:pointer;'><i class='icon-remove'></i></a></td>";
	echo "                                <td style = 'display:none;'>".$edit_obras[0]."</td>";
	echo "                                <td class='center'>".$edit_obras[1]."</td>";
	echo "                                <td class='center'>".$edit_obras[2]."</td>";
	echo "                                <td class='center'>".$edit_obras[3]."</td>";
	echo "                                <td class='center'>".$edit_obras[4]."</td>";
	echo "                                <td class='center'>".$edit_obras[5]."</td>";
	echo "                                <td class='center'>".$edit_obras[6]."</td>";
	echo "                                <td class='center'>".$edit_obras[7]."</td>";
	echo "                                <td class='center'>".$edit_obras[8]."</td>";
	echo "                                <td class='center'>".$edit_obras[9]."</td>";
	echo "                            </tr>";
			}
	echo "                        </tbody>";
	echo "                    </table>";
	echo "                </div>";
	echo "            </div>";
	echo "        </div>";

	/*PARTE DE EDITAR Y ELIMINAR CLIENTE*/
	echo "
	<!-- Modal para Editar-->
	<div class='modal fade' id='myModal-EditOb' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'>
	  
	</div><!-- /.modal -->";

	echo "
	<!-- Modal para Eliminar-->
	<div class='modal fade' id='myModal-DeleteOb' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'>
	  
	</div><!-- /.modal -->";

	echo " <script type='text/javascript'>
			$(document).ready(function() {
				$('#example').dataTable({
					'sPaginationType': 'full_numbers',
					'oLanguage':{
						'sProcessing':     'Cargando...',
						'sLengthMenu':     'Mostrar _MENU_ registros',
						'sZeroRecords':    'No se encontraron resultados',
						'sEmptyTable':     'Ningún dato disponible en esta tabla',
						'sInfo':           'Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros',
						'sInfoEmpty':      'Mostrando registros del 0 al 0 de un total de 0 registros',
						'sInfoFiltered':   '(filtrado de un total de _MAX_ registros)',
						'sInfoPostFix':    '',
						'sSearch':         'Buscar:',
						'sUrl':            '',
						'sInfoThousands':  '',
						'sLoadingRecords': 'Cargando...',
						'oPaginate': {
							'sFirst':    'Primero',
							'sLast':     'Último',
							'sNext':     'Siguiente',
							'sPrevious': 'Anterior'
						},
						'oAria': {
							'sSortAscending':  ': Activar para ordenar la columna de manera ascendente',
							'sSortDescending': ': Activar para ordenar la columna de manera descendente'
						}
					},
					'aaSorting': [[ 0, 'desc' ]],//ordenar
					'iDisplayLength': 5,
					'aLengthMenu': [[1, 2, 5, 10, 20, 50, -1], [1, 2, 5, 10, 20, 50, 'All']]
				});
			});			
			</script>";
 ?>
Cualquier ayuda es bien recibida, es primera vez que trabajo con jquery y sus plugin y por el momento lo odio con todo mi corazon
  #2 (permalink)  
Antiguo 19/01/2015, 07:33
 
Fecha de Ingreso: enero-2015
Ubicación: Valparaiso
Mensajes: 88
Antigüedad: 9 años, 3 meses
Puntos: 0
Respuesta: No puedo abrir datatables
funciones.js
Código HTML:
//Funciones Obra

function listarObras(){	 
	$.ajax({			
		url: 'listarObra.php',
		type: 'GET',
		beforeSend: function(){
			$("#miTabla2").html("");
			$("#miTabla2").removeClass("linea");
			$("#miTabla2").html("<div id='cargando2'></div>"); 
			$('#cargando2').html('<img src="css/images/cargar.gif"/>');
		},
		success: function(data){
           $("#miTabla2").html(data);
           $("#miTabla2").hide();
           $("#miTabla2").fadeToggle(2000,'swing');
           $("#miTabla2").addClass("linea");
		}
	});
}

function registrarObra(){

	$("form").on('submit', function(e) {
		e.preventDefault();
		var nombre = $("#nombre").val();
		var cclte = $("#cclte").val();
		var feini = $("#feini").val();
		var fefin = $("#fefin").val();
		$.ajax({
			  type: "POST",
			  url: "registrarObra.php",
			  data: { nombre: nombre, cclte: cclte, feini: feini,
			  		  fefin: fefin },
			  success: function(msg){
			  	if(msg == "correcto"){
			  		$("#mensaje").html("<div class='alert alert-success'><i class='icon-ok-sign'></i> Cliente registrado con Exito</div>");
			  		listarObras();
			  	}
			  }		  
		}).done(function() {
			$("#nombre").val("");
			$("#cclte").val("");
			$("#feini").val("");
			$("#fefin").val("");
			$("#mensaje").fadeOut( 4000, "linear");
		  });
	});
}
  #3 (permalink)  
Antiguo 19/01/2015, 08:17
 
Fecha de Ingreso: enero-2015
Ubicación: Valparaiso
Mensajes: 88
Antigüedad: 9 años, 3 meses
Puntos: 0
Respuesta: No puedo abrir datatables
Me acabo de dar cuenta que el problema es en mozilla, en chrome me esta funcionando bien

Etiquetas: datatables
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 14:34.