如何使checkbox调用php代码，然后将结果返回并在文本区域中打印？
如何使checkbox调用php代码，然后将结果返回并在文本区域中打印？
提问于 2018-06-25 07:18:31
我正在开发短信发送者表单。该表单包含三个组件：
消息content.
- checkbox的接收者numbers.
- Textarea的
- Textarea，其中包括订阅者作为接收者。
然后我在想，我需要分三步走：
1-检查复选框是否已选中。
2-读取数据库中的订户号码。
3-将订阅者写入接收方文本区域。
我所做的是创建JavaScript函数，当改变时由复选框调用，然后通过JavaScript函数调用php代码，最后使用php内部的JavaScript将数字附加到文本区。不幸的是，它不起作用。我不得不研究，我发现我必须使用ajax来调用php代码。
我以前没有使用过ajax，我认为它很难，我是一个脚本编程的初学者。此外，我更喜欢使用这种实现方式，而不是在提交表单后读取数据库。
我真的很困惑该怎么做。这是我第一次需要在eachother中使用脚本和php！我需要你的帮助，什么是最简单的实现方式。
欢迎新的想法和方式。
更新：
我决定使用ajax，因为你们大多数人都建议。
这是form.php代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function() {
var checkbox = document.getElementById('subscribers').checked;
//Check if checkbox is checked
if (checkbox === true) {
//Read databank for Results
document.getElementById("to").value = "result should be here.";
$.ajax({
type: 'POST',
url: 'sms/readSubscriber.php',
data: {'variable': dataPhp},
complete: function(r){
var subscriberNumbers = r.responseText;
document.getElementById('to').innerHTML = subscriberNumbers;
}
});
} else {
document.getElementById("to").value = "";
}
});
function doalert() {
//Check if checkbox is checked
var checkboxElem = document.getElementById("subscribers").checked;
if (checkboxElem === true) {
//Read databank for Results
document.getElementById("to").value = "result should be here.";
$.ajax({
type: 'POST',
url: 'sms/readSubscriber.php',
data: {'variable': dataPhp},
complete: function(r){
var subscriberNumbers = r.responseText;
document.getElementById('to').innerHTML = subscriberNumbers;
}
});
} else {
document.getElementById("to").value = "";
}
}
</script>
</head>
<body>
<fieldset style="width:50%;margin:auto" dir=ltr>
<form action="" method="POST">
<table border="0" cellspacing="3" cellpadding="3">
<tr>
<td>Your Balance</td>
<td><input type="text" class="form-control" name="Balance" size="20" disabled="disabled" value="<?php
echo $Credits;
?>"></td>
</tr>
<tr>
<td>Mobile No.</td>
<td><textarea textarea class="form-control" id="to" name="Mobile" cols="30" rows="5"></textarea><br></td>
<td>
<div class="checkbox">
<label><input type="checkbox" value="subscribers" onchange="doalert()" id="subscribers" checked>Subscribers</label>
</div>
</td>
</tr>
<tr>
<td>Message</td>
<td><textarea class="form-control" name="Text" cols="30" rows="5" required></textarea></td>
</tr>
<tr>
<td> </td>
<td><input type="submit" name="Go" value="Send SMS" /></td>
</tr>
</table>
</form>
</fieldset>
</body>
</html>这是readSubscriber.php
<?php
require_once('../db_functions.php');
// Connect to the database
$connection = db_connect();
//if connection fails, stop script execution
if (mysqli_connect_errno()) {
echo "Error: " . $sql . "Connect failed: " . mysqli_connect_error();
} else {
$query = "SELECT * FROM phoneSubscribers";
// Query the database
$result = db_isExist($query);
if ($result) {
$result = db_fetch($query);
echo json_encode($result);
} else {
echo "No result";
}
}
?>回答 1
Stack Overflow用户
发布于 2018-06-25 07:50:57
请使用代码更新您的问题，否则很难提供帮助。为此，您必须使用Ajax & jquery。
确保已经安装了jquery。
var checkbox = document.getElementById('checkboxInput').checked;
//Maybe you want to pass something to the PHP file?
var dataPhp = "";
//Check if checkbox is checked
if (checkbox === true) {
//Read databank for Results
$.ajax({
type: 'POST',
url: 'yourFile.php',
data: {'variable': dataPhp},
complete: function(r){
var subscriberNumbers = r.responseText;
document.getElementById('receivers').innerHTML = subscriberNumbers;
}
});
}要获得发送到php文件的变量，您只需使用
$dataFromScript = $_POST['variable'];在yourFile.php中，您必须获取MySQL数据库所需的值。
如果它是数组，请确保使用JSON对其进行编码。
echo json_encode($resultArray);之后，$resultArray变量将显示在您的
<div id="receivers"></div>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51014715
复制相关文章
相似问题
腾讯云开发者
