Refre sh таблица после jQuery функция удаляет строку

Question

Пользователь открывает всплывающее окно со списком файлов. Рядом с каждым файлом есть значок для удаления файла.

После того, как пользователь щелкнет по нему, откроется новое «окно подтверждения». После подтверждения пользователем закрывается окно подтверждения, файл удаляется, но визуально ничего не происходит, а всплывающее окно со списком файлов остается открытым (только что удаленный файл остается в списке, даже если он исчез). ).

Если пользователь вручную закрывает всплывающее окно и снова открывает его, список обновляется.

Я бы хотел, чтобы он автоматически обновил sh после удаления файла без закрытия всплывающее окно, удалив строку, в которой была нажата кнопка.

HTML таблица во всплывающем окне:

<table class="table">
            <thead>
                <tr>
                    <th>File name</th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                <c:forEach items="${bean.product.files}" var="na">
                    <tr>
                        <td><a href="${pageContext.request.contextPath}/productFiles/${na.id}.do">${na.name}</a></td>
                        <td><button type="button" class="class" onclick="$().mkdelform('${pageContext.request.contextPath}/app/deleteFile.ajax?id=${bean.product.id}&fileId=${na.id}')">
                                <i class="glyphicon glyphicon-trash"></i>Delete it!
                            </button></td>
                    </tr>
                </c:forEach>
            </tbody>
        </table>

JavaScript функция (удаление):

$.fn.mkdelform=function(action){
    $().mkdelformpost(action);
};

$.fn.mkdelformpost=function(action){
    $('#del-form').dialog(
            {
                autoOpen : true,
                height : 200,
                width : 300,
                modal : true,
                buttons : [{
                    text:msgcode['message.yes'],
                    click : function() {
                        executeActionPost(action);
                        $(this).dialog("destroy");
                    }},{
                    text:msgcode['message.no'],
                    click : function() {
                        $(this).dialog("destroy");
                    }
                }],
                close : function() {
                    $(this).dialog('destroy');
                }
            }); 
};

Answer 1

Передать текущую кнопку

Вам нужно передать this при вызове mkdelform:

<td><button type="button" class="class" onclick="$().mkdelform('${pageContext.request.contextPath}/app/deleteFile.ajax?id=${bean.product.id}&fileId=${na.id}', this)">
                                <i class="glyphicon glyphicon-trash"></i>Delete it!
                            </button></td>

Таким образом, функция будет знать о нажатой кнопке.

Пройдите дальше

$.fn.mkdelform=function(action, button){
    $().mkdelformpost(action, button);
};

Найдите потомка tr и удалите его

$.fn.mkdelformpost=function(action, button){
    $('#del-form').dialog(
            {
                autoOpen : true,
                height : 200,
                width : 300,
                modal : true,
                buttons : [{
                    text:msgcode['message.yes'],
                    click : function() {
                        executeActionPost(action);
                        $(this).dialog("destroy");
                        $(button).parent().parent().remove();
                    }},{
                    text:msgcode['message.no'],
                    click : function() {
                        $(this).dialog("destroy");
                    }
                }],
                close : function() {
                    $(this).dialog('destroy');
                }
            }); 
};