簡體   English   中英

`Gridview` 的第一行總是被刪除,而不是選擇刪除的用戶

[英]First row of the `Gridview` always gets deleted instead of the user selected for deletion

我試圖從我的GridView刪除選定的用戶,但是當我選擇用戶旁邊的刪除按鈕時,它會刪除 Gridview 的第一行而不是所選用戶。

這是我的GridView

<asp:GridView
                            ID="gvUsers"
                            runat="server"
                            AutoGenerateColumns="False"
                            Width="100%"
                            GridLines="None"
                            CssClass="table table-bordered table-hover">
                            <Columns>
                                <asp:TemplateField>
                                    <ItemTemplate>
                                        <asp:HiddenField ID="hdnPagesize" runat="server" />
                                        <img id="imgPreview" class="img-rounded" style="width: 38px; height: 38px; margin-top: -10px; margin-bottom: -12px" alt="" src="" />
                                    </ItemTemplate>
                                    <ItemStyle Width="4%" HorizontalAlign="Center" VerticalAlign="Middle" />
                                </asp:TemplateField>

                                <asp:TemplateField HeaderText="Name" SortExpression="Name">
                                    <ItemTemplate>
                                        <label id="lblFullName" style="font-weight: normal;"></label>
                                    </ItemTemplate>
                                    <ItemStyle CssClass="cssSearch" Width="28%" />
                                </asp:TemplateField>

                                <asp:TemplateField HeaderText="Email">
                                    <ItemTemplate>
                                        <label id="lblEmail" style="font-weight: normal;"></label>
                                    </ItemTemplate>
                                    <ItemStyle CssClass="cssSearch" Width="24%" />
                                </asp:TemplateField>

                                <asp:TemplateField HeaderText="Dob">
                                    <ItemTemplate>
                                        <label id="lblDob" style="font-weight: normal;"></label>
                                    </ItemTemplate>
                                    <ItemStyle Width="12%" />
                                </asp:TemplateField>

                                <asp:TemplateField HeaderText="Status" ItemStyle-Width="7%">
                                    <ItemTemplate>
                                        <asp:HiddenField ID="hdnStatus" runat="server" />
                                        <label id="lblStatus" style="font-size: 13px; font-weight: normal;"></label>
                                    </ItemTemplate>
                                </asp:TemplateField>

                                <asp:TemplateField HeaderText="Role">
                                    <ItemTemplate>
                                        <label id="lblRole" style="font-weight: normal;"></label>
                                    </ItemTemplate>
                                    <ItemStyle Width="8%" />
                                </asp:TemplateField>

                                <asp:TemplateField HeaderText="Account" ItemStyle-Width="7%" ItemStyle-HorizontalAlign="Center">
                                    <ItemTemplate>
                                        <label id="lblAccountStatus" style="font-weight: normal; font-size: large;"></label>
                                    </ItemTemplate>
                                </asp:TemplateField>

                                <asp:TemplateField HeaderText="Action" ItemStyle-Width="8%" ItemStyle-HorizontalAlign="Center">
                                    <ItemTemplate>
                                        <a id="aEditUserDetails" style="cursor: pointer;">
                                            <i class="ti-pencil-alt" style="font-size: large"></i>
                                        </a>
                                        <a id="aDeleteUser" style="cursor: pointer;" data-toggle="modal" data-target="#confirm-delete">
                                            <i class="glyphicon glyphicon-trash text-danger" style="font-size: medium"></i>
                                        </a>

                                        <!-- BEGIN Modal Confirm -->
                                        <div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                                            <div class="modal-dialog modal-sm">
                                                <div class="modal-content">
                                                    <div class="modal-body">
                                                        <h4>Are you sure?</h4>
                                                        <br />
                                                        <a id="aDeleteUserModal" class="btn btn-success" data-dismiss="modal">Yes</a>
                                                        <input type="button" class="btn btn-danger" data-dismiss="modal" value="No" />                                                            
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <!-- END Modal Confirm -->
                                    </ItemTemplate>
                                </asp:TemplateField>
                            </Columns>
                        </asp:GridView>

