TECHNOLOGIES
FORUMS
JOBS
BOOKS
EVENTS
INTERVIEWS
Live
MORE
LEARN
Training
CAREER
MEMBERS
VIDEOS
NEWS
BLOGS
Sign Up
Login
No unread comment.
View All Comments
No unread message.
View All Messages
No unread notification.
View All Notifications
Answers
Post
An Article
A Blog
A News
A Video
An EBook
An Interview Question
Ask Question
Forums
Monthly Leaders
Forum guidelines
Mark Tabor
586
2k
464.4k
How to add Serial/Index # column at the start of Jquery Datatable
Nov 12 2020 1:16 AM
Kindly checkout my complete view and add the required code I have tried many from Stack overflow but none of them work for me below is my code.
@{
ViewBag.Title =
"Question List"
;
Layout =
"~/Views/Login/Dashboard2.cshtml"
;
}
<hr />
<h2>Questions List</h2>
<hr />
<p>
@Html.ActionLink(
"Create New"
,
"Create"
,
null
,
new
{ @
class
=
"btn btn-primary"
})
</p>
<br /><br />
<table id=
"tblQuetions"
>
<thead>
<tr>
<th>
Question Description
</th>
<th>
Type
</th>
<th>
Status
</th>
<th>
Start Date
</th>
<th>
Created By
</th>
<th>Edit</th>
<th>Delete</th>
</tr>
</thead>
</table>
<link href=
"//cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css"
rel=
"stylesheet"
/>
@*<link rel=
"//cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css"
type=
"text/css"
/>*@
@section scripts
{
<script src=
"//cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"
></script>
<script>
$(document).ready(
function
() {
$(
"#tblQuetions"
).DataTable({
rowReorder:
true
,
"ajax"
: {
"url"
:
"/Questions/GetList"
,
"type"
:
"POST"
,
"processing"
:
true
,
"serverSide"
:
true
,
"datetype"
:
"json"
},
"columns"
: [
// { "data": "Semester_Id", "name": "Semester_Id", "autoWidth": true },
{
"data"
:
"QuestionText"
},
{
"data"
:
"Evaluation_Type"
},
{
"data"
:
"Status"
},
{
"data"
:
"Date_Created"
,
'render'
:
function
(jsonDate) {
var
date =
new
Date(parseInt(jsonDate.substr(6)));
var
month = date.getMonth() + 1;
return
month +
"/"
+ date.getDate() +
"/"
+ date.getFullYear();
} },
{
"data"
:
"Added_By"
},
{
"render"
:
function
(data, type, full, meta) {
return
'<a class="btn btn-info" href="/Questions/Edit/'
+ full.Id +
'">Edit</a>'
; }
},
{
"render"
:
function
(data, type, full, meta) {
return
'<a class="btn btn-danger" href="/Questions/Delete/'
+ full.Id +
'">Delete</a>'
; }
},
]
});
});
function
DeleteData(Id) {
if
(confirm(
"Are you sure you want to delete ...?"
)) {
Delete(Id);
}
else
{
return
false
;
}
}
function
Delete(Id) {
var
url =
'@Url.Content("~/")'
+
"Demo/DeleteCustomer"
;
$.post(url, { ID: Id },
function
(data) {
if
(data ==
"Deleted"
) {
alert(
"Delete Customer !"
);
oTable = $(
'#tblQuetions'
).DataTable();
oTable.draw();
}
else
{
alert(
"Something Went Wrong!"
);
}
});
}
</script>
}
@Scripts.Render(
"~/bundles/jquery"
)
<script type=
"text/javascript"
src=
"//tinymce.cachefly.net/4.0/tinymce.min.js"
></script>
<script type=
"text/javascript"
>
tinymce.init({ selector:
'textarea'
, width: 500 });
</script>
Reply
Answers (
7
)
Get List consume time
Date Formatting in Text Box Content