Skip to content

Editor template for inline editing list of items. Supports ASP.NET MVC & Core.

License

Notifications You must be signed in to change notification settings

bantikyan/TableList

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

90 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

TableList

Build status

This package gives ASP.Net developers easy way of editing list of items with model binding. This means you can edit elements of your list inline, and all changes will be submited with form. For this purpose Html.TableListFor HTML helper was developed both for ASP.NET Core and ASP.NET MVC.

Usage is very simple. If your Model is a List or you have any List properties in your Model you want to make them editable, you simple need to derive them from TableListItem class and use Html.TableListFor HTML helper on your View. All CRUD operations are supported.

Table of contents

Installation

Library consist of back-end and front-end parts.

Front-end components can be installed one of the following sources:

  • Install with Bower: bower install tablelist-mvc
  • Install with npm: npm install tablelist-mvc
  • Install with Nuget: Install-Package tablelist-mvc
  • Use CDN jsDelivr

Back-end components for ASP.NET Core:

  • Install with Nuget: Install-Package TableList.Mvc.Core

Back-end components for ASP.NET MVC:

  • Install with Nuget: Install-Package TableList.Mvc

Also you can download the latest release:

Basic Usage

First make sure you have linked css and js files: tablelist-mvc.css and tablelist-mvc.js or minimized versions. We use JQuery so link to jquery file must be before link of tablelist-mvc.js. Also if you have some validation attributes, validation js files needed to be linked.

Your page may look like this:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   
    <link rel="stylesheet" href="tablelist-mvc.css" />
</head>
<body>
    ...

    <script src="jquery.js"></script>
    <script src="jquery.validate.js"></script>
    <script src="jquery.validate.unobtrusive.js"></script>
    <script src="~/js/tablelist-mvc.js"></script>
</body>
</html>

To be continued...

License

TableList released under the MIT license. Feel free to use it in personal and commercial projects.