DotNetNuke, Ajax и jQuery: скрытие строки таблицы

Question

Я написал для клиента модуль DotNetNuke, который позволяет им «удалить» купон из таблицы. Когда они нажимают на ссылку, создается Ajax POST с использованием jQuery, и в случае успеха строка должна быть удалена (или, по крайней мере, скрыта), и сообщение об успехе должно быть отображено с прикрепленным CssClass. Все работает просто отлично, за исключением части, где удаляется строка. У меня не было этой проблемы ни в одном другом проекте ASP.NET Web Forms / MVC, только в DotNetNuke. В результате происходит удаление всей моей таблицы и вывод сообщения об успехе. Вот мой код:

<script language="javascript" type="text/javascript">

jQuery.noConflict();
var deletingCouponID = null;

function DeleteCoupon(_CouponID) {

    deletingCouponID = _CouponID;

    jQuery.post(
        "mylink.aspx",
        { CouponID: _CouponID },
        function (data) {

            if (data.Response == "Success") {
                alert("#row" + deletingCouponID);

                jQuery("#tblCoupons tbody tr.row" + deletingCouponID).remove();
                jQuery("#divAjaxMsg").html("<p>" + data.Message + "</p>");
                jQuery("#divAjaxMsg").addClass("NormalRed");
            }
            else {
                jQuery("#divAjaxMsg").html("<p>" + data.Message + "</p>");
                jQuery("#divAjaxMsg").addClass("NormalRed");
            }
        },
        "json"
    );
}

и HTML:

<div style="padding:1px">

<asp:Label runat="server" ID="lblMessage" ></asp:Label>

<div runat="server" id="divCouponList" >

    <div style="text-align: center">
        <h1>Coupon List</h1>
    </div>

    <div id="divAjaxMsg" />

    <table cellpadding="5px" id="tblCoupons">
        <thead>
            <tr>
                <th>Coupon ID</th>
                <th>Coupon Code</th>
                <th>Author</th>
                <th>Date Created</th>
                <th>Expiration Date</th>
                <th>Amount</th>
                <th>Min Purchase Amount</th>
                <th>Num Uses</th>
                <th>Max Uses</th>
                <th>Target User</th>
                <th>Target Product</th>
                <th></th>
                <th></th>
            </tr>
        </thead>
        <tbody>
        <%
            string Sql = "SELECT * FROM MyTable WHERE Expired != 'True'";
            using (IDataReader Reader = DataProvider.Instance ().ExecuteSQL (Sql))
            {
                int Count = 0;
                while (Reader.Read ())
                {
                    ++Count;
        %>
                    <tr id="row<%= ((int)Reader["CouponID"]).ToString () %>">
                        <td nowrap="nowrap"><%= ((int)Reader["CouponID"]).ToString () %></td>
                        <td nowrap="nowrap"><%= Reader["CouponCode"] as string %></td>
                        <td nowrap="nowrap"><%= GetUserDisplayName ((int)Reader["AuthorID"]) ?? "Author Not Found" %></td>
                        <td nowrap="nowrap"><%= ((DateTime)Reader["DateCreated"]).ToShortDateString () %></td>
                        <td nowrap="nowrap"><%= Reader["ExpirationDate"] != DBNull.Value ? ((DateTime)Reader["ExpirationDate"]).ToShortDateString () : "Indefinite" %></td>
                        <td nowrap="nowrap"><%= Reader["Amount"] as string %></td>
                        <td nowrap="nowrap"><%= Reader["MinPurchase"] != DBNull.Value ? String.Format ("{0:C}", (decimal)Reader["MinPurchase"]) : "None" %></td>
                        <td nowrap="nowrap"><%= ((int)Reader["NumUses"]).ToString () %></td>
                        <td nowrap="nowrap"><%= Reader["MaxUses"] != DBNull.Value ? ((int)Reader["MaxUses"]).ToString () : "Unlimited" %></td>
                        <td nowrap="nowrap"><%= !String.IsNullOrEmpty (Reader["TargetUserEmail"] as string) ? Reader["TargetUserEmail"] as string : "None" %></td>
                        <td nowrap="nowrap"><%= Reader["TargetProductID"] != DBNull.Value ? (GetProductName ((int)Reader["TargetProductID"]) ?? "None") : "None" %></td>
                        <td nowrap="nowrap"><a href="<%= NewEditURL + "?CouponID=" + ((int)Reader["CouponID"]).ToString () %>">Edit</a></td>
                        <td nowrap="nowrap"><a href="javascript: DeleteCoupon(<%= ((int)Reader["CouponID"]).ToString () %>)">Delete</a></td>
                    </tr>
        <%
                }

                if (Count < 1)
                {
        %>
                    <tr>
                        <td colspan="10" style="text-align: center;">No coupons found</td>
                    </tr>
        <%
                }
            }
        %>
        </tbody>
    </table>
    <p>
        <a href="<%= NewEditURL %>">Create New Coupon</a>
    </p>
</div>

Я уверен, что это что-то глупое, что я упускаю (или напортачу), поэтому я подумал, что еще несколько глаз на это могут помочь. Мне не очень нравится писать модули DNN, так что это мало поможет! Заранее спасибо!

Jim

Редактировать 2: Спасибо всем за вашу помощь и идеи! Я ценю время и усилия каждого, кто помог мне с этим.

Редактировать: вот разметка «до и после» из IE. Строка фактически не удаляется. Я мог бы жить с просто скрытой строкой, поэтому пользователь не может нажать кнопку редактирования / удаления:

<table cellpadding="5px" id="tblCoupons">
        <thead>
            <tr>
                <th>Coupon ID</th>
                <th>Coupon Code</th>
                <th>Author</th>
                <th>Date Created</th>
                <th>Expiration Date</th>
                <th>Amount</th>
                <th>Min Purchase Amount</th>
                <th>Num Uses</th>
                <th>Max Uses</th>
                <th>Target User</th>
                <th>Target Product</th>
                <th></th>
                <th></th>
            </tr>
        </thead>
        <tbody>

                    <tr id="row8">
                        <td nowrap="nowrap">8</td>
                        <td nowrap="nowrap">E82O7KX</td>
                        <td nowrap="nowrap">SomeUser</td>
                        <td nowrap="nowrap">7/5/2010</td>
                        <td nowrap="nowrap">Indefinite</td>
                        <td nowrap="nowrap">100%</td>
                        <td nowrap="nowrap">$500.00</td>
                        <td nowrap="nowrap">0</td>
                        <td nowrap="nowrap">50</td>
                        <td nowrap="nowrap">None</td>
                        <td nowrap="nowrap">None</td>
                        <td nowrap="nowrap"><a href="somepage">Edit</a></td>
                        <td nowrap="nowrap"><a href="javascript: DeleteCoupon(8)">Delete</a></td>
                    </tr>

                    <tr id="row11">
                        <td nowrap="nowrap">11</td>
                        <td nowrap="nowrap">D2GRI</td>
                        <td nowrap="nowrap">SomeUser</td>
                        <td nowrap="nowrap">7/5/2010</td>
                        <td nowrap="nowrap">Indefinite</td>
                        <td nowrap="nowrap">$300</td>
                        <td nowrap="nowrap">None</td>
                        <td nowrap="nowrap">0</td>
                        <td nowrap="nowrap">Unlimited</td>
                        <td nowrap="nowrap">None</td>
                        <td nowrap="nowrap">None</td>
                        <td nowrap="nowrap"><a href="somepage">Edit</a></td>
                        <td nowrap="nowrap"><a href="javascript: DeleteCoupon(11)">Delete</a></td>
                    </tr>

        </tbody>
    </table>

Answer 1

Изменение

jQuery("#tblCoupons tbody tr.row" + deletingCouponID).remove();

до

jQuery("#row" + deletingCouponID).remove();

Также верните false из вашей функции или используйте event.preventDefault (), чтобы запретить ссылкам следовать.

Answer 2

Вы уверены, что идентификатор купона установлен правильно? Это имело бы смысл, если бы не потому, что ваш код использует этот идентификатор как часть критерия того, что нужно удалить. Если бы его не было, то в основном это указывало бы таблице на удаление всех строк. Ниже в основном то, на что это было бы похоже, если бы оно не было установлено.

jQuery("#tblCoupons tbody tr.row").remove();

Что бы удалить все строки в вашем теле.

Можете ли вы использовать firebug или какой-либо другой динамический генератор источников, чтобы посмотреть на источник страницы после запуска функции и посмотреть, была ли удалена вся таблица или только все строки?

p.s. Я написал много модулей DNN и, кажется, трудно поверить, что это будет связано с самим DNN, а не просто надзор. Хотя я не говорю невозможное.

Answer 3

добавьте класс заголовка в ваш thead и используйте код ниже

$("#myTable tr:not(.header)").remove();
$("#myTable").append(table);