2
Hello, I’m trying to fill the next table closer to the clicked button, but I’m not getting.
It is important that it be the next one right after, because there are several tables with the same class, will they help me??
Here is the javascript:
$(".btnMostrarCategoria").click(
function() {
var nome = $(this).data('nome');
jQuery("#tabelaUploads tbody").html("");
console.log($(this).next("table"));
$.ajax({
url: "/painel/mostrarUploadsCategorias",
method: 'POST',
data: {_token: jQuery(".token").val(), nome: nome},
success: function(e) {
console.log(e);
e.forEach(function(item, indice) {
//remove o diretório da string e só deixa o nome final do arquivo
var nomeArquivo = item.replace('public/painel/categorias/' + nome + "/", "");
$(this).find('.tabelaUploads tbody').append("<tr><td>" + nomeArquivo + "</td> <td><a class='btn btn-success' href=\"/painel/fazerDownload/" + nome + "/" + nomeArquivo + "\">Download</a> <button type='button' class='btn btn-danger' onclick=\"excluirUpload('" + item + "')\">Excluir</button></td></tr>");
});
}
}).done(function() { //só abre o modal assim que terminar a requisição ajax
hidePleaseWait();
});
}
);
HTML:
@foreach($categorias as $categoria)
@if($loop->first)
<div class="box"><!-- Usar [.box collapsed-box] nos demais -->
@else
<div class="box collapsed-box"><!-- Usar [.box collapsed-box] nos demais -->
@endif
<div class="box-header with-border">
<input type="hidden" name="" id="nomeCategoria" value="{{$categoria->nome}}">
<h3 class="box-title" data-widget="collapse">{{$categoria->id}} - {{ $categoria->nome }}</h3>
<div class="box-tools pull-right">
<button type="button" class="btn btn-box-tool btnMostrarCategoria" data-widget="collapse" data-toggle="tooltip" title="Collapse" data-nome={{ $categoria->nome }}>
@if($loop->first)
<i class="fa fa-minus"></i></button>
@else
<i class="fa fa-plus"></i></button>
@endif
</div>
</div>
<div class="box-body">
<div class="form-group" id="uploadtr">
<input type="hidden" id="idPasta">
<br>
<input type="file" name="files[]" id="fileupload" data-token="{!! csrf_token() !!}" data-pasta="" class="btn btn-primary" multiple ><br/>
<div id="progress" class="progress" role="progressbar">
<div class="progress-bar progress-bar-success" aria-valuenow="" aria-valuemin="0" aria-valuemax="100">
<span id="progressValue">0%</span>
</div>
</div>
<span id="mensagemFinalUpload" style="color: #367fa9">Arquivo enviado com sucesso!</span>
</div>
<table class="table table-bordered table-striped table-hover" class="tabelaUploads" data-teste="whatever">
<thead>
<tr>
<th width="85%">Arquivo</th>
<th width="15%">Ações</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
<!-- /forelse categoria -->
@endforeach
<!-- /.box -->
insira o código aqui
You can use the
.parent()
until checking on an element that has both the button and the desired table as subelements. Example:$(this).parent().parent().parent().find('.table');
.– Juven_v