Duplicity in Datatables.net jquery

Asked

Viewed 66 times

1

I have Modal window that adds Customer Address, the problem is that the added addresses get duplicated, I am using the Datatables.net pata list the addresses.

The process to add the addresses is executed in the client, that is, you can add n addresses to the client and only then send to the BD.

Duplicity occurs in the Customer, even before sending to the BD.

HTML

<table id="tblEndereco" class="table table-hover table-bordered table-condensed table-responsive table-striped small" style="cursor:pointer">

                        <thead>
                            <tr>
                                <th>Logradouro</th>
                                <th>Numero</th>
                                <th>Bairro</th>
                                <th>CEP</th>
                                <th>Cidade</th>
                                <th>UF</th>
                                <th></th>
                                <th></th>
                            </tr>
                        </thead>
                        @if (Model.Enderecos != null)
                        {
                            foreach (var item in Model.Enderecos)
                            {
                                @Html.Partial("_PartialEndereco", item)
                            }
                        }

                    </table>

Knob Add

$('.btnAdicionarEndereco').on('click', function (e) {
            e.preventDefault();

                var _logradouro = $('#Logradouro').val();
                var _numero = $('#Numero').val();
                var _bairro = $('#Bairro').val();
                var _cep = $('#CEP').val();
                var _cidade = $("#SelCidade :selected").text();
                var _uf = $('#SelUF').val();

                    $("#tblEndereco tbody").append("<tr class='novo' id='' data-clienteid=" + $('#hidClienteID').val() + " data-tipoenderecoid="+ $('#SelTipoEndereco').val() +" data-cidadeid="+ $('#SelCidade').val() +">" +
                                                        "<td style='width:25%'>" + _logradouro + "</td>" +
                                                        "<td style='width:3%'>" + _numero + "</td>" +
                                                        "<td style='width:20%'>" + _bairro + "</td>" +
                                                        "<td style='width:10%'>" + _cep + "</td>" +
                                                        "<td style='width:17%'>" + _cidade + "</td>" +
                                                        "<td style='width:5%'>" + _uf + "</td>" +
                                                        "<td><a href='#' class='glyphicon glyphicon-remove'></a></td>" +
                                                        "<td><a href='#' class='glyphicon glyphicon-edit'></a></td>" +
                                                    "</tr>");


                    $('#modalEndereco').modal('hide');
            };
        });
jquery

1 answer

0

Solved, the problem was the tag <tbody> that was in the wrong place, that is inside the loop foreach.

Browser other questions tagged jquery

You are not signed in. Login or sign up in order to post.