How do I post form by clicking a checkbox without refreshing the page?
Question
I'm making a home automation system with raspberry pi and raspbian. I'm gonna design a web page that contains some checkboxes to control the lights via relays. I need a web code that contains a checkbox. When I click that checkbox, php will execute a python code file which controls the relays. I heard posting forms without refreshing the page can be done by ajax and javascript. But I'm not familiar with those languages. Could you guys, please show me a simple checkbox example which is when I check it, it will make php exec() some file and uncheck it, it will make php exec() another file.
Here is the example:
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<title>Raspberry Pi</title>
</head>
<body>
<input type="checkbox" class="iclass" />
<script>
$("input.iclass").click(function (e) {
e.preventDefault();
$.post("post.php", {param1: value, param2: value});
});
</script>
</body>
</html>
And the post.php just gives and alert('Succesful!'); for now. But somehow it's not working.
1 answers
solution1
0 2015-05-30 22:21:14
Make sure you use jQuery library. You can use something like this:
$("input.checkbox-class").click(function (e) {
e.preventDefault();
$.post("/path/to/php/script.php", {param1: value, param2: value});
});
And the source of /path/to/php/script.php will have:
<?php
exec("system");
?>
A sample code with full HTML would be:
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<title>Raspberry Pi</title>
</head>
<body>
<input type="checkbox" />
<script>
$(document).ready(function (e) {
e.preventDefault();
$.post("/path/to/php/script.php", {param1: value, param2: value});
});
</script>
</body>
</html>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.