然后我的代碼如下:

<script type="text/javascript">

        var selectedPageSize = 10   /* Default size is 10. */
        var currentPageIndex = 1    /* Default pageindex is 1. */

        $(function () {
            /* Retrieve list of users when page loads. */
            GetUsers(currentPageIndex, selectedPageSize);
        });

        $(document).on("keyup", "[id*=txtSearch]", function () {
            /* Retrieve list of users when any key is pressed in search box (txtSearch). */
            GetUsers(currentPageIndex, selectedPageSize);
        });

        $(document).on("click", ".Pager .page", function () {
            currentPageIndex = parseInt($(this).attr('page'))
            GetUsers(currentPageIndex, selectedPageSize);
        });

        function changePagesize(obj) {
            selectedPageSize = $("[id*=ddlPageSize]").val();
            GetUsers(currentPageIndex, selectedPageSize);
        }

        function SearchKey() {
            return jQuery.trim($("[id*=txtSearch]").val());
        };
        function GetUsers(pageIndex, pageSize) {
            /* Pass parameters in array, gData.*/
            var gData = [];
            gData[0] = pageIndex;
            gData[1] = pageSize;
            gData[2] = SearchKey();
            var jsonData = JSON.stringify({ gData: gData });

            $.ajax({
                type: "POST",
                url: "users.aspx/GetUsers",
                data: jsonData,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                async: "true",
                success: BindUsersList,
                failure: function (response) {
                },
                error: function (response) {
                    alert(response.d);
                }
            });
        }
        var row;
        function BindUsersList(response) {
            var xmlDoc = $.parseXML(response.d);
            var xml = $(xmlDoc);
            var users = xml.find("dsUsers");
            var html = '<table id="gvUsers">';
            if (row == null) {
                row = $("#<%=gvUsers.ClientID %> tr:last-child").clone(true);
            }
            $("#<%=gvUsers.ClientID %> tr").not($("#<%=gvUsers.ClientID %> tr:first-child")).remove();
            html += $("#<%=gvUsers.ClientID %>").html();
            if (users.length > 0) {
                $.each(users, function () {
                    html += "<tr>";

                    $(row).find("[id*=imgPreview]").attr("src", "../imageHandler.ashx?user_id_pk=" + $(this).find("user_id_pk").text() + "");
                    $(row).find("[id*=lblFullName]").html($(this).find("FullName").text());
                    $(row).find("[id*=lblEmail]").html($(this).find("email").text());
                    $(row).find("[id*=lblDob]").html($(this).find("dob").text());

                    if ($(this).find("user_status").text() == "true") {
                        $(row).find("[id*=lblStatus]").html("Active");
                        $(row).find("[id*=lblStatus]").attr("class", "label label-success label-transparent");
                    }
                    else {
                        $(row).find("[id*=lblStatus]").html("Inactive");
                        $(row).find("[id*=lblStatus]").attr("class", "label label-danger label-transparent");
                    }
                    if ($(this).find("accountStatus").text() == "locked") {
                        $(row).find("[id*=lblAccountStatus]").attr("class", "ti-lock text-danger");
                        $(row).find("[id*=lblAccountStatus]").attr("data-toggle", "tooltip");
                        $(row).find("[id*=lblAccountStatus]").attr("data-placement", "left");
                        $(row).find("[id*=lblAccountStatus]").attr("title", "Account locked due to invalid login attempts.");
                    }
                    else {
                        $(row).find("[id*=lblAccountStatus]").attr("class", "ti-unlock text-success");
                    }

                    $(row).find("[id*=lblRole]").html($(this).find("user_role").text());

                    $(row).find("[id*=aEditUserDetails]").attr("data-user-id", $(this).find("user_id_pk").text());
                    $(row).find("[id*=aEditUserDetails]").attr("title", "Edit User Details");

                    $(row).find("[id*=aDeleteUserModal]").attr("data-user-id", $(this).find("user_id_pk").text());

                    $("#<%=gvUsers.ClientID %>").append(row);
                    row = $("#<%=gvUsers.ClientID %> tr:last-child").clone(true);

                    html += $(row).html();
                    html += "</tr>";
                });
                var pager = xml.find("dtPager");
                $("[id*=divPager]").gvPager({
                    ActiveCssClass: "current",
                    PagerCssClass: "pager",
                    PageIndex: parseInt(pager.find("PageIndex").text()),
                    PageSize: parseInt(pager.find("PageSize").text()),
                    RecordCount: parseInt(pager.find("RecordCount").text())
                });
                $(".cssSearch").each(function () {
                    var searchPattern = new RegExp('(' + SearchKey() + ')', 'ig');
                    $(this).html($(this).text().replace(searchPattern, "<span class = 'highlight'>" + SearchKey() + "</span>"));
                });
            } else {
                var empty_row = row.clone(true);
                $("td:first-child", empty_row).attr("colspan", $("td", row).length);
                $("td:first-child", empty_row).attr("align", "center");
                $("td:first-child", empty_row).html("No Data Available.");
                $("td", empty_row).not($("td:first-child", empty_row)).remove();
                $("#<%=gvUsers.ClientID %>").append(empty_row);
            }
            html += '</table>';
        };

        /* Edit user details. */
        $("[id*=aEditUser]").click(function () {
            $.ajax({
                type: "POST",
                url: "users.aspx/EditUser",
                data: '{userId: ' + $(this).data('user-id') + '}',
                contentType: "application/json; charset=utf-8",
                datatype: "json",
                async: "true",
                success: function (response) {
                    location.href = "newuser.aspx?uid=" + response.d;
                },
                error: function (response) {
                    Notification(response.status + ' ' + response.statusText, 'Error', 'error');
                }
            });
        });

        /* Delete user. */
        $("[id*=aDeleteUserModal]").click(function () {
            //var ans = confirm("Are you sure?");
            //if (ans == true) {

                $.ajax({
                    type: "POST",
                    url: "users.aspx/DeleteUser",
                    data: '{userId: ' + $(this).data('user-id') + '}',
                    contentType: "application/json; charset=utf-8",
                    datatype: "json",
                    async: "true",
                    success: function (response) {
                        if (response.d == 'DeletePermissionDenied') {
                            Notification('This feature is disabled in demo version.', 'Permission Denied', 'error');
                            //Notification('You dont have the permission to delete the data, contact your administrator.', 'Permission Denied', 'error');
                        }
                        else if (response.d == 'Success') {
                            GetUsers(currentPageIndex, selectedPageSize);
                            Notification('User deleted successfully.', 'Success', 'success');
                        }
                    },
                    error: function (response) {
                        Notification(response.status + ' ' + response.statusText, 'Error', 'error');
                    }
                });
            //}
        });
    </script>

