MVC Deletemodal с дополнительными опциями, использующими jQuery

Question

В MVC я сделал модальный jQuery, спрашивая меня, уверен ли я, хочу ли я удалить его, и затем делаю обратную передачу с $.post Я использую это для всех моих «индексных представлений», которых довольно много.

Для большинства представлений, когда я что-то удаляю, строка из таблицы также удаляется с помощью hide()

, теперь для некоторых представлений вещи на самом деле не удаляются, но они получают 'неактивный'.Так что в этом случае я не хочу удалять их из таблицы, я просто даю им класс 'rowinactive'

Так вот, что я получил:

Index.aspx

<script type="text/javascript">
    $(document).ready(function () {

        $(".delbtn").click(function () {
            var msg = "deelnemer \"" + $(this).parent().parent().find(".dlnVoornaam").text() + " "+$(this).parent().parent().find(".dlnNaam").text()+"\" ";
            deleteConfirmation(msg, this, true);
            return false;
        });
    });
</script>

HTML-таблица

            <th>
            </th>
            <th>
                Aanspreking
            </th>
            <th>
                Naam
            </th>
            <th>
                Voornaam
            </th>

            <th>
                Functie
            </th>
            <th>
                Creatiedatum
            </th>
            <th>
                Annulatiedatum
            </th>
            <th>

                Update
            </th>
            <th>
                Email
            </th>
            <th>
                Username
            </th>
        </tr>

        <tr class="rowinactive">

            <td>

            </td>
            <td>
                De heer
            </td>
            <td class="dlnNaam">
                Van der Straeten                                                                                                                                                                                                                                               
            </td>
            <td class="dlnVoornaam">
                Stefan                                                                                                                                                                                                                                                         
            </td>

            <td>
                Webdev                                                                                              
            </td>
            <td>
                29/09/2010
            </td>
            <td>
                29/09/2010
            </td>
            <td>


            </td>
            <td>
                xxx                                                                                                                                                                                                                                    
            </td>
            <td>
                Stefan.Van der Stra   
            </td>
        </tr>

        <tr class="">
            <td>


<a href='/2011-2012/Deelnemer/Edit/5?instID=3562'>
    <img src="/img/pencil.png" alt="Edit" width="16" /></a>

<a href='/2011-2012/Deelnemer/Details/5?instID=3562'>
    <img src="/img/application_view_detail.png" alt="Details"
        width="16" /></a>

<a class="delbtn" href='/2011-2012/Deelnemer/Delete/5?instID=3562'>
    <img src="/img/cancel.png" alt="Delete" width="16" /></a>

            </td>
            <td>

                De heer
            </td>
            <td class="dlnNaam">
                Van der Straeten                                                                                                                                                                                                                                               
            </td>
            <td class="dlnVoornaam">
                Stefan                                                                                                                                                                                                                                                         
            </td>
            <td>
                Webdev                                                                                              
            </td>

            <td>
                29/09/2010
            </td>
            <td>

            </td>
            <td>

            </td>
            <td>
                xxx                                                                                                                                                                                                                                    
            </td>

            <td>
                Stefan.VanderStraet   
            </td>
        </tr>

        <tr class="rowinactive">
            <td>

            </td>
            <td>
                De heer
            </td>

            <td class="dlnNaam">
                Van der Straeten                                                                                                                                                                                                                                               
            </td>
            <td class="dlnVoornaam">
                Stefan                                                                                                                                                                                                                                                         
            </td>
            <td>
                Webdev                                                                                              
            </td>
            <td>

                29/09/2010
            </td>
            <td>
                29/09/2010
            </td>
            <td>

            </td>
            <td>
                xxx                                                                                                                                                                                                                                    
            </td>

            <td>
                Stefan.VanderStraet1  
            </td>
        </tr>

        <tr class="">
            <td>

<a href='/2011-2012/Deelnemer/Edit/7?instID=3562'>
    <img src="/img/pencil.png" alt="Edit" width="16" /></a>

<a href='/2011-2012/Deelnemer/Details/7?instID=3562'>

    <img src="/img/application_view_detail.png" alt="Details"
        width="16" /></a>

<a class="delbtn" href='/2011-2012/Deelnemer/Delete/7?instID=3562'>
    <img src="/img/cancel.png" alt="Delete" width="16" /></a>

            </td>
            <td>
                De heer
            </td>
            <td class="dlnNaam">
                Van der Straeten                                                                                                                                                                                                                                               
            </td>

            <td class="dlnVoornaam">
                Stefan                                                                                                                                                                                                                                                         
            </td>
            <td>
                Webdev                                                                                              
            </td>
            <td>
                29/09/2010
            </td>
            <td>


            </td>
            <td>

            </td>
            <td>
                xxx                                                                                                                                                                                                                                     
            </td>
            <td>
                Stefan.VanderStraet2  
            </td>
        </tr>


    </table>

Внешний файл JS

function deleteConfirmation(msg, handler) {
    deleteConfirmation(msg, handler, false);
}

function deleteConfirmation(msg, handler, inactive) {
    var showIt = function (hash) {
        hash.w.find("#modaltekst").text(msg);
        $("#btnJa").data('handler', $(handler));
        $("#btnJa").data('inactive', inactive);
        $("#delmodal").show();
        return false;
    };

    $("#delmodal").jqm({ onShow: showIt }).jqmShow();

}

$(document).ready(function () {
    $("#btnJa").click(function () {
        $("#delmodal").jqmHide();
        setHighlight("Verwijderen...");
        $.post($(this).data('handler').attr('href'), null, function (data) {
            if (data.succes) {
                setHighlightOK("Verwijderd");
                if ($("#btnJa").data('inactive')==false) {
                    $("#btnJa").data('handler').parent().parent().fadeOut("slow");
                } else {
                    $("#btnJa").data('handler').parent().parent().addClass("rowinactive");
                }
            } else {
                if (data.error != "") {
                    setError(data.error);
                } else {
                    setError("Verwijderen mislukt.");
                }
            }
        }, "json");
    });

    $("#btnNee").click(function () {
        $("#delmodal").jqmHide();
    });
});

Итакчтобы сделать строку неактивной, а не скрыть ее, я добавил boolean var inactive.

Теперь, вместо добавления inactive var, я хотел бы отправить function из моего Index.aspx в вызове deleteConfirmation.функция тогда будет содержать код, который должен быть выполнен при последующей передаче.Я хочу это, потому что я хотел бы скрыть кнопки неактивных строк, хотя я, вероятно, мог бы сделать это с live(), который мне не кажется чистым.

дополнительный вопрос: как бы вы оптимизировали этот код

Answer 1

что я предполагаю из твоего кода, что ты хочешь две вещи

1-отличить неактивные строки от других 2-отключить удаление и редактирование ссылок

Вы можете сделать это, написав несколько CSS и JQuery. Вы можете написать стиль для неактивных строк

.inactive
{
   background-color:gray;

}

$("tr.inactive a").live("click",function(){
  return false;
});

и когда вы инактивируете свою строку с помощью вызова ajax, вы можете просто добавить класс "неактивный" к соответствующему tr и отключить соответствующую кнопку удаления, например

$("tr.inactive .delBtn").attr("disabled","disabled");