AJAX Actionlink works but my AJAX in jquery doesnt? (ASP.NET MVC 5)

Question

I have an @Ajax.ActionLink that I am using to delete a record form my database. When I click the link, my page asks for a confirmation, deletes the course, and refreshes the div that contains the table of records. I want to use AJAX in jquery instead of using the action link. When I click my delete button, I get my confirmation box, click ok and then nothing happens. I know my jquery function is getting the correct values from the row selected because I had them output to make sure. I can't figure out why the ajax never runs but the action link works fine. Below is my code for both and my controller

Controller:

public PartialViewResult deleteCourses(string stuId, string courseAbNum) { KuPlanEntities db = new KuPlanEntities(); var deleteCourse = (from course in db.COURSE_TAKEN where course.courseAbNum == courseAbNum && course.Id == stuId select course); foreach (var course in deleteCourse) { db.COURSE_TAKEN.Remove(course); db.SaveChanges(); } var stuCourses = (from studCourse in db.COURSE_TAKEN join course in db.COURSEs on studCourse.courseAbNum equals course.courseAbNum where studCourse.Id == stuId select new courseTakenView { Id = studCourse.Id, courseAbNum = studCourse.courseAbNum, status = studCourse.status, grade = studCourse.grade, courseDesc = course.courseDesc, credits = course.credits, rowNum = studCourse.rowNum }); var model = new courseListViewModel { userId = stuId, courseTaken = stuCourses }; return PartialView("~/Views/ManageStudentCourses/listCourseRefresh.cshtml",model); }

Action link:

@Ajax.ActionLink("Delete", "deleteCourses", new { stuId = Model.userId, courseAbNum = @course.courseAbNum }, new AjaxOptions { UpdateTargetId = "refreshList", Confirm = ("Are you sure you want to delete this course?") })

jquery:

$(document).ready(function () { $('.deleteCourseBtn').click(function () { if(confirm("Are you sure you want to delete this course?")) { var courseAbNum = $(this).attr('data-id'); var stuId = $('#userId').val(); $.ajax({ type: 'POST', url: '/ManageStudentCourses/deleteCourses', data: { stuId:stuId, courseAbNum:courseAbNum }, dataType: 'html' .success(function (result) { $('#refreshList').html(result); }) }); } else { return false; } })

});

Did you check your browser console for errors or to see that whether the request looks like it should? — Jason P
– Jason P, Commented Oct 29, 2014 at 20:12
it says Uncaught TypeError: undefined is not a function. The ".success(function (result) { "line is highlighted — Stc5097
– Stc5097, Commented Oct 29, 2014 at 20:17

Jason P · Accepted Answer · 2014-10-29 20:19:35Z

1

Your syntax is off. You're trying to call 'html'.success(...). I would do this:

 $.ajax({ type: 'POST', url: '/ManageStudentCourses/deleteCourses', data: { stuId:stuId, courseAbNum:courseAbNum }, dataType: 'html' }).done(function (result) { $('#refreshList').html(result); });

answered Oct 29, 2014 at 20:19

Jason P

27k3 gold badges34 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Sebastien Over a year ago

or }).success(function(data){//do stuff});

Jason P Over a year ago

@Sebastien jqXHR.success() is deprecated as of jQuery 1.8. api.jquery.com/jQuery.ajax/#jqXHR

Sebastien Over a year ago

your right .success() is deprecated, is .ajax({success:function(data){//do stuff}}) also deprecated or are those two completly differente I looked at your link and it didn't clearly state if the two were deprecated

Collectives™ on Stack Overflow

AJAX Actionlink works but my AJAX in jquery doesnt? (ASP.NET MVC 5)

1 Answer 1

3 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Related