How to make a single button turn on and off and on click send value in URL

0

In the code below each I have two forms one to send the value 1 and another to send 0 and both forms send this value via GET

When I send the GET PUMP STATUS # 1 ::="motor": receives the PLC return

STATUS PUMP # 1 :: = true

STATUS PUMP # 1 :: = false

Call

/index2.html? "motor" = 1

Disconnect

/index2.html? "motor" = 0

How do I make a single button send via GET and change the button text to On and Off?

<!DOCTYPE html>
<html lang="pt-br">
    <head>
        <meta charset="utf-8">
        <title>Liga Desliga</title>
    </head>
    <body>

        <form>
            <p>
                <input type="submit" value="LIGA">
                <input type="hidden" name='"motor"' value ="1">
            </p>
        </form>

        <form>
            <p>
                <input type="submit" value="DESLIGA">
                <input type="hidden" name='"motor"' value ="0">
            </p>
        </form>

        STATUS BOMBA N°1::="motor":

    </body>
</html>
    
asked by anonymous 12.07.2018 / 23:35

1 answer

1

If it is possible to add a script to the page, you can try something like the one developed in the code below:

<!DOCTYPE html>
<html lang="pt-br">
    <head>
        <meta charset="utf-8">
        <title>Liga Desliga</title>
        <script>
            var motorStatus = parseInt(decodeURIComponent(window.location.search.substr(1)).split('=')[1] || 0);

            window.onload = function(){
                if(motorStatus == 0){
                    document.querySelector('form[name="controlador"] input[type="submit"]').value = 'LIGA';
                    document.querySelector('form[name="controlador"] input[type="hidden"]').value = '1';
                } else{
                    document.querySelector('form[name="controlador"] input[type="submit"]').value = 'DESLIGA';
                    document.querySelector('form[name="controlador"] input[type="hidden"]').value = '0';
                }
            }
        </script>
    </head>
    <body>
        <form name="controlador">
            <input type="submit" value="LIGA">
            <input type="hidden" name='"motor"' value ="1">
        </form>
        STATUS BOMBA N°1::="motor":
    </body>
</html>
    
13.07.2018 / 19:26