Olá, estou tentando alterar um botão onde, quando for clicado. Seu conteúdo seja alterado para mostrar um "loading" e apos o carregamento da pagina o botão volte ao estado anterior. Já tentei de varias formas mas sem sucesso, não sei se é conflito; poderiam me ajudar por gentileza?
O front end do projeto é em JSP, usamos bootstrap 4.4.
O codigo do botão que quero alterar é:
Pesquisar/*Codigo que quero alterar*/
<div class="col-4 text-right">
<button class="btn btn-sm btn-primary" name="Pesquisar" type="submit">Pesquisar</button>
</div>
Eu tentei da forma abaixo passar os dados usando ID na DIV, pq possuem outros class "button" na pagina que não quero incluir o Loading.
HTML:
Carregando">PesquisarJS/JQ:
$('#load').click(function () { var btn = $(this) btn.button('loading') setTimeout(function () { btn.button('reset') }, 9000) });<script type="text/javascript">
/*codigo que tentei*/
$('#load').click(function () {
var btn = $(this)
btn.button('loading')
setTimeout(function () {
btn.button('reset')
}, 9000)
});
</script>
/*codigo que tentei*/
<div class="col-4 text-right">
<button type="submit" class="btn btn-sm
btn-primary" id="load" data-loading-text="<i class='fa fa-spinner
fa-spin'></i> Carregando">Pesquisar</button>
</div>