以及背后的代碼:

private void BindUsersRow()
{
    DataTable dtUsers = new DataTable();
    dtUsers.Columns.Add("user_id_pk");
    dtUsers.Columns.Add("FullName");
    dtUsers.Columns.Add("email");
    dtUsers.Columns.Add("dob");
    dtUsers.Columns.Add("accountStatus");
    dtUsers.Columns.Add("user_role");
    dtUsers.Columns.Add("user_status");        
    dtUsers.Rows.Add();
    gvUsers.DataSource = dtUsers;
    gvUsers.DataBind();
    //gvUsers.UseAccessibleHeader = true;
    //gvUsers.HeaderRow.TableSection = TableRowSection.TableHeader;
}

[WebMethod]
public static string GetUsers(List<string> gData)
{
    string query = "sp_um_getUsersList";
    SqlCommand cmd = new SqlCommand(query);
    cmd.CommandType = CommandType.StoredProcedure;
    cmd.Parameters.AddWithValue("@searchKey", gData[2]);
    cmd.Parameters.AddWithValue("@PageIndex", gData[0]);
    cmd.Parameters.AddWithValue("@PageSize", gData[1]);
    cmd.Parameters.AddWithValue("@userStatus", strUserStatus);
    cmd.Parameters.Add("@RecordCount", SqlDbType.Int, 4).Direction = ParameterDirection.Output;
    return GetData(cmd, int.Parse(gData[0]), int.Parse(gData[1])).GetXml();
}

