Skip to main content
<script type="text/javascript"> 

    //console.log(document.getElementsByName("fecha1"));
    
    function cambio (input) { 

        var inputs = document.getElementsByTagName("input"); 

        console.log(input.value); 

        var inputInt; 

        for (var i = 0; i < inputs.length; i++) { 

            if (inputs[i] == input) { 

                inputInt = i; 

            } 

        }

        if (inputInt > 0) { 

            if (inputs[inputInt -1  ]1].value > input.value) { 

                input.style.background= "red";  

            } else { 

                input.style.background= "green";  

            } 

        } else { 

            input.style.background= "green";  

        }

    }

</script>

Todos los inputinput deben ir de esta forma.

<table> 

    <tr> 
        <td> 
            <input type="date" name="fecha1" value="2000-05-05" onkeyup="cambio(this)" onclick="cambio(this)">
        </td> 
    </tr> 

    <tr> 
        <td> 
            <input type="date" name="fecha2" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
       </td> 
    </tr> 
<tr> 
    <tr>
        <td> 
            <input type="date" name="fecha3" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
        </td> 
    </tr> 

    <tr> 
        <td> 
            <input type="date" name="fecha4" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
        </td> 
    </tr> 

</table>

Una vez que veas que funcionó cambia los valores de los inputinput por los tuyos.

Nota: si tienes mas input habría que hacer una validación para que solo te tome esos 4, ya que en la función js revisa todos los inputs

Nota: si tienes mas input habría que hacer una validación para que solo te tome esos 4, ya que en la función JavaScript revisa todos los inputs.

<script type="text/javascript">
    //console.log(document.getElementsByName("fecha1"));
    
    function cambio(input){
        var inputs = document.getElementsByTagName("input");
        console.log(input.value);
        var inputInt;
        for (var i = 0; i < inputs.length; i++) {
            if (inputs[i] == input) {
                inputInt = i;
            }
        }

        if (inputInt > 0) {
            if (inputs[inputInt -1  ].value > input.value) {
                input.style.background= "red"; 
            } else {
                input.style.background= "green"; 
            }
        } else {
            input.style.background= "green"; 
        }

    }

</script>

Todos los input deben ir de esta forma.

<table>
<tr> 
<td> 
<input type="date" name="fecha1" value="2000-05-05" onkeyup="cambio(this)" onclick="cambio(this)">
</td> 
</tr> 

<tr> 
<td> 
<input type="date" name="fecha2" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
</td> 
</tr> 
<tr> 

<td> 
<input type="date" name="fecha3" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
</td> 
</tr> 

<tr> 
<td> 
<input type="date" name="fecha4" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
</td> 
</tr> 

Una vez que veas que funcionó cambia los valores de los input por los tuyos.

Nota: si tienes mas input habría que hacer una validación para que solo te tome esos 4, ya que en la función js revisa todos los inputs

<script type="text/javascript"> 

    //console.log(document.getElementsByName("fecha1"));
    
    function cambio (input) { 

        var inputs = document.getElementsByTagName("input"); 

        console.log(input.value); 

        var inputInt; 

        for (var i = 0; i < inputs.length; i++) { 

            if (inputs[i] == input) { 

                inputInt = i; 

            } 

        }

        if (inputInt > 0) { 

            if (inputs[inputInt -1].value > input.value) { 

                input.style.background= "red"; 

            } else { 

                input.style.background= "green"; 

            } 

        } else { 

            input.style.background= "green"; 

        }

    }

</script>

Todos los input deben ir de esta forma.

<table> 

    <tr> 
        <td> 
            <input type="date" name="fecha1" value="2000-05-05" onkeyup="cambio(this)" onclick="cambio(this)">
        </td> 
    </tr> 

    <tr> 
        <td> 
            <input type="date" name="fecha2" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
       </td> 
    </tr>

    <tr>
        <td> 
            <input type="date" name="fecha3" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
        </td> 
    </tr> 

    <tr> 
        <td> 
            <input type="date" name="fecha4" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
        </td> 
    </tr>

</table>

Una vez que veas que funcionó cambia los valores de los input por los tuyos.

Nota: si tienes mas input habría que hacer una validación para que solo te tome esos 4, ya que en la función JavaScript revisa todos los inputs.

se añadieron 536 caracteres en el cuerpo
Origen Enlace
Sr1871
  • 5.8k
  • 1
  • 12
  • 16

Puedes intentar algo como estoCambio en el código para que se muestre gráficamente

