<!doctype html>
<html class="no-js" lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="apple-touch-icon" href="apple-touch-icon.png">
<!-- Place favicon.ico in the root directory -->
</head>
<body>
<!--[if lt IE 8]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<!-- Add your site or application content here -->
<h1>Wireless LED Control</h1>
<h4>You can control the status of the LED!</h4>
<h3>RED LED Status: {{ value }}</h3>
<h4>
Yellow LED Control:
<button type='button' id='led_onY'>LED ON</button>
<button type='button' id='led_offY'>LED OFF</button>
</h4>
<h4>
Red LED Control:
<button type='button' id='led_onR'>LED ON </button>
<button type='button' id='led_offR'>LED OFF</button>
</h4>
<h3>
Curtain Control:
<button type='button' id='curtain_open'>OPEN CURTAIN</button>
<button type='button' id='curtain_close'>CLOSE CURTAIN</button>
</h3>
<script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.12.0.min.js"><\/script>')</script>
<script>
$(document).ready(function(){
$('#led_onY').click(function(){
console.log("LED ON!");
$.post('/led/Y/1');
});
$('#led_offY').click(function(){
console.log("LED OFF!");
$.post('/led/Y/0');
});
});
</script>
<script>
$(document).ready(function(){
$('#led_onR').click(function(){
console.log("LED ON!");
$.post('/led/R/1');
});
$('#led_offR').click(function(){
console.log("LED OFF!");
$.post('/led/R/0');
});
});
</script>
<script>
$(document).ready(function(){
$('#curtain_open').click(function(){
console.log("CURTAIN OPENING");
$.post('/curtain/open');
});
('#curtain_close').click(function(){
console.log("CURTAIN CLOSING");
$.post('/curtain/close');
});
});
</script>
</body>
</html>
That is the HTML Code and It basically has 6 buttons, 2 buttons turn a RED LED on and off via the GPIO pins which is all coded in python. Another 2 do the same but with a YELLOW LED and the other 2 buttons are for a recent project to open and close a curtain. This web page is ran from my Raspberry Pi 3.
This code gives me several errors, one is that the curtain close .click function isn't supported. The other is I get this error:
SERVER ERROR - The server encountered an unexpected condition that prevented it from fulfilling the request (XHR)POST.
Thank you! :)