private static DataSet GetData(SqlCommand cmd, int pageIndex, int pageSize)
{
    string strConnString = ConfigurationManager.ConnectionStrings["CONN"].ConnectionString;
    using (SqlConnection con = new SqlConnection(strConnString))
    {
        using (SqlDataAdapter sda = new SqlDataAdapter())
        {
            cmd.Connection = con;
            sda.SelectCommand = cmd;
            using (DataSet ds = new DataSet())
            {
                sda.Fill(ds, "dsUsers");
                DataTable dt = new DataTable("dtPager");
                dt.Columns.Add("PageIndex");
                dt.Columns.Add("PageSize");
                dt.Columns.Add("RecordCount");
                dt.Rows.Add();
                dt.Rows[0]["PageIndex"] = pageIndex;
                dt.Rows[0]["PageSize"] = pageSize;
                dt.Rows[0]["RecordCount"] = cmd.Parameters["@RecordCount"].Value;
                ds.Tables.Add(dt);
                return ds;
            }
        }
    }
}

[WebMethod]
public static string EditUser(int userId)
{
    string str = HttpUtility.UrlEncode(DataControl.Encrypt(userId.ToString()));
    return str;
}

[WebMethod]
public static string DeleteUser(int userId)
{
    string result = "";
    if (isDeletePermission.Equals(false))
    {
        result = "DeletePermissionDenied";
    }
    else
    {
        string strQuery = "EXEC sp_um_deleteUser " + userId + "," + int.Parse(HttpContext.Current.Session["UserId"].ToString()) + "";
        bool isResult = DataControl.ExecuteNonQuery(strQuery);
        if (isResult.Equals(true))
        {
            result = "Success";
        }
        else
        {
            result = "Error";
        }
    }
    return result;
}

但是,當我選擇編輯它工作的用戶時,我可以編輯和更新現在的問題。 只有當我嘗試刪除用戶時,才會在刪除第一行時發生這種情況,而不管選擇刪除的用戶(行)如何。

謝謝,

請注意,我之前已經問過這個問題,但意識到我沒有提供足夠的代碼和解釋,所以我想我寧願發布一個包含更多細節的新問題。

您必須始終進行行的克隆,但是頁面的 Dom 中會出現重復的行。 它應該是這樣的:

var row;
function BindUsersList(response) {
    var xmlDoc = $.parseXML(response.d);
    var xml = $(xmlDoc);
    var users = xml.find("dsUsers");
    var html = '<table id="gvUsers">';

    row = $("#<%=gvUsers.ClientID %> tr:last-child").clone(true);

    [...]

另一個可能的錯誤是收集ID,我會修改它,這樣AJAX 功能就不會與點擊混淆。

/* Edit user details. */
        $("[id*=aEditUser]").click(function () {
           var idUser =  $(this).data('user-id');                 

           $.ajax({
                type: "POST",
                url: "users.aspx/EditUser",
                data: '{userId: ' + idUser + '}',
                contentType: "application/json; charset=utf-8",
                datatype: "json",
                async: "true",
                success: function (response) {
                    location.href = "newuser.aspx?uid=" + response.d;
                },
                error: function (response) {
                    Notification(response.status + ' ' + response.statusText, 'Error', 'error');
                }
            });
        }); 

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM