如何将 AJAX 数据从 VIEW 发送到 CONTROLLER? (PHP(MVC)+AJAX)
How to send AJAX data from VIEW to CONTROLLER? (PHP(MVC)+AJAX)
我有 http://visiting/blog
页。
控制器包含 action_index 和 add_index 方法。 Action_index()
return 索引页面。 Add_index()
调用模型的方法 add_data()
,将数据从表单插入数据库。
我需要使用 ajax 请求组织我的应用程序,http://visiting/blog
页面在提交表单后不刷新。
VIEW
$.ajax({
type: 'POST',
url: '???', --------------------------> What should URL contain?
data: $(this).serialize()
控制器
function action_add() {
$title = $this->cleanStr($_POST["title_field"]);
$text = $this->cleanStr($_POST["text_field"]);
if ($title!="" && $text!="") {
$this->model->add_data($title, $text);
} else {
throw new Exception("Data is empty");
}
}
型号
public function add_data($title, $text) {
try {
$query="INSERT INTO post (title, text) VALUES('$title', '$text')";
self::$db->query($query);
} catch(Exception $e) {
echo $e->getMessage();
}
}
VIEW
这是一个带有 ajax 请求的完整 html 文件。
我想处理表单,不刷新页面并将数据发送到数据库。
<div class="blog">
<h1> Blog </h1>
<form onsubmit="return validate()" id="add_form">
<fieldset>
<legend>Add new post:</legend>
<label>Title:</label><br>
<input type="text" name="title_field" id="titlef">
<br>
<label>Text:</label>
<br>
<textarea name="text_field" id="textf"></textarea>
<br>
<input onclick="return validate(); return false" type="submit" value="Submit">
<input onclick="return resetclass()" type="reset" value="Reset">
</fieldset>
</form>
<div class="blogposts">
<div id='response'></div>
<?php
foreach ($data as $values) {
echo "<div class=\"blog_item\">";
echo "<h4 class=\"blog_item_title\">" . $values["title"] . "</h4>" .
"<div class=\"blog_item_text\">" . $values["text"] . "</div>" .
"<div class=\"blog_item_time\">" . $values["time"] . "</div>";
echo "</div>";
}
?>
</div>
</div>
<script>
$(document).ready(function(){
$('#add_form').submit(function(){
// show that something is loading
$('#response').html("<b style=\"font-size:20px; margin:40px;\"\">Loading ...</b>");
$.ajax({
type: 'POST',
url: '???', ------------> What should be into url?
data: $(this).serialize()
})
.done(function(data){
// show the response
$('#response').html(data);
})
.fail(function() {
// just in case posting your form failed
alert( "Posting failed." );
});
// to prevent refreshing the whole page page
return false;
});
});
</script>
url 应该是您想要点击的控制器方法的路径。您不必在 url 中包含基本路径(但如果您愿意,也可以)。所以像:
url: "howeverYourStructureIs/Action_index",
点击方法 action_index()。你可以把 ajax 想成 "as if you were to hit the page, but not actually navigating to that page" 之类的东西。因此,无论您通常如何使用该方法,都是您在 ajax 调用中输入的 url。
希望这对您有所帮助
我有 http://visiting/blog
页。
控制器包含 action_index 和 add_index 方法。 Action_index()
return 索引页面。 Add_index()
调用模型的方法 add_data()
,将数据从表单插入数据库。
我需要使用 ajax 请求组织我的应用程序,http://visiting/blog
页面在提交表单后不刷新。
VIEW
$.ajax({
type: 'POST',
url: '???', --------------------------> What should URL contain?
data: $(this).serialize()
控制器
function action_add() {
$title = $this->cleanStr($_POST["title_field"]);
$text = $this->cleanStr($_POST["text_field"]);
if ($title!="" && $text!="") {
$this->model->add_data($title, $text);
} else {
throw new Exception("Data is empty");
}
}
型号
public function add_data($title, $text) {
try {
$query="INSERT INTO post (title, text) VALUES('$title', '$text')";
self::$db->query($query);
} catch(Exception $e) {
echo $e->getMessage();
}
}
VIEW
这是一个带有 ajax 请求的完整 html 文件。
我想处理表单,不刷新页面并将数据发送到数据库。
<div class="blog">
<h1> Blog </h1>
<form onsubmit="return validate()" id="add_form">
<fieldset>
<legend>Add new post:</legend>
<label>Title:</label><br>
<input type="text" name="title_field" id="titlef">
<br>
<label>Text:</label>
<br>
<textarea name="text_field" id="textf"></textarea>
<br>
<input onclick="return validate(); return false" type="submit" value="Submit">
<input onclick="return resetclass()" type="reset" value="Reset">
</fieldset>
</form>
<div class="blogposts">
<div id='response'></div>
<?php
foreach ($data as $values) {
echo "<div class=\"blog_item\">";
echo "<h4 class=\"blog_item_title\">" . $values["title"] . "</h4>" .
"<div class=\"blog_item_text\">" . $values["text"] . "</div>" .
"<div class=\"blog_item_time\">" . $values["time"] . "</div>";
echo "</div>";
}
?>
</div>
</div>
<script>
$(document).ready(function(){
$('#add_form').submit(function(){
// show that something is loading
$('#response').html("<b style=\"font-size:20px; margin:40px;\"\">Loading ...</b>");
$.ajax({
type: 'POST',
url: '???', ------------> What should be into url?
data: $(this).serialize()
})
.done(function(data){
// show the response
$('#response').html(data);
})
.fail(function() {
// just in case posting your form failed
alert( "Posting failed." );
});
// to prevent refreshing the whole page page
return false;
});
});
</script>
url 应该是您想要点击的控制器方法的路径。您不必在 url 中包含基本路径(但如果您愿意,也可以)。所以像:
url: "howeverYourStructureIs/Action_index",
点击方法 action_index()。你可以把 ajax 想成 "as if you were to hit the page, but not actually navigating to that page" 之类的东西。因此,无论您通常如何使用该方法,都是您在 ajax 调用中输入的 url。
希望这对您有所帮助