Question

我在一个基于PLAY框架的Java项目中使用Bootstrap。在我的一次点击中，我通过获取表格中每行的div来填充表格中的数据（基于服务器发送的行数据）。我通过$ .get（）获取整个div html然后使用.last（）方法我在fetched表的各个列中填充数据。所以这使我的表成为运行时加载元素而不是静态元素。

第一次点击按钮时，一切都很好。但是我没有删除现有的行，并且在后续点击中用新行替换它们，而是将新数据绑定到现有数据下面。

我尝试在先前获取的div上使用.remove（）,. empty（）,. removeC（）获取新行之前删除现有行。我甚至试图在所有现有的div上使用.each（）删除它们，但不管怎么说，这对我都没有用。

我得出的结论如下：

删除方法适用于旧的和新获取的div（因为它们显然都有共同的类）。
这些删除方法不适用于运行时加载的元素（如我们所说的委托）。

现在已经有一段时间摆弄这个问题并且无处可去。有人能指出我更好的方向来实现同样的目标。

我用于上述的基本jQuery函数如下。我尝试过使用各种方法，但现在它显示了我用过的最新方法：

$(document).ready(function(){
    $('#searchButton').click(function(){
        $('body').find('.jresultList').empty();
        $("#jErrDisplayy").css("display","none");
        var input,div,range;
        input= $("#inputField").val();
        $.ajax({
                url: "/fetchPTIDatas",
                data: {num:$('#inputField').val()}, //{id:$('#conBid').val()},
                timeout: 10000,
                type: "POST",
                cache: false,
                contentType: "application/x-www-form-urlencoded",
                dataType: "json",
                beforeSend:function(jqXHR, options) {
                    if(input.length<7||input.length>11){
                        alert("Please enter a valid input");    
                        jqxhr.abort();
                    } 

                }
            }).fail(function(jqXHR, textStatus, errorThrown){
                alert("ajax call failed");
            }).done(function(resp, textStatus, jqXHR){
                if(resp.errorcode){
                    $("#jErrDisplayy").css("display", "block");
                    $('.jerrorr').html("We couldn't not look up the entered code. Please enter a valid code");
                }else{
                    range= resp.PageContainerList.length;
                    alert(range);
                    $.get("/fetchresultList", function(data){
                        $('body').find('.tableHeader').css('display', 'block');
                        $('jresultList').each(function(){
                            $('jresultList').remove();
                        });
                        for (var i=0; i <=range; i++) {
                            $('body').find('.jContrList').append(data);
                            div = $('body').find('.jContrList .jresultsList').last();
                            div.find('.accordion-body').attr('id', "collapse" + i);
                            div.find('.accordion-toggle').attr('href', "#collapse" + i);
                            div.find('.jContNo').html(resp.PageContainerList[i].container);

                            }

                    });
                                        }
                        });
    });
});

提前致谢!!!

无法删除要替换为新行的表行

0 个答案: