php - 如何使用 Span 获取值并将其插入数据库?
问题描述
我正在尝试获取跨度的值,在选择一个项目后,总价格将变为跨度,我无法做到正确。我正在尝试使用 ajax,但我对它真的很陌生,我正在努力让它正确。当我尝试运行 e 时,它会显示未定义索引:总价格。如何正确获取 totalprice 的值?
尝试.php
<thead>
<tr>
<th>Component</th>
<th>Item Name</th>
<th>Price </th>
</tr>
</thead>
<tbody>
<tr>
<td>CPU</td>
<td>
<?php
//Retrieving CPU table
$query = $conn->query("SELECT * FROM cpu");
echo '<select name="cpu" class="cpu" onChange = $("#cpuprice").val($(this).find("option:selected").attr("cpuprice"))>';
echo '<option></option>';
while ($obj = mysqli_fetch_assoc($query)) {
echo '<option cpuprice = ' . $obj['price'] . ' value=' . $obj['cpuname'] . ' >' . $obj['cpuname'] . '</option> /n';
}
echo '</select>';
?>
</td>
<td>
<output id="cpuprice" disabled value="">
</td>
</tr>
</tbody>
<tbody>
<tr>
<td>GPU</td>
<td>
<?php
//Retrieving GPU table
$query = $conn->query("SELECT * FROM gpu");
echo '<select name="gpu" class ="gpu" onChange = $("#gpuprice").val($(this).find("option:selected").attr("gpuprice"))>';
echo '<option></option>';
while ($obj = mysqli_fetch_assoc($query)) {
echo '<option gpuprice = "' . $obj['price'] . '" value = "' . $obj['gpuname'] . '">' . $obj['gpuname'] . '</option>';
}
echo '</select>';
?>
</td>
<td>
<output id="gpuprice" disabled value="">
</td>
</tr>
</tbody>
<tbody>
<tr>
<td>CPU COOLER</td>
<td>
<?php
//Retrieving CPU Cooler table
$query = $conn->query("SELECT * FROM cpucooler");
echo '<select name = cpuc class = cpuc onChange = $("#cpucprice").val($(this).find("option:selected").attr("cpucprice"))>';
echo '<option></option>';
while ($obj = mysqli_fetch_assoc($query)) {
echo '<option cpucprice = "' . $obj['price'] . '" value = "' . $obj['cpucname'] . '" >' . $obj['cpucname'] . '</option>';
}
echo '</select>';
?>
</td>
<td>
<output id="cpucprice" disabled value="">
</td>
</tr>
</tbody>
<tbody>
<tr>
<td>
</td>
<td>
</td>
<td>
<span class="totalprice" name="total" Value="">
<script>
$('select').change(function() {
//get value from cpu slect box check if attr there else take value 0
var cpu_price = $(".cpu").find('option:selected').attr('cpuprice') ? $(".cpu").find('option:selected').attr('cpuprice') : 0
$('#cpuprice').val(cpu_price)
//get value from gpu slect box check if attr there else take value 0
var gpu_price = $(".gpu").find('option:selected').attr('gpuprice') ? $(".gpu").find('option:selected').attr('gpuprice') : 0
$('#gpuprice').val(gpu_price)
//get value from cpucooler slect box check if attr there else take value 0
var cpuc_price = $(".cpuc").find('option:selected').attr('cpucprice') ? $(".cpuc").find('option:selected').attr('cpucprice') : 0
$('#cpucprice').val(cpuc_price)
var total = parseInt(cpu_price) + parseInt(gpu_price) + parseInt(cpuc_price);
$('.totalprice').text('₱' + total);
})
</script>
</td>
</tr>
</tbody>
<script>
$("#total").on("submit", function(event) {
event.preventDefault();
$.ajax({
type: "GET",
url: "trying.php",
data: {
'totalprice': totalprice
},
dataType: "json",
success: function(data) {
},
});
});
</script>
</table>
<input class="submit" type="submit" />
</form>
尝试.php
<?php
if (isset($_GET['cpu']) !== '' && isset($_GET['gpu']) !== '' && isset($_GET['gpuc']) !== '' && isset($_GET['total']) !== '' && isset($_GET['totalprice']) !== '') {
$cpu = $_GET['cpu'];
$gpu = $_GET['gpu'];
$cpuc = $_GET['cpuc'];
$total = ($_GET['totalprice']);
$conn = mysqli_connect("localhost", "root", "", "userregistration");
// Check connection
if (mysqli_connect_errno()) {
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$qstr = $conn->prepare("INSERT INTO trycombuild (cpuname,gpuname,cpucname,total) VALUES (?,?,?,?)");
$qstr->bind_param("ssss", $cpu, $gpu, $cpuc, $total);
$qstr->execute();
$qstr->close();
echo 'succesfull';
} else {
echo 'error';
}
解决方案
<span class="totalprice" name="total"></span>
从 span 中删除 value 标记并更改此 javascript 行
$('.totalprice').text('₱' + total);
至
$('.totalprice').html('₱' + total);
并像这样更改 ajax 调用:
<script>
$("#total").on("submit", function(event) {
event.preventDefault();
$.ajax({
type: "GET",
url: "trying.php",
data: {
'totalprice': $('.totalprice').html()
},
dataType: "json",
success: function(data) {
},
});
});
</script>
推荐阅读
- spring - 我从 Maven 收到一条错误消息,说“有测试失败”,但我没有写任何测试失败
- jquery - 在jQuery中的另一个值之后获取数组值
- arrays - Swift - 将对象数组保存到核心数据,检索时只取回一个对象
- php - iCalendar 脚本在 Outlook 中呈现为 html
- nginx - 如何在远程服务器中设置 nginx 反向代理
- c# - 在 NetCore 控制台和 winform 中使用 SignalR 的正确方法是什么?
- javascript - Reactjs 映射函数映射的元素比数组中的元素多
- node.js - Microsoft Graph API 邮件被发送但在垃圾邮件中
- python - 当通过 anaconda 提示符执行 python 代码时导入 numpy 有效,但在通过 cmd 运行时产生错误
- sql - BigQuery - 没有匹配的操作符签名 = 参数类型:INT64、STRING