unable to generate onclick event for Edit button

Question

View:

@model MVCCRUD.Models.Employee

@{

ViewBag.Title = "EmployeeList";

}

<h3>Add Employee Details</h3>

@using (Html.BeginForm("AddOrEdit", "Employee", FormMethod.Post,new {onsubmit="return SubmitForm(this)" }))

{

@Html.HiddenFor(model => model.EmployeeID)

<div class="form-group">

@Html.LabelFor(model => model.Fname, new { @class = "control-label" })

@Html.EditorFor(model => model.Fname, new { htmlAttributes = new { @class = "form-control" } })

</div>

<div class="form-group">

@Html.LabelFor(model => model.Lname, new { @class = "control-label" })

@Html.EditorFor(model => model.Lname, new { htmlAttributes = new { @class = "form-control" } })

</div>

<div class="form-group">

@Html.LabelFor(model => model.Email, new { @class = "control-label" })

@Html.EditorFor(model => model.Email, new { htmlAttributes = new { @class = "form-control" } })

</div>

<div class="form-group">

<input type="submit" value="submit" class="btn btn-success" />

<input type="reset" value="Reset" class="btn btn-warning" />

</div>

}

<div>

<table id="employeeTable" class="table table-bordered table-striped">

<thead>

<tr>

<th>Lname</th>

<th>Lname</th>

<th>Email</th>

<th> </th>

</tr>

</thead>

</table>

</div>

<link rel="stylesheet" href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" />

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />

<link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap.min.css" />

@section scripts{

<script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>

<script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap.min.js"></script>

<script>

var dataTable,Popup;

$(document).ready(function () {

dataTable = $("#employeeTable").DataTable({

"ajax": {

"url": "/Employee/GetData",

"type": "POST",

"datatype": "json",

},

"columns": [

{ "data": "Fname" },

{ "data": "Lname" },

{ "data": "Email" },

{

"data": "EmployeeID", "render": function (data) {

return "<a class='btn btn-default btn-sm' onclick=edit("+data+")><i class='fa fa-pencil'></i> Edit</a> <a class='btn btn-danger btn-sm' style='margin-left:5px' onclick=Delete(" + data + ")><i class='fa fa-trash'></i> Delete</a>"

}

} ]

});

});

function SubmitForm(form) {

$.ajax({

type: "POST",

url: form.action,

data: $(form).serialize(),

success: function (data) {

if (data.success) {

$.notify(data.message, {

globalPosition: "top center",

className: "success"

})

dataTable.ajax.reload();

}

}

});

return false;

}

function Delete(id) {

if (confirm('Are you sure??'))

{

$.ajax({

type: "POST",

url: '@Url.Action("Delete","Employee")/' + id,

success: function (data)

{

if (data.success)

{

dataTable.ajax.reload();

$.notify(data.message, {

globalPosition: "top center",

className: "success"

})

}

}

});

}

}

</script>

}

 

 

 

Controller:

 

 

using System;

using System.Collections.Generic;

using System.Data.Entity;

using System.Linq;

using System.Web;

using System.Web.Mvc;

using MVCCRUD.Models;

namespace MVCCRUD.Controllers

{

public class EmployeeController : Controller

{

// GET: Employee

public ActionResult Index()

{

return View();

}

public ActionResult GetData()

{

using (AppdbEntities db = new AppdbEntities())

{

List<Employee> empList = db.Employees.ToList<Employee>();

return Json(new { data = empList }, JsonRequestBehavior.AllowGet);

}

}

[HttpGet]

public ActionResult AddOrEdit(int id=0)

{

if (id == 0)

{

return View(new Employee());

}

else

{

using (AppdbEntities db = new AppdbEntities())

{

return View(db.Employees.Where(x => x.EmployeeID == id).FirstOrDefault<Employee>());

}

}

}

[HttpPost]

public ActionResult AddOrEdit(Employee emp)

{

using (AppdbEntities db = new AppdbEntities())

{

if (emp.EmployeeID == 0)

{

db.Employees.Add(emp);

db.SaveChanges();

return Json(new { success = true, message = "Saved successfully" }, JsonRequestBehavior.AllowGet);

}

else

{

db.Entry(emp).State = EntityState.Modified;

db.SaveChanges();

return Json(new { success = true, message = "Updated successfully" }, JsonRequestBehavior.AllowGet);

}

}

}

[HttpPost]

public ActionResult Delete(int id)

{

using (AppdbEntities db = new AppdbEntities())

{

Employee emp = db.Employees.Where(x => x.EmployeeID == id).FirstOrDefault<Employee>();

db.Employees.Remove(emp);

db.SaveChanges();

return Json(new { success = true, message = "Deleted successfully" }, JsonRequestBehavior.AllowGet);

}

}

}

}