-3

I have a toggle switch on my html which i would like to enable/disable a relay in arduino with.

On: call http://192.168.1.144:8000/1234!Q02=0$ Off: call http://192.168.1.144:8000/1234!Q02=1$

I don't want the url to be opened, i just want it to be called.

function getValue1() {
   var isChecked = document.getElementById("button1").checked;

   if(isChecked){ 
     alert("button1 is checked");
   } else {
     alert("button1 is NOT checked");
   }
}

My javascript code is working, but i dont know how to call the url.

Thanks.

Moataz M. Moussa
  • 9
  • 1
  • 1
    *but i dont know how to call the url.* what do you mean by *call the url*? – gurvinder372 Nov 13 '17 at 08:53
  • 1
    _I don't want the url to be opened, i just want it to be called._ What do you mean ? – Dane Nov 13 '17 at 08:54
  • Possible duplicate of [How to make an AJAX call without jQuery?](https://stackoverflow.com/questions/8567114/how-to-make-an-ajax-call-without-jquery) – Reinstate Monica Cellio Nov 13 '17 at 08:55
  • Well, this url http://192.168.1.144:8000/1234!Q02=1$, will switch the relay on once called, because my arduino is connected to a wifi module to the same network. So I want to call this url when the toggle switch is on, and call it also when toggle switch is off. I don't want to get a response back. Just call the url. – Moataz M. Moussa Nov 13 '17 at 08:57
  • The page I linked will give you code to do exactly that - fire and forget - you don't have to handle a response. – Reinstate Monica Cellio Nov 13 '17 at 09:01
  • [fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API). Like `fetch('http://192.168.1.144:8000/1234!Q02=' + !~~isChecked)` – Werner Nov 13 '17 at 09:23

2 Answers2

1

you can also try this.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<script>
  $(document).ready(function() {
    $("#btnCall").click(function(){

        if($("button1").prop('checked')){ 
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "http://192.168.1.144:8000/1234!Q02=0$",
                data: JSON.stringify(data), //yourData
                success: function (data) {
                    console.log(data);
                },
                dataType: "json"
           });
        } else {
            $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "http://192.168.1.144:8000/1234!Q02=1$",
            data: JSON.stringify(data), //yourData
            success: function (data) {
                console.log(data);
            },
            dataType: "json"
        });
        }
    }); 
});
</script>
A.D.
  • 2,352
  • 2
  • 15
  • 25
  • Do you know how to update a html toggle switch using a result in an array in javascript? So if the array has 1, the toggle switch will be updated to checked, else if 0, the toggle switch will be updated to not checked – – Moataz M. Moussa Nov 13 '17 at 10:23
0

Button: 

$(document).ready(function() {
    $("#btnCall").click(function(){
        var isChecked = document.getElementById("button1").checked;
        if(isChecked){ 
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "http://192.168.1.144:8000/1234!Q02=0$",
                data: JSON.stringify(data), //yourData
                success: function (data) {
                    console.log(data);
                },
                dataType: "json"
           });
        } else {
            $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "http://192.168.1.144:8000/1234!Q02=1$",
            data: JSON.stringify(data), //yourData
            success: function (data) {
                console.log(data);
            },
            dataType: "json"
        });
        }
    }); 
});
Chathura Edirisinghe
  • 367
  • 1
  • 14