por qu este CRUD no me esta funcionando que estara mal?

  • Autor Autor isacsito
  • Fecha de inicio Fecha de inicio
I

isacsito

Curioso
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
aca capturo datos y opciones se llma clientes.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>El título de mi página</title>
<link rel="stylesheet" href="estilos.css">
<script type="text/javascript" src="crud.js"></script>
</head>

<body>

<header>
<h1>ESTE ES EL SISTEMA ESTOCOLMO</h1>
<nav>
<ul>
<li><a href="index.html">INICIO</a></li>
</ul>
</nav>
</header>
<section>
<form >
<div>
<label>ID :</label>
<input type="text" name="id" id="id">
</div>
<div>
<label>NOMBRE :</label>
<input type="text" name="nombre" id="nombre">
</div>
<div>
<label>TELEFONO :</label>
<input type="text" name="telefono" id="telefono">
</div>
<div>
<label>CIUDAD :</label>
<input type="text" name="ciudad" id="ciudad">
</div>
<div class="botones">
<input type="submit" value="INSERTAR" onclick="insertar()">
<input type="submit" value="BORRAR" onclick="eliminar()">
<input type="submit" value="BUSCAR" onclick="mostrar">
<input type="submit" value="ACTUALIZAR" onclick="editar()">
<br>
<a href="verClientes.html">VER LISTADO</a>
</div>
</div>
</div>
</form>
</form>
</article>
</section>
</body>
</html>

aca hago las funciones con javascript se llama crud.js
function ver(){
var lista=document.getElementById('lista');
cliente.forEach(function(data,index){
var linew= document.createElement('li');
var contenido = document.createTextNode(data.id+' '+data.nombre+" "
+data.telefono+" "+data.ciudad);
lista.appendChild(linew);
linew.appendChild(contenido);
})
}

cliente = [{id:'1', nombre:'lupe',telefono:'2131231',ciudad: 'cali'}]


function insertar(){

var id = document.getElementById('id').value;
var nom = document.getElementById('nombre').value;
var tel = document.getElementById('telefono').value;
var ciu = document.getElementById('ciudad').value;
cliente.push({id: id, nombre: nom, telefono: tel, ciudad: ciu});
alert('REGISTRO CREADO');
}

function eliminar(){
var id = document.getElementById('id').value;
var nom = document.getElementById('nombre');
var tel = document.getElementById('telefono');
var ciu = document.getElementById('ciudad');
for(let x in cliente){
if (id == cliente[x].id){
delete cliente[x].id;
delete cliente[x].nombre;
delete cliente[x].telefono;
delete cliente[x].ciudad;
alert('REGISTRO ELIMINADO');
}
else{
alert('NO SE ENCUENTRA EL ID');
}
}
}

function mostrar(){
var id = document.getElementById('id').value;
var nom = document.getElementById('nombre');
var tel = document.getElementById('telefono');
var ciu = document.getElementById('ciudad');
for(let x in cliente){
if (id == cliente[x].id){
nom.value = cliente[x].nombre;
tel.value = cliente[x].telefono;
ciu.value = cliente[x].ciudad;
break;
}
else{
alert('OJO');
}
}
}