<script type="text/javascript">
    //console.log(document.getElementsByName("fecha1"));
    
    function cambio(input){
        var inputs = document.getElementsByTagName("input");
        console.log(input.value);
        var inputInt;
        for (var i = 0; i < inputs.length; i++) {
            if (inputs[i] == input) {
                inputInt = i;
            }
        }

        if (inputInt > 0) {
            if (inputs[inputInt -1  ].value <> input.value) {
                consoleinput.log("esstyle.background= menor"red"; a 
 la fecha anterior");         } else {
                input.style.background= "green"; 
            }
        } else {
            input.style.background= "green"; 
        }

    }

</script>

Solo que valida solo cuando se presiona la tecla (se introduce el numero por teclado y no cuando cambia, podrías intentar usar jquery para validar mejor el cambio.

También es necesario ponerle en onkeypress a cadaTodos los input deben ir de esta forma.

<table>
<tr> 
<td> 
<input type="date" name="fecha1" value="<?phpvalue="2000-05-05" echoonkeyup="cambio(this)" dateonclick="cambio($fecha1this);?>"">
</td> onkeypress="cambio
</tr> 

<tr> 
<td> 
<input type="date" name="fecha2" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
</td> 
</tr> 
<tr> 

<td> 
<input type="date" name="fecha3" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
</td> 
</tr> 

<tr> 
<td> 
<input type="date" name="fecha4" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
</td> 
</tr> 

Una vez que veas que funcionó cambia los valores de los input por los tuyos.

Nota: si tienes mas input habría que hacer una validación para que solo te tome esos 4, ya que en la función js revisa todos los inputs

Puedes intentar algo como esto

function cambio(input){
        var inputs = document.getElementsByTagName("input");
        console.log(input.value);
        var inputInt;
        for (var i = 0; i < inputs.length; i++) {
            if (inputs[i] == input) {
                inputInt = i;
            }
        }

        if (inputInt > 0) {
            if (inputs[inputInt -1  ].value < input.value) {
                console.log("es menor a la fecha anterior");
            }
        }

    }

Solo que valida solo cuando se presiona la tecla (se introduce el numero por teclado y no cuando cambia, podrías intentar usar jquery para validar mejor el cambio.

También es necesario ponerle en onkeypress a cada input.

<input type="date" name="fecha1" value="<?php echo date($fecha1);?>" onkeypress="cambio(this)">
</td> 

Cambio en el código para que se muestre gráficamente

<script type="text/javascript">
    //console.log(document.getElementsByName("fecha1"));
    
    function cambio(input){
        var inputs = document.getElementsByTagName("input");
        console.log(input.value);
        var inputInt;
        for (var i = 0; i < inputs.length; i++) {
            if (inputs[i] == input) {
                inputInt = i;
            }
        }

        if (inputInt > 0) {
            if (inputs[inputInt -1  ].value > input.value) {
                input.style.background= "red";  
            } else {
                input.style.background= "green"; 
            }
        } else {
            input.style.background= "green"; 
        }

    }

</script>

Todos los input deben ir de esta forma.

<table>
<tr> 
<td> 
<input type="date" name="fecha1" value="2000-05-05" onkeyup="cambio(this)" onclick="cambio(this)">
</td> 
</tr> 

<tr> 
<td> 
<input type="date" name="fecha2" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
</td> 
</tr> 
<tr> 

<td> 
<input type="date" name="fecha3" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
</td> 
</tr> 

<tr> 
<td> 
<input type="date" name="fecha4" value="2000-05-05" onkeyup="cambio(this) onclick="cambio(this)">
</td> 
</tr> 

Una vez que veas que funcionó cambia los valores de los input por los tuyos.

Nota: si tienes mas input habría que hacer una validación para que solo te tome esos 4, ya que en la función js revisa todos los inputs

Origen Enlace
Sr1871
  • 5.8k
  • 1
  • 12
  • 16

Puedes intentar algo como esto

function cambio(input){
        var inputs = document.getElementsByTagName("input");
        console.log(input.value);
        var inputInt;
        for (var i = 0; i < inputs.length; i++) {
            if (inputs[i] == input) {
                inputInt = i;
            }
        }

        if (inputInt > 0) {
            if (inputs[inputInt -1  ].value < input.value) {
                console.log("es menor a la fecha anterior");
            }
        }

    }

Solo que valida solo cuando se presiona la tecla (se introduce el numero por teclado y no cuando cambia, podrías intentar usar jquery para validar mejor el cambio.

También es necesario ponerle en onkeypress a cada input.

<input type="date" name="fecha1" value="<?php echo date($fecha1);?>" onkeypress="cambio(this)">
</td>