原先学习ASP.NET
MVC时,学习与行使,操作过数码呈现,添加,编辑,更新和删除等成效。

成百上千办法是相通的,看本人是怎么着来举办有益,赶快,高效用。

明天Insus.NET写的演练,是一向对绑定在Table的多寡开始展览翻新,删除。

在档次中,创制3个实体,相当于说,对数据库时行通信,对数码进行操作:
jQuery 1

jQuery 2jQuery 3

 public IEnumerable<ToolLocation> GetAllToolLocations()
        {
            sp.ConnectionString = DB.ConnectionString;
            sp.Parameters = null;
            sp.ProcedureName = "usp_ToolLocation_GetAll";
            DataTable dt = sp.ExecuteDataSet().Tables[0];
            return dt.ToList<ToolLocation>();
        }

        public void Update(ToolLocation tl)
        {
            List<Parameter> param = new List<Parameter>() {
                                    new Parameter("@ToolLocation_nbr", SqlDbType.SmallInt, 2, tl.ToolLocation_nbr),
                                    new Parameter("@LocationName",SqlDbType.NVarChar,-1,tl.LocationName),
                                    new Parameter("@Description",SqlDbType.NVarChar,-1,tl.Description),
                                    new Parameter("@IsActive",SqlDbType.Bit,1,tl.IsActive)
            };
            sp.ConnectionString = DB.ConnectionString;
            sp.Parameters = param;
            sp.ProcedureName = "usp_ToolLocation_Update";
            sp.Execute();
        }

        public void Delete(ToolLocation tl)
        {
            List<Parameter> param = new List<Parameter>() {
                                    new Parameter("@ToolLocation_nbr", SqlDbType.SmallInt, 2, tl.ToolLocation_nbr)
            };
            sp.ConnectionString = DB.ConnectionString;
            sp.Parameters = param;
            sp.ProcedureName = "usp_ToolLocation_Delete";
            sp.Execute();
        }

Source Code

 

在档次的控制器中:
jQuery 4

 
开创视图,并绑定数据:
jQuery 5

 

jQuery 6jQuery 7

@using Insus.NET.Models;
@model IEnumerable<ToolLocation>

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Edit</title>
    <link href="~/Content/css/table.css" rel="stylesheet" />
    <script src="~/Scripts/jquery-2.2.1.js"></script>

</head>
<body>
    <div>
        <table>
            <tr>
                <td>ToolLocation_nbr</td>
                <td>LocationName</td>
                <td>Description</td>
                <td>IsActive</td>
                <td></td>
            </tr>
            @foreach (var tl in Model)
            {
                <tr>
                    <td>@tl.ToolLocation_nbr<input id="Hidden1" type="hidden" value="@tl.ToolLocation_nbr" /></td>
                    <td>@Html.TextBox("LocationName", tl.LocationName)</td>
                    <td>@Html.TextBox("Description", tl.Description) </td>
                    <td>@Html.CheckBox("IsActive", tl.IsActive)</td>
                    <td>
                        <input class="Update" type="button" title="Update" value="Update" />
                    </td>
                </tr>
            }
        </table>
    </div>
</body>
</html>

Source Code

 

地方步骤#4的jQuery代码:
jQuery 8

 
运维一下,看看效果:
jQuery 9

地点是对数码举办更新的遵从,上面包车型客车兑现,是对Table内的数码删除。
jQuery 10

jQuery 11jQuery 12

@using Insus.NET.Models;
@model IEnumerable<ToolLocation>

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Delete</title>
    <link href="~/Content/css/table.css" rel="stylesheet" />
    <script src="~/Scripts/jquery-2.2.1.js"></script>

</head>
<body>
    <div>
        <table>
            <tr>
                <td>ToolLocation_nbr</td>
                <td>LocationName</td>
                <td>Description</td>
                <td>IsActive</td>
                <td></td>
            </tr>
            @foreach (var tl in Model)
            {
                <tr>
                    <td>@tl.ToolLocation_nbr<input id="Hidden1" type="hidden" value="@tl.ToolLocation_nbr" /></td>
                    <td>@tl.LocationName</td>
                    <td>@tl.Description</td>
                    <td>@Html.CheckBox("IsActive", tl.IsActive, new { disabled = "disabled" })</td>
                    <td>
                        <input class="Delete" type="button" title="Delete" value="Delete" />
                    </td>
                </tr>
            }
        </table>
    </div>
</body>
</html>

Source Code

 

地点标记#4的jQuery代码,正是删除的主干职能:
jQuery 13

 

jQuery,运维程序,看看删除的功用:
jQuery 14

 

以下内容于2015-07-12 16:0伍分更新
删去成功现在,大家不用重导向,只要求删除那行html即可,来达到:
jQuery 15

 

相关文章

网站地图xml地图