我对javascript等一无所知,并且我试图创建一些选项卡,当单击选项卡按钮时,这些选项卡将从mysql加载动态数据行的列表。我已经设置好了,因此每次点击都会加载新的数据。无论如何,经过大量阅读后,我终于能够正常工作,直到我尝试向每行添加一个按钮以删除行并删除mysql中的记录。
问题是我可以直观地删除行,但是当表单尝试调用php脚本删除记录时出现此错误:
npm install -g ionic@latest
我正在使用ajax调用一个php脚本,该脚本查询数据库并构建行,并添加要加载到选项卡中的表单/按钮等。基本上就是这样。
Form submission canceled because the form is not connected
这是一些基本的html,用于加载get_data.php中的内容。
<?php
//get_data.php
if (isset($_POST['button'])){
$postval = $_POST['button'];
if ($postval == 'def_tab'){
//I run the mysql query here.
$cnt = 0;
// mysql array
foreach($row as $item){
//I build the elements etc here as well as data for the list
echo '<li class="list-items">
//Using this form as a removal button
<form name="rem" action="remove.php" method="post" data-target="rem' . $cnt . '" id="forms">
<input name="name" type="hidden" value="'.$item['value'].'">
<input type="submit" class="remove" value=""></form>';
</li>
$cnt++
}
}
这是我正在使用的jquery代码。
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div class="tab">
<button class="tabs" onclick="openTab(event, 'tab1')" id="def_tab">Tab 1</button>
<button class="tabs" onclick="openTab(event, 'tab2')" id="tab2">Tab 2</button>
</div>
<div id="tab1" class="tabcontent">
<ul class="container"></ul></div>
</body>
我认为问题是由动态加载ajax调用中的表单引起的,我不确定该怎么办。我一直在阅读有关通过使用诸如<script>
// This removes the row properly but gives the form submission error
$('body').on('click', 'form[data-target]', function(event){
$(this).closest('.list-items').remove();
});
</script>
<script>
//Loads the default tab on page load,
//calls the php script and adds the rows
//from the ajax response to the container ul class.
$(document).ready(function() {
updatePage("def_tab");
$("#def_tab, #tab2").click(function(e) {
e.preventDefault();
var btnVal = this.id;
updatePage(btnVal);
});
});
function updatePage(btnVal){
$.ajax({
type:'post',
url:"get_data.php",
type: "POST",
data: {'button': btnVal},
cache: false,
async: true,
success:function(data){
$('.container').html("");
$(".container").append(data);
}});
}
</script>
<script>
//Some code for the tabs
function openTab(evt, tabName) {
var i, tabcontent, tabs;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
tabs = document.getElementsByClassName("tabs");
for (i = 0; i < tabs.length; i++) {
tabs[i].className = tabs[i].className.replace(" active", "");
}
document.getElementById(tabName).style.display = "block";
evt.currentTarget.className += " active";
}
</script>
之类的代码将表单附加到正文的信息,但我一直无法弄清楚是否可行。
我不希望它长一英里,所以我尝试发布最相关的部分,以便希望有人能理解我正在尝试做的事情以及如何修复它。我只希望能够从视觉上删除行,以及运行一个简单的删除脚本以从数据库中删除行。谢谢
答案 0 :(得分:0)
我注意到您键入了两次键入:“ post”,第一次键入小写,第二次键入大写:“ POST”。