1

I’m working with an ASP.NET MVC project where I've used Entity Framework to generate CRUD actions for a Student controller. The HomeController handles the main view (Index), which displays a paginated list of students inside a div element. In this Index view, I have three buttons for each student: Edit, Details, and Delete.

When clicking any of these buttons, a modal is supposed to display with the corresponding action's form. However, instead of displaying the modal, the page reloads without showing it. The Index view is expected to load these actions in a modal without navigating away from the HomeController. How can I implement this properly, given that the controller I want the view to redirect to is HomeController

Index.cshtml

Buttons upon clicking the modals should be displayed

@foreach (var item in Model.Student)
{

EDIT

Read
Delete
}

```

Edit action method:

public async Task<ActionResult> Edit(int? id)         
{
    if (id == null)             
    {                 
        return new HttpStatusCodeResult(HttpStatusCode.BadRequest);             
    } 

    student student = await db.students.FindAsync(id);    

    if (student == null)             
    {                 
        return HttpNotFound();             
    }             

    return View(student);
}  

[HttpPost]         
[ValidateAntiForgeryToken]         
public async Task<ActionResult> Edit([Bind(Include "studentId,name,surname,birthdate,gender,class,point")] student student)         
{             
    if (ModelState.IsValid)             
    {
        db.Entry(student).State = EntityState.Modified;                 

        await db.SaveChangesAsync();

        return RedirectToAction("Index", "Home");
    }

    return View(student);
}  

Javascript to display model @section Scripts {

<script type="text/javascript">
    function openModal(url) {
        $('#modalContent').load(url, function () {
            $('#crudModal').modal('show');
        });
    }
</script>

}

5
  • Could you provide more code, what is openModal and why are you passing URI to method that is returning a view, if you don't want to redirect? Commented Oct 30, 2024 at 8:36
  • Sure, openModal is function i created in javascripts that is executed when button is clicked. The modal now displays when I change button type = "button" but returns an empty modal Commented Oct 30, 2024 at 9:07
  • I suspect that you want to do redirection on click on those buttons? If that's the case then you should add <a> tag for each action inside modal. Something like this <a href="~/Home/Edit/@Model.ID">@Model.NameOfBtutton</a> change the href path to your needs if you want to do it in for loop. IF not just hardcode the text between open and close a tags. Commented Oct 30, 2024 at 11:01
  • Hey @Ammar was that what you've been looking for? Commented Nov 1, 2024 at 7:47
  • Yes Thanks!!, turns out the only reason it wasn't working was because I never properly referenced the link to the buttons opening the modal Commented Nov 3, 2024 at 18:40

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.