function editar(){

var id = document.getElementById('id').value;
if(id == ''){
alert('REGISTRO NO EXISTE');
}
else{
var nom = document.getElementById('nombre').value;
var tel = document.getElementById('telefono').value;
var ciu = document.getElementById('ciudad').value;
elementIndex = cliente.findIndex(obj => obj.id == id);
cliente[elementIndex].nombre = nom;
cliente[elementIndex].telefono = tel;
cliente[elementIndex].ciudad = ciu;
alert('REGISTRO ACTUALIZADO')

}

este sirve para mostrar el listado de objetos se llama verClientes

function ver(){
var lista=document.getElementById('lista');
cliente.forEach(function(data,index){
var linew= document.createElement('li');
var contenido = document.createTextNode(data.id+' '+data.nombre+" "
+data.telefono+" "+data.ciudad);
lista.appendChild(linew);
linew.appendChild(contenido);
})
}

cliente = [{id:'1', nombre:'lupe',telefono:'2131231',ciudad: 'cali'}]


function insertar(){

var id = document.getElementById('id').value;
var nom = document.getElementById('nombre').value;
var tel = document.getElementById('telefono').value;
var ciu = document.getElementById('ciudad').value;
cliente.push({id: id, nombre: nom, telefono: tel, ciudad: ciu});
alert('REGISTRO CREADO');
}

function eliminar(){
var id = document.getElementById('id').value;
var nom = document.getElementById('nombre');
var tel = document.getElementById('telefono');
var ciu = document.getElementById('ciudad');
for(let x in cliente){
if (id == cliente[x].id){
delete cliente[x].id;
delete cliente[x].nombre;
delete cliente[x].telefono;
delete cliente[x].ciudad;
alert('REGISTRO ELIMINADO');
}
else{
alert('NO SE ENCUENTRA EL ID');
}
}
}

function mostrar(){
var id = document.getElementById('id').value;
var nom = document.getElementById('nombre');
var tel = document.getElementById('telefono');
var ciu = document.getElementById('ciudad');
for(let x in cliente){
if (id == cliente[x].id){
nom.value = cliente[x].nombre;
tel.value = cliente[x].telefono;
ciu.value = cliente[x].ciudad;
break;
}
else{
alert('OJO');
}
}
}

function editar(){

var id = document.getElementById('id').value;
if(id == ''){
alert('REGISTRO NO EXISTE');
}
else{
var nom = document.getElementById('nombre').value;
var tel = document.getElementById('telefono').value;
var ciu = document.getElementById('ciudad').value;
elementIndex = cliente.findIndex(obj => obj.id == id);
cliente[elementIndex].nombre = nom;
cliente[elementIndex].telefono = tel;
cliente[elementIndex].ciudad = ciu;
alert('REGISTRO ACTUALIZADO')

}
 
Estoy tratando de leer, pero ese código esta muy feo. Usa el formato de código en el editor de texto, porque así como está da dolor de cabeza. leerlo.... O adjuntalo como un archivo de texto plano.
 
Creo que te faltaba cerrar un par de llaves y quitar etiquetas que ni siquiera estaban abiertas
HTML: 
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>El título de mi página</title>
    <link rel="stylesheet" href="estilos.css">
    <!-- <script type="text/javascript" src="crud.js"></script> -->
</head>

<body>

    <header>
        <h1>ESTE ES EL SISTEMA ESTOCOLMO</h1>
        <nav>
            <ul>
                <li><a href="index.html">INICIO</a></li>
            </ul>
        </nav>
    </header>
    <section>
        <form>
            <div>
                <label>ID :</label>
                <input type="text" name="id" id="id">
            </div>
            <div>
                <label>NOMBRE :</label>
                <input type="text" name="nombre" id="nombre">
            </div>
            <div>
                <label>TELEFONO :</label>
                <input type="text" name="telefono" id="telefono">
            </div>
            <div>
                <label>CIUDAD :</label>
                <input type="text" name="ciudad" id="ciudad">
            </div>
            <div class="botones">
                <input type="submit" value="INSERTAR" onclick="insertar()">
                <input type="submit" value="BORRAR" onclick="eliminar()">
                <input type="submit" value="BUSCAR" onclick="mostrar">
                <input type="submit" value="ACTUALIZAR" onclick="editar()">
                <br>
                <a href="verClientes.html">VER LISTADO</a>
            </div>

        </form>
        <!--  </form> Este form esta de mas -->

    </section>



    <script>


        function ver() {
            var lista = document.getElementById('lista');
            cliente.forEach(function (data, index) {
                var linew = document.createElement('li');
                var contenido = document.createTextNode(data.id + ' ' + data.nombre + " "
                    + data.telefono + " " + data.ciudad);
                lista.appendChild(linew);
                linew.appendChild(contenido);
            })
        }

        cliente = [{ id: '1', nombre: 'lupe', telefono: '2131231', ciudad: 'cali' }]


        function insertar() {

            var id = document.getElementById('id').value;
            var nom = document.getElementById('nombre').value;
            var tel = document.getElementById('telefono').value;
            var ciu = document.getElementById('ciudad').value;
            cliente.push({ id: id, nombre: nom, telefono: tel, ciudad: ciu });
            alert('REGISTRO CREADO');
        }

        function eliminar() {
            var id = document.getElementById('id').value;
            var nom = document.getElementById('nombre');
            var tel = document.getElementById('telefono');
            var ciu = document.getElementById('ciudad');
            for (let x in cliente) {
                if (id == cliente[x].id) {
                    delete cliente[x].id;
                    delete cliente[x].nombre;
                    delete cliente[x].telefono;
                    delete cliente[x].ciudad;
                    alert('REGISTRO ELIMINADO');
                }
                else {
                    alert('NO SE ENCUENTRA EL ID');
                }
            }
        }

        function mostrar() {
            var id = document.getElementById('id').value;
            var nom = document.getElementById('nombre');
            var tel = document.getElementById('telefono');
            var ciu = document.getElementById('ciudad');
            for (let x in cliente) {
                if (id == cliente[x].id) {
                    nom.value = cliente[x].nombre;
                    tel.value = cliente[x].telefono;
                    ciu.value = cliente[x].ciudad;
                    break;
                }
                else {
                    alert('OJO');
                }
            }
        }

        function editar() {

            var id = document.getElementById('id').value;
            if (id == '') {
                alert('REGISTRO NO EXISTE');
            }
            else {
                var nom = document.getElementById('nombre').value;
                var tel = document.getElementById('telefono').value;
                var ciu = document.getElementById('ciudad').value;
                elementIndex = cliente.findIndex(obj => obj.id == id);
                cliente[elementIndex].nombre = nom;
                cliente[elementIndex].telefono = tel;
                cliente[elementIndex].ciudad = ciu;
                alert('REGISTRO ACTUALIZADO');

            }
        }

        // este sirve para mostrar el listado de objetos se llama verClientes

        function ver() {
            var lista = document.getElementById('lista');
            cliente.forEach(function (data, index) {
                var linew = document.createElement('li');
                var contenido = document.createTextNode(data.id + ' ' + data.nombre + " "
                    + data.telefono + " " + data.ciudad);
                lista.appendChild(linew);
                linew.appendChild(contenido);
            })
        }

        cliente = [{ id: '1', nombre: 'lupe', telefono: '2131231', ciudad: 'cali' }];


        function insertar() {

            var id = document.getElementById('id').value;
            var nom = document.getElementById('nombre').value;
            var tel = document.getElementById('telefono').value;
            var ciu = document.getElementById('ciudad').value;
            cliente.push({ id: id, nombre: nom, telefono: tel, ciudad: ciu });
            alert('REGISTRO CREADO');
        }

        function eliminar() {
            var id = document.getElementById('id').value;
            var nom = document.getElementById('nombre');
            var tel = document.getElementById('telefono');
            var ciu = document.getElementById('ciudad');
            for (let x in cliente) {
                if (id == cliente[x].id) {
                    delete cliente[x].id;
                    delete cliente[x].nombre;
                    delete cliente[x].telefono;
                    delete cliente[x].ciudad;
                    alert('REGISTRO ELIMINADO');
                }
                else {
                    alert('NO SE ENCUENTRA EL ID');
                }
            }
        }

        function mostrar() {
            var id = document.getElementById('id').value;
            var nom = document.getElementById('nombre');
            var tel = document.getElementById('telefono');
            var ciu = document.getElementById('ciudad');
            for (let x in cliente) {
                if (id == cliente[x].id) {
                    nom.value = cliente[x].nombre;
                    tel.value = cliente[x].telefono;
                    ciu.value = cliente[x].ciudad;
                    break;
                }
                else {
                    alert('OJO');
                }
            }
        }

        function editar() {

            var id = document.getElementById('id').value;
            if (id == '') {
                alert('REGISTRO NO EXISTE');
            }
            else {
                var nom = document.getElementById('nombre').value;
                var tel = document.getElementById('telefono').value;
                var ciu = document.getElementById('ciudad').value;
                elementIndex = cliente.findIndex(obj => obj.id == id);
                cliente[elementIndex].nombre = nom;
                cliente[elementIndex].telefono = tel;
                cliente[elementIndex].ciudad = ciu;
                alert('REGISTRO ACTUALIZADO');

            }
        }

    </script>
</body>

</html>
 
No funciono recuerden que los archivos son por separado
 
Hay que estar conectado o registrado para responder aquí.
Atrás
Arriba