运行 SQL 的 AJAX 请求后不需要的页面刷新答案

【问题标题】：Unwanted page refresh after AJAX request that runs SQL运行 SQL 的 AJAX 请求后不需要的页面刷新
【发布时间】：2014-03-07 00:21:45
【问题描述】：

点击一个按钮，我想从我的数据库中删除一些东西。

以下是我的点击处理程序。

$('.deleteLesson').click(function () {
    $.get('/Assignment/Modules/DeleteLesson.cshtml?LessonID=' + lessonID,function(data){
    });
});

在 DeleteLesson.cshtml 中，我有以下内容

var db = Database.Open("database");
db.Query("DELETE FROM Lessons WHERE LessonID=@0", Request.QueryString["LessonID"]);

$.get 运行时，会在我的数据库上执行 SQL，但它会强制刷新我的原始页面。我不知道为什么。通过故障排除，我发现导致刷新的纯粹是db.Query 行，没有别的。

明确一点：我可以注释掉 db.Query 行，它完全按照我的意愿工作（除了它不会删除该项目）

【问题讨论】：

return false;$.get(); 通话后
@zerkms 不走运，抱歉。我认为这一定意味着不是 javascript 迫使我刷新？
向我们展示 HTML 结构。结构可能有问题。这个.deleteLesson 可能属于一个表单？
我认为你使用 mvc 框架。为 $.get 提供 Action 和控制器。请告诉你使用的是哪个版本的 mvc
在视图中进行数据库操作是一种非常糟糕的做法。您没有控制器、业务或数据访问层吗？

标签： c# jquery sql-server ajax razor

【解决方案1】：

我不知道该笑还是该哭...原来我的live.js 是在看到更改并想为我更新页面时强制刷新。（正如预期的那样，我只是没想到它会在这种情况下这样做）。

感谢大家的帮助...

【讨论】：

笑声和哭声都很合适:)

【解决方案2】：

评论有点长 - 但它在不运行查询时有效的事实很有趣。如果您从文档page 尝试以下操作会发生什么：

请求页面并忽略结果-（最简单的调用）：

$('.deleteLesson').click(function () {
    $.get('/Assignment/Modules/DeleteLesson.cshtml?LessonID=' + lessonID);
});

提醒每个可能的结果 - 查看调用的处理程序是否有意义或是否被调用：

var url = '/Assignment/Modules/DeleteLesson.cshtml?LessonID=' + lessonID;
var jqxhr = $.get(url, function() {
  alert( "success" );
})
  .done(function() {
    alert( "second success" );
  })
  .fail(function() {
    alert( "error" );
  })
  .always(function() {
    alert( "finished" );
  });

作为一个帖子来做这个怎么样：

$.ajax({
type: "POST",
url: "/Assignment/Modules/DeleteLesson.cshtml",
data: { LessonID: lessonID }
})
 .done(function() {
    alert( "Record Deleted" );
});

最后，您是否尝试过使用 $.ajax 而不是 $.get 简写来调用？这使您可以访问其他 options。

【讨论】：

【解决方案3】：

试试

$('.deleteLesson').click(function (e) {
  e.preventDefault();
  $.get('/Assignment/Modules/DeleteLesson.cshtml?LessonID=' + lessonID,function(data){
     //code here
  });
});

【讨论】：

【解决方案4】：

试试这个：

$('.deleteLesson').click(function (el, event) {
    event.preventDefault();
    $.get('/Assignment/Modules/DeleteLesson.cshtml?LessonID=' + lessonID,function(data){
    });
});

还要检查是否将课程 ID 正确传递给 QueryString 集合。 SQL 查询可能因此而失败。

【讨论】：

很抱歉，如果它的按钮或超链接停止要执行的默认操作，我们需要 preventDefault 。但这已经是一个 div，所以调用 preventDefault( )
我猜它是一个锚点，默认情况下会执行同步 GET
@reach4thelasers 看到 OP 的 cmets，它是一个 div。

【解决方案5】：

在您的控制器中创建一个操作，不要使用对 cshtml 页面的调用。

public class LessonControler{

   [AllowGet]
   public JsonResult DeleteLesson(long LessonID){
      //DoTheDeletion magic here
      return Json(new {Done="OK", Error=""}, JsonRequestBehavior.AllowGet);
  }

}

并更改 javascript 以匹配新的操作调用

$('.deleteLesson').click(function () {
    $.get('/Lesson/DeleteLesson?LessonID=' + lessonID,function(data){
    });
});

或者甚至更好地将其转换为 Post jQuery.post()

【讨论】：