我有一个页面，用户可以通过ajax创建主题。在创建主题之前，我检查它是否已存在于数据库中。如果数据库中存在该主题，那么我想在继续提交新主题之前通过div框显示错误消息。一切正常。但是，我无法弄清楚只有在数据库中已经存在主题时才会出现错误消息。
以下是包含我的表单和ajax代码的页面：
<script>
function cancelTopicCreation() {
$(".create-topic-cancel-button, .close_blue_modal").click(function () {
$('#id-create-topic-picture-preview').attr('src','<?php echo BASE_URL; ?>content/pictures/layout/default_group_icon.png');
});
}
function close_blue_modal() {
$('#blue_modal_mask').fadeOut(144);
$('.blue_modal_window').fadeOut(144);
$('.blue_modal_window_two').fadeOut(144);
$('.blue_modal_window_three').fadeOut(144);
$('.blue_modal_window_five').fadeOut(144);
}
function createTopic() {
/*----------------submit title of new topic----------------*/
$(document).ready(function() {
var topicTitle = $(".create-topic-input-box").val();/* get the value of the topic title input and put it in a variable */
var dataString = 'topicTitle='+ topicTitle;/* returns successful data submission message when the entered information is stored in database. */
if(topicTitle == '') {/* if there is no title entered then */
alert("Please Fill All Fields");
} else {
$.ajax({
type: "POST",
url: site_url+'resources/create-topic.php',
data: dataString,
cache: false,
success: function(result) {/* if the ajax submit is successful then */
$('#createTopicForm').each(function() {
this.reset();
});
close_blue_modal();
$('#id-create-topic-picture-preview').attr('src','<?php echo BASE_URL; ?>content/pictures/layout/default_group_icon.png');
$("#results").html(''); //append data into #results element
load_contents(track_page); //initial content load
}
});
}
return false;
});
/*----------------upload topic picture----------------*/
$(document).ready(function() {
var input = document.getElementById("id-create-topic-picture-input");
file = input.files[0];
if (file != undefined){
formData= new FormData();
if(!!file.type.match(/image.*/)){
formData.append("nameTopicPicture", file);
$.ajax({
url: site_url+'resources/upload-topic-icon.php',
type: "POST",
data: formData,
processData: false,
contentType: false,
success: function(data) {/* you can do something if the picture upload is successful here */}
});
} else {
alert('Not a valid image!');
}
} else{/* if there is no image selected then */}
});
}
</script>
<div id="blue_modal_mask" class="close_blue_modal"></div><!--#blue_modal_mask .close_blue_modal-->
<div id="blue_modal_four" class="blue_modal_window_two">
<div onclick="return cancelTopicCreation();" class="close_blue_modal icon-x-mark"></div><!--.close_white_modal-->
<div class="create-topic-label">Create topic</div><!--.create-topic-label-->
<div class="create-topic-error-message">That topic already exists. Please choose a different topic name.</div><!--.create-topic-label-->
<div class="create-topic-description"><div class="icon-book create-topic-description-icon"></div>Topics are used to organize content on the website.</div><!--.create-topic-label-->
<form id="createTopicForm" action="<?php echo BASE_URL?>resources/upload_topic_icon.php" method="post" enctype="multipart/form-data">
<div class="create-topic-input-wrap">
<label for='id-create-topic-input-box'><div class='create-topic-name-label'>Topic name</div></label>
<input class="create-topic-input-box" id="id-create-topic-input-box" type="text" name="topicTitle" placeholder="Enter a topic name" autocomplete="off"><!--input.index_sign_up_input-->
<div class="create-topic-autocomplete-result-box">
<div class="create-topic-autocomplete-result-list nice-scroll">
<div class="create-topic-autocomplete-result-item">
<img class="create-topic-autocomplete-result-item-picture" src="content/pictures/layout/default_group_icon.png" alt="">
<div class="create-topic-autocomplete-result-item-content">
<div class="create-topic-autocomplete-result-item-title">The title of the result goes here</div>
<div class="create-topic-autocomplete-result-item-details">The details of the result goes here</div>
</div><!--create-topic-autocomplete-result-item-content-->
</div><!--create-topic-autocomplete-result-item-->
<div class="create-topic-autocomplete-result-item">
<img class="create-topic-autocomplete-result-item-picture" src="content/pictures/layout/default_group_icon.png" alt="">
<div class="create-topic-autocomplete-result-item-content">
<div class="create-topic-autocomplete-result-item-title">The name of the result goes here</div>
<div class="create-topic-autocomplete-result-item-details">The details of the result goes here</div>
</div><!--create-topic-autocomplete-result-item-content-->
</div><!--create-topic-autocomplete-result-item-->
<div class="create-topic-autocomplete-result-item">
<img class="create-topic-autocomplete-result-item-picture" src="content/pictures/layout/default_group_icon.png" alt="">
<div class="create-topic-autocomplete-result-item-content">
<div class="create-topic-autocomplete-result-item-title">The name of the result goes here</div>
<div class="create-topic-autocomplete-result-item-details">The details of the result goes here</div>
</div><!--create-topic-autocomplete-result-item-content-->
</div><!--create-topic-autocomplete-result-item-->
<div class="create-topic-autocomplete-result-item-empty">Nothing found</div>
</div><!--create-topic-autocomplete-result-list-->
</div><!--create-topic-autocomplete-result-box-->
</div>
<div class="create-topic-picture-preview-wrap">
<img id="id-create-topic-picture-preview" src="<?php echo BASE_URL; ?>content/pictures/layout/default_group_icon.png" class="create-topic-picture-preview">
</div>
<div id="create-topic-footer">
<label for="id-create-topic-picture-input" >
<div class="icon-camera create-topic-camera-icon"></div>
</label>
<input name="nameTopicPicture" accept="image/*" type="file" class="create-topic-picture-input" id="id-create-topic-picture-input">
<a onclick="return createTopic();" class="create-topic-button">Create</a>
<a onclick="return cancelTopicCreation();" class="create-topic-cancel-button cancel_blue_modal">Cancel</a>
</div><!--#new_post_options-->
</form>
</div><!--.blue_modal_one .blue_modal_window-->
这是我的php页面，由ajax引用：
session_start();/* start new or resume existing session */
require_once('Wall.php');
$Wall = new Wall;/* create a new object for the class */
$languageFile = $Wall->getTheLanguageFileForFilesInTheResourcesFolder();/* get the language file and put it in a variable */
include_once ($languageFile);
$idOfLoggedInUser = isset($_SESSION['mem_id']) ? intval($_SESSION['mem_id']) : "";/* get the id of the logged in user and put it in a variable */
$topicTitle = $_POST['topicTitle'];/* get the entered topic title and put it in a variable */
$query = mysqli_query($databaseConnection, "SELECT columnTopicTitle FROM tableTopics WHERE columnTopicTitle='".$topicTitle."'");
if (mysqli_num_rows($query) != 0) {
echo "Username already exists";
} else {
$idOfLastTopicCreated = $Wall->createTopic($idOfLoggedInUser, $topicTitle);/* get the language file and put it in a variable */
$_SESSION['idOfLastTopicCreated'] = $idOfLastTopicCreated;
}
$advert = array(
'ajax' => 'Hello world!',
'advert' => $row['adverts'],
);
echo json_encode($advert);
?>
如何告诉javascript该名称的主题已存在。如果主题已存在于数据库中，那么我希望ajax停止并显示错误弹出div。请帮忙。我试图使用json传递一个字符串，表明该主题已存在于数据库中。但没有成功。我已经尝试将字符串从php传递给查询，但问题是字符串在多次尝试时都没有变化。所以每次都会显示错误。
答案 0 :(得分：2)
您可以让您的PHP发送脚本而不是简单的字符串......
这样的事情也可行：
$query = mysqli_query($databaseConnection, "SELECT columnTopicTitle FROM tableTopics WHERE columnTopicTitle='".$topicTitle."'");
if (mysqli_num_rows($query) != 0) {
//echo "Username already exists";
?>
<script>
alert("Username already exists");
</script>
<?php
} else { ....
所以你可以在你的主页面中有一个隐藏的div，用CSS设置样式...只是以一种比警报更可行的方式显示任何消息：
$query = mysqli_query($databaseConnection, "SELECT columnTopicTitle FROM tableTopics WHERE columnTopicTitle='".$topicTitle."'");
if (mysqli_num_rows($query) != 0) {
//echo "Username already exists";
?>
<script>
$("#myHiddenDiv").html("Username already exists").fadeIn(600);
</script>
<?php
} else { ....
在您的Ajax success回调中：
success: function(result) {
// Rest of your code...
// Add this for the script to be sent.
$("#someEmptyDiv").html(result);
------的修改
好的......你必须得到可能的结果：
1-关于用户名的错误消息已存在
2- A JSON
这里有很多创意方式，具体取决于你想做什么：
$query = mysqli_query($databaseConnection, "SELECT columnTopicTitle FROM tableTopics WHERE columnTopicTitle='".$topicTitle."'");
if (mysqli_num_rows($query) != 0) {
//echo "Username already exists";
?>
<script>
$("#myHiddenDiv").html("Username already exists").fadeIn(600);
</script>
<?php
} else {
$advert = array( // I assume this works.
'ajax' => 'Hello world!',
'advert' => $row['adverts'],
);
?>
<script>
close_blue_modal();
$("#myHiddenDiv").html("Username created").fadeIn(600);
console.log( " <?php echo json_encode($advert); ?> " );
</script>
<?php
//echo json_encode($advert);
}
然后Ajax success将是：
success: function(result) {
$("#someEmptyDiv").html(result);
}