我有一张表格,列出了用户输入的值,侧面有2个按钮,用于删除或标记为完成。在该页面上该表是可见的,有3个标签,我们将它们称为Tab1,Tab2和Tab3
每个选项卡都有一个表(如上所述),其中包含有关特定条目类型的信息。
这些按钮是简单的<a href>
链接,因此在单击时会重新加载页面。这是一个问题,因为刷新了用户视图,并且将选项卡带回到默认选项卡,并且在尝试标记多个条目时也带来了不便。
我想使这些按钮将Ajax请求发送到另一个页面来处理数据。唯一的问题是,我不太确定如何进行ajax调用。
这就是我现在所拥有的
我的按钮
echo "<td class='td-actions'>";
echo " <a href='?complete=".$row['uniqueID']."' class='btn btn-success btn-small'>
<i class='btn-fa fa-only fa fa-check'> </i>
</a>
<a href='?remove=".$row['uniqueID']."' class='btn btn-danger btn-small'>
<i class='btn-fa fa-only fa fa-remove'> </i>
</a>";
echo "</td>";
有一种叫做“完成”,另一种叫做“删除”。
当按下其中任何一个时,它当前会重新加载页面,这会触发一些php if语句。
if(isSet($_GET['remove'])) {
$sql = "DELETE from rl_logged where uniqueID='".$_GET['remove']."';";
$ret = $db->exec($sql);
echo "<meta http-equiv='refresh' content='0;index.php' />";
}
if(isSet($_GET['complete'])) {
$sql = "UPDATE rl_logged set complete=1 where uniqueID='".$_GET['complete']."';";
$ret = $db->exec($sql);
echo "<meta http-equiv='refresh' content='0;index.php' />";
}
这些是相对简单的功能。我的问题是我不太了解JavaScript。
任何帮助将非常感激。
我想出的JavaScript是这个
$(document).ready(function() {
$('#markComplete').click(function() {
var input = input = $(this).text()
$.ajax({ // create an AJAX call...
data: {
onionID: input,
},
type: 'POST', // GET or POST from the form
url: 'pages/ajax/markCompleteRL.php', // the file to call from the form
success: function(response) { // on success..
refreshAllTabsWithFade();
}
});
});
});
使用此按钮
<div name='markComplete' id='markComplete' class='btn btn-success btn-small'>
<i class='btn-fa fa-only fa fa-check'></i>".$row['uniqueID']."
</div>
但是,在使用Firebug进行检查时,这似乎可以正常工作,但是现在该按钮什么也没做。
今天早上我再次尝试,按下按钮,并且它第一次发送此信息,然后该按钮不再执行此操作-即使在页面重新加载时也是如此。
我能够使其与以下产品一起使用:
javascript:
$('.markComplete').submit( function( event ) {
event.preventDefault();
event.stopImmediatePropagation();
$.ajax({ // create an AJAX call...
data: $(this).serialize(), // serialize the form
type: "POST", // GET or POST from the form
url: "pages/ajax/repairlogMarks.php", // the file to call from the form
success: function(response) { // on success..
refreshAllTabs();
}
});
return false;
});
按钮:
<form class="markComplete">
<input type="text" style="display:none;" class="form-control" name="uniqueid" value='<?=$row['uniqueID'];?>'>
<input type="text" style="display:none;" class="form-control" name="markcomp" value='1'>
<button type="submit" class="btn btn-success">
<i class="btn-fa fa-only fa fa-check"></i>
</button>
</form>
基本上,我将按钮制成了一种表单,该表单我知道如何为其创建ajax请求。
-更新以使其适用于对不同的唯一ID具有相同功能的多个按钮。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句