Duvida em Javascript

Bom dia tenho uma duvida:
Em um select tenho 3 escolhas. Preciso fazer com que a escolha selecionada seja aberta na mesma página para o usuario poder excluir um item da categoria ou marca ou subcategoria mas devo estar fazendo alguma coisa errada poderiam me ajudar?

segue o arquivo:

 <main class="container">
<article class="principal">
    <script type="text/javascript" src="js/jquery.min.js"></script>
     <script type="text/javascript">
 $(document).ready(function () {
    // Evento quando o valor da combo é alterado
   $('#select-relatorio').change(function () {
     // Redirecionamento por Javascript quando uma das opções com valor for selecionado
     if ($(this).val()!="") {
         window.location = $(this).val();
        }
       });
     });
  </script>
  <br><br><br>
    <main class="container">
     <div id="notifications">
     <div class="alert alert-success">
        <div class="container">
        <h3><b>Selecione para Excluir</b> </h3>
        </div>
        <br><br>
      <article class="principal">
       <div class="form-group">
        <select id="select-relatorio" class="form-control">
            <option>Selecione</option>
            <option value="#1">Categoria</option>
            <option value="#2">Sub-Categoria</option>
            <option value="#3">Marca</option>
         </select>  
     </div>
   </article>
    </main>
     <div class="table-responsive" id="1">
  <?php
  $categorias = listaCategorias($conexao);
  foreach ($categorias as $categoria) :
   ?>
<table class="table"> 
    <thead>
        <tr>
            <th class="text-center">ID</th>
            <th class="text-center">Nome</th>
            <th class="text-right">Acões</th>
        </tr>
    </thead>
    <tbody>          
           <tr>
            <td class="text-center"><?=$categoria->getId() ?></td>
            <td class="text-center"><?=$categoria->getNome() ?></td>                
            <td class="td-actions text-right">
                 <button type="button" rel="tooltip" title="Alterar" class="btn btn-success btn-simple btn-xs">
                    <i class="fa fa-edit"></i>
                </button>
                <button type="button" rel="tooltip" title="Remover" class="btn btn-danger btn-simple btn-
                      xs">
                    <i class="fa fa-times"></i>
                </button>
            </td>
          </tr>          
         </tbody>
     </table>

Usa ajax. Exemplo com a biblioteca jquery:

Documentação:

http://api.jquery.com/jquery.ajax/
https://api.jquery.com/jquery.get/ (forma simplificada usando método GET)

Muito obrigado javaflex vou verificar como encaixar essas biblioteca no projeto. Valeu. Abraços

1 curtida

Aparentemente pelo seu código você já faz algum uso do jquery.

Pelo seu código, vc já usa o JQuery no projeto. Essas chamadas que começam com $(…) são do jquery, para fazer requisições com AJAX, estude sobre a função $.ajax();