Untitled

//insert de los datos
<?php
//conexion a la base de datos
include 'conexion.php';


//almacena los datos ingresados en los textboxs
$nomb=$_POST['Nombres'];
$apell=$_POST['Apellidos'];
$ident=$_POST['Identidad'];
$email=$_POST['Correo'];
$user=$_POST['Usuario'];
$pass=$_POST['Password'];
$perm=$_POST['Nivel_Permiso'];

//Sentencia insert que afectara la tabla usuarios
$sql="INSERT INTO usuario (Nombres, Apellidos, Identidad, correo, Usuario, Password, Nivel_Permiso) VALUES
('$nomb', '$apell', '$ident', '$email','$user', '$pass', '$perm')";

echo $result=mysqli_query($conexion,$sql);


?>


//funcion javascript y ajax para validar y hacer la llamada del insert
function agregarusuarios(Nombres,Apellidos,Identidad,Correo,Usuario,Password,Nivel_Permiso) {

    cadena="&Nombres=" + Nombres +
           "&Apellidos=" + Apellidos +
            "&Identidad=" + Identidad +
            "&Correo=" + Correo +
            "&Usuario=" + Usuario +
            "&Password=" + Password +
            "&Nivel_Permiso" + Nivel_Permiso;

    //validacion de ingreso de datos con ajax e y llamada     del insert
    $.ajax({
     type:"POST",
     url:"agregardatos.php",
     data:cadena,
     success:function (r) {
         if (r==1) {
             //al momento que se agregue un dato se vuela a recargar la tabla

             alertify.success("Usuario Registrado Correctamente");
             $('#tabla').load('tabla.php');
         }else{
            alertify.success("Fallo en el servidor");


         }
     }

    });

}


 <!DOCTYPE html>
    <html>
    <head>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
        <title>Usuarios</title>
        <link rel="stylesheet" type="text/css" href="librerias/bootstrap/css/bootstrap.css">
        <link rel="stylesheet" type="text/css" href="librerias/alertifyjs/css/alertify.css">
        <link rel="stylesheet" type="text/css" href="librerias/alertifyjs/css/themes/default.css">

        <script src="librerias/jquery-3.2.1.min.js"></script>
        <!--llamado de las funciones que estan en el archivo funciones.js-->
        <script src="funciones.js"></script>
        <script src="librerias/bootstrap/js/bootstrap.js"></script>
        <script src="librerias/alertifyjs/alertify.js"></script>
    </head>
    <body>

    <!--Uso de la tablaTabla-->
    <div class="container">
    <div id="tabla"></div>
    </div>

    <!-- Modal para registro de usuarios nuevos -->
    <!-- Modal -->
    <div class="modal fade" id="ModalRegistro" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="myModalLabel">Agrega Usuarios </h4>
          </div>
          <div class="modal-body">
          <!-- campos para registrar usuarios -->
          <label>Nombres: </label>
            <input type="text" id="Nombres" class="form-control input-sm" name="Nombres"><br>

            <label>Apellidos: </label>
            <input type="text" id="Apellidos" class="form-control input-sm"  name="Apellidos" ><br>

            <label>Identidad: </label>
              <input type="text" id="Identidad" class="form-control input-sm"  name="Identidad" ><br>

              <label>Correo: </label>
              <input type="text" id="Correo" class="form-control input-sm"  name="Correo" ><br>

              <label>Usuario: </label>
              <input type="text" id="Usuario" class="form-control input-sm"  name="Usuario" ><br>

              <label>Password: </label>
              <input type="text" id="Password" class="form-control input-sm"  name="Password" ><br>

              <label>Nivel de Permiso: </label>
              <input type="text" id="Nivel_Permiso" class="form-control input-sm"  name="Nivel_Permiso" ><br>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-primary" data-dismiss="modal" id="guardarnuevo">
            Agregar
            </button>

          </div>
        </div>
      </div>
    </div>

    <!-- Modal para edicion de nuevos usuarios-->
    <!-- Modal -->
    <div class="modal fade" id="ModalEdicion" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="myModalLabel">Actualizar Datos</h4>
          </div>
          <div class="modal-body">
          <label>Nombres: </label>
            <input type="text" id="Nombrese" class="form-control input-sm" name="Nombrese"><br>

            <label>Apellidos: </label>
            <input type="text" id="Apellidose" class="form-control input-sm"  name="Apellidose" ><br>

            <label>Identidad: </label>
              <input type="text" id="Identidade" class="form-control input-sm"  name="Identidade" ><br>

              <label>Correo: </label>
              <input type="text" id="Correoe" class="form-control input-sm"  name="Correoe" ><br>

              <label>Usuario: </label>
              <input type="text" id="Usuarioe" class="form-control input-sm"  name="Usuarioe" ><br>

              <label>Password: </label>
              <input type="text" id="Passworde" class="form-control input-sm"  name="Passworde" ><br>

              <label>Nivel de Permiso: </label>
              <input type="text" id="Nivel_Permisoe" class="form-control input-sm"  name="Nivel_Permisoe" ><br>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-warning" id="actualizadatos" data-dismiss="modal">Actualizar</button>

          </div>
        </div>
      </div>
    </div>

    </body>
    </html>


//codigo javascript llamar la tabla y el evento del boton guardar
<!--llamada a la tabla.php-->
<script type="text/javascript">
$(document).ready(function() {
    $('#tabla').load('tabla.php');
});
</script>
<!--llamada a la funcion inserta usuarios-->
<script type="text/javascript">
$(document).ready(function() {
  $('#guardarnuevo').click(function(){
        Nombres=$('#Nombres').val();
        Apellidos=$('#Apellidos').val();
        Identidad=$('#Identidad').val();
        Correo=$('#Correo').val();
        Usuario=$('#Usuario').val();
        Password=$('#Password').val();
        Nivel_Permiso=$('#Nivel_Permiso').val();
    agregarusuarios(Nombres,Apellidos,Identidad,Correo,Usuario,Password,Nivel_Permiso)
    });
});
</script>