Question

我正在使用ajax来更改对象的值（状态），当调用ajax时，对象被更改但页面被重新加载。这是我的模板：

    <table id="datatable" class="tabela">
        <thead>
            <tr>
                <th>RA</th>                   
                <th>Ações</th>                 
            </tr>
        </thead>
        <tbody>
            <g:each var="aluno" in="${listaAluno}">
                <tr>
                    <td>${aluno.ra}</td>
                    <td>
                        <g:link action="editar" controller="aluno" params="[id:aluno.id]"> <i class="fa fa-pencil button edit"></i></g:link>&nbsp&nbsp&nbsp                        
                        <g:link onClick="inativar('/aluno/inativar/${aluno.id}', 'divForm', '${aluno.nome}')"> <i class="fa fa-trash button delete"></i></g:link>
                    </td>
                </tr>
            </g:each>
        </tbody>
    </table>
    <script type="text/javascript">
        $(document).ready(function () {
        $('#datatable').dataTable({colReorder: true});
        });
    </script>

ajax：

function inativar(metodo, div, objeto) {
    var confirmar = confirm("Realmente deseja remover " + objeto + " ?");    
    if (confirmar) {            
        $.ajax({
            url: metodo,
            type: "GET",            
            dataType: 'text',
            success: function (data) {
                $("#" + div).html(data);
            }
        });
    }
}

和方法：

def inativar(){ 
        Aluno aluno = Aluno.get(params.id)
        aluno.status = false
        aluno.save(flush: true)
        def listaAluno = Aluno.findAllByStatus(true)        
        render(template:"list", model:[listaAluno:listaAluno])
    }

我错过了什么？

Answer 1

尝试下面的代码而不是<g:link onClick="inativar('/aluno/inativar/${aluno.id}', 'divForm', '${aluno.nome}')"> <i class="fa fa-trash button delete"></i></g:link>内联onClick JS函数调用inline onClick调用查看全局范围内的函数定义。

<g:link class="inativar"><i class="fa fa-trash button delete"></i></g:link>

JS代码：

<script type="text/javascript">
        var alunoId='${aluno.id}';
        var metodo='/aluno/inativar/'+alunoId;
        var divId='divForm';
        var alunoNome='${aluno.nome}';

        $(document).ready(function () {
            $('#datatable').dataTable({colReorder: true});
            //Call inativar on click
            $('.inativar').click(function(){
               inativar(metodo,divId,alunoNome);

            });
        });

        function inativar(metodo, div, objeto) {
            var confirmar = confirm("Realmente deseja remover " + objeto + " ?");    
            if (confirmar) {            
            $.ajax({
              url: metodo,
              type: "GET",            
              dataType: 'text',
              success: function (data) {
              $("#" + div).html(data);
            }
        });
    }
}
</script>

如果在ajax加载模板中调用Ajax不工作？

1 个答案: