onClick（）javascript函数无法识别，ReferenceError：函数未定义，使用文档Ready

时间：2022-11-05 14:35:03

I've read all the other cases and I didn't have any luck. I'm doing my own Jquery grid. I'm trying to trigger a function when a save button is clicked(other jquery functions are working).....Here's where I include the javascript file "newsletter.js"...The jquery and bootstrap files are beign loaded by the configuration file on php symfony 1.4 for that module...

我已经阅读了所有其他案例,但我没有运气。我正在做自己的Jquery网格。我正在尝试在单击保存按钮时触发一个函数(其他jquery函数正在工作).....这里是我包含javascript文件“newsletter.js”... jquery和bootstrap文件是beign加载的php symfony 1.4上该模块的配置文件...

<body><div class="col-lg-7 col-lg-7-bc">


    <h3 style="font-size:20px"> JURISPRUDENCIA</h3>

    <p>

        </br>

    </p>

       <div class="col-xs-6 col-sm-4 item ico "><a id="newsletters" target="_blank">Newsletters |</a></div>

       <div class="col-xs-6 col-sm-4 item ico "><a  id="fallos" target="_blank">Navegar |</a></div>

       <div class="col-xs-6 col-sm-4 item ico"><a id="cuadernos_mpd" target="_blank">Cuadernos del MPD</a></div>


       <div id="grilla"></div>




</div>

<?php use_javascript("jurisprudencia/newsletter.js");
     use_javascript("jurisprudencia/funciones_grilla.js");
?>

Here's my .js file:

这是我的.js文件:

$(document).ready(function(){   

    //API methods newsletters
    //guardar

    function guardarNewsletter(id){

        alert(id);

        /*$("#fieldset_"+id).show();
        $("#fieldset_hidden_"+id).hide();



             $.ajax({
                  url:"/newsletter/guardarNewsletter", 
                  data: newsletter.serialize(), 
                  success:function(data) {
                     alert("Row Guardada"); 
                  }
               });*/

    }


    $("#newsletters").click(function(){
        $.getJSON("/newsletter/getNewsletters", function(result){

            var grid="<br><table id='newsletter_grid'>";
            grid+="<thead><tr><th></th><th>Año</th><th>Mes</th><th>Quincena</th><th></th><th></th><th>Publicado</th></tr></thead>";

             grid+="<tr><td><button id='agregar_button'>Nuevo</button></td></tr>";

             grid+="<tr id='nuevo_field' style='display:none'>";

             grid+=crearNuevaRow();

             grid+="</tr>";



            $.each(result, function(i, elem){

                //show view fieldset, son los campos que se muestran para visualizar los datos

                grid+="<tr id='fieldset_"+elem.id+"'>";

                grid+=mostrarElementosViewMode(elem);               

                grid+="</tr>";


                //hidden field

                grid+="<tr id='fieldset_hidden_"+elem.id+"' style='display:none'>";

                grid+=crearRowHidden(elem);

                grid+="</tr>";


            });

            grid+="</table>";

            $("#grilla").html(grid);


        });




    }); 

    //crea los elementos editables con el value de su correspondiente existente en modo View o se usa para crear un elemento nuevo

    function crearRowHidden(elem){

        var nuevoHiddenFieldSet="";

        nuevoHiddenFieldSet+="<td><input type='hidden' value='"+elem.id+"'></td>";

        nuevoHiddenFieldSet+="<td><input name='anio' value='"+elem.anio+"'/></td>";

        nuevoHiddenFieldSet+="<td><input name='anio' value='"+elem.mes+"'/></td>";

        nuevoHiddenFieldSet+="<td><input name='quincena' value='"+elem.quincena+"'/></td>";

        nuevoHiddenFieldSet+="<td><button value='Guardar' name='guardar_newsletter' id='guardar_newsletter_"+elem.id+"' onclick='guardarNewsletter("+elem.id+")'>Guardar</td>";

        nuevoHiddenFieldSet+="<td></td>";

        if(elem.publicado==1){
            nuevoHiddenFieldSet+="<td><input type='checkbox' id='publicado_"+elem.id+"' name='publicado' checked='checked'></td>";
        }else{
            nuevoHiddenFieldSet+="<td><input type='checkbox' id='publicado_"+elem.id+"' name='publicado'></td>";
        }
        return nuevoHiddenFieldSet;

    }

    function crearNuevaRow(){

        var nuevaRow="";

        nuevaRow+="<td><input type='hidden' value=''></td>";

        nuevaRow+="<td><input name='anio' value=''/></td>";

        nuevaRow+="<td><input name='anio' value=''/></td>";

        nuevaRow+="<td><input name='quincena' value=''/></td>";
    //ver que ponerle en id
        nuevaRow+="<td><button value='Guardar' name='guardar_newstletter' id=''>Guardar</td>";

        nuevaRow+="<td></td>";
        //ver que ponerle en id
        nuevaRow+="<td><input type='checkbox' id='' name='publicado'></td>";

        return nuevaRow;

    }

    //muestra los elementos del listado que se trae de la base de datos

    function mostrarElementosViewMode(elem){

        var elemento;

        elemento+="<td><input type='hidden' value='"+elem.id+"'></td>";

        elemento+="<td>"+elem.anio+"</td>";

        elemento+="<td>"+elem.mes+"</td>";

        elemento+="<td>"+elem.quincena+"</td>";

        elemento+="<td><button id='editar_"+elem.id+"' value='Editar' onclick='muestraEditarFields(\""+elem.id+"\")'>Editar</td>";

        elemento+="<td><button id='eliminar_newsletter_"+elem.id+"' value='Eliminar'>Eliminar</td>";

        if(elem.publicado == 1){
            elemento+="<td><input type='checkbox' id='publicado_"+elem.id+"' name='publicado' checked='checked'></td>";
        } else {
            elemento+="<td><input type='checkbox' id='publicado_"+elem.id+"' name='publicado'></td>";
        }

        return elemento;

    }

});

This is the part that doesn't work:

这是不起作用的部分:

nuevoHiddenFieldSet+="<td><button value='Guardar' name='guardar_newsletter' id='guardar_newsletter_"+elem.id+"' onclick='guardarNewsletter("+elem.id+")'>Guardar</td>";

I tried to use a Jquery click event and I keep getting the same error when I click the button, not the alert that should show up:

我试图使用Jquery点击事件,当我点击按钮时,我不断收到相同的错误,而不是应该显示的警告:

ReferenceError: guardarNewsletter is not defined


<!DOCTYPE html>

The edit button on this grid is working so I don't know why Jquery is not recognizing my function. I've read that could be a timing problem of when the function is beign called, but I'm not sure in this case. Basically what I do is bring rows from the DB, and create one for visualizing and one hidden for editing, the editing fields show up but when I want to save that error comes up. Any light on this matter?. Thank you very much

这个网格上的编辑按钮正在工作,所以我不知道为什么Jquery没有识别我的功能。我读过这可能是函数被调用时的时间问题,但在这种情况下我不确定。基本上我所做的是从数据库中提取行,并创建一个用于可视化,一个用于编辑隐藏,编辑字段显示但是当我想保存时出现错误。对此事有何看法?非常感谢你

1 个解决方案

#1

2  

your code is defining the function but it is not available in global functions

您的代码正在定义函数,但在全局函数中不可用

function guardarNewsletter(id){

    alert(id);

    /*$("#fieldset_"+id).show();
    $("#fieldset_hidden_"+id).hide();



         $.ajax({
              url:"/newsletter/guardarNewsletter", 
              data: newsletter.serialize(), 
              success:function(data) {
                 alert("Row Guardada"); 
              }
           });*/

}
$(document).ready(function(){   

//API methods newsletters
//guardar


$("#newsletters").click(function(){
    $.getJSON("/newsletter/getNewsletters", function(result){

        var grid="<br><table id='newsletter_grid'>";
        grid+="<thead><tr><th></th><th>Año</th><th>Mes</th><th>Quincena</th><th></th><th></th><th>Publicado</th></tr></thead>";

         grid+="<tr><td><button id='agregar_button'>Nuevo</button></td></tr>";

         grid+="<tr id='nuevo_field' style='display:none'>";

         grid+=crearNuevaRow();

         grid+="</tr>";



        $.each(result, function(i, elem){

            //show view fieldset, son los campos que se muestran para visualizar los datos

            grid+="<tr id='fieldset_"+elem.id+"'>";

            grid+=mostrarElementosViewMode(elem);               

            grid+="</tr>";


            //hidden field

            grid+="<tr id='fieldset_hidden_"+elem.id+"' style='display:none'>";

            grid+=crearRowHidden(elem);

            grid+="</tr>";


        });

        grid+="</table>";

        $("#grilla").html(grid);


    });




}); 

//crea los elementos editables con el value de su correspondiente existente en modo View o se usa para crear un elemento nuevo

function crearRowHidden(elem){

    var nuevoHiddenFieldSet="";

    nuevoHiddenFieldSet+="<td><input type='hidden' value='"+elem.id+"'></td>";

    nuevoHiddenFieldSet+="<td><input name='anio' value='"+elem.anio+"'/></td>";

    nuevoHiddenFieldSet+="<td><input name='anio' value='"+elem.mes+"'/></td>";

    nuevoHiddenFieldSet+="<td><input name='quincena' value='"+elem.quincena+"'/></td>";

    nuevoHiddenFieldSet+="<td><button value='Guardar' name='guardar_newsletter' id='guardar_newsletter_"+elem.id+"' onclick='guardarNewsletter("+elem.id+")'>Guardar</td>";

    nuevoHiddenFieldSet+="<td></td>";

    if(elem.publicado==1){
        nuevoHiddenFieldSet+="<td><input type='checkbox' id='publicado_"+elem.id+"' name='publicado' checked='checked'></td>";
    }else{
        nuevoHiddenFieldSet+="<td><input type='checkbox' id='publicado_"+elem.id+"' name='publicado'></td>";
    }
    return nuevoHiddenFieldSet;

}

function crearNuevaRow(){

    var nuevaRow="";

    nuevaRow+="<td><input type='hidden' value=''></td>";

    nuevaRow+="<td><input name='anio' value=''/></td>";

    nuevaRow+="<td><input name='anio' value=''/></td>";

    nuevaRow+="<td><input name='quincena' value=''/></td>";
//ver que ponerle en id
    nuevaRow+="<td><button value='Guardar' name='guardar_newstletter' id=''>Guardar</td>";

    nuevaRow+="<td></td>";
    //ver que ponerle en id
    nuevaRow+="<td><input type='checkbox' id='' name='publicado'></td>";

    return nuevaRow;

}

//muestra los elementos del listado que se trae de la base de datos

function mostrarElementosViewMode(elem){

    var elemento;

    elemento+="<td><input type='hidden' value='"+elem.id+"'></td>";

    elemento+="<td>"+elem.anio+"</td>";

    elemento+="<td>"+elem.mes+"</td>";

    elemento+="<td>"+elem.quincena+"</td>";

    elemento+="<td><button id='editar_"+elem.id+"' value='Editar' onclick='muestraEditarFields(\""+elem.id+"\")'>Editar</td>";

    elemento+="<td><button id='eliminar_newsletter_"+elem.id+"' value='Eliminar'>Eliminar</td>";

    if(elem.publicado == 1){
        elemento+="<td><input type='checkbox' id='publicado_"+elem.id+"' name='publicado' checked='checked'></td>";
    } else {
        elemento+="<td><input type='checkbox' id='publicado_"+elem.id+"' name='publicado'></td>";
    }

    return elemento;

}

});

#1

2  

your code is defining the function but it is not available in global functions

您的代码正在定义函数,但在全局函数中不可用

function guardarNewsletter(id){

    alert(id);

    /*$("#fieldset_"+id).show();
    $("#fieldset_hidden_"+id).hide();



         $.ajax({
              url:"/newsletter/guardarNewsletter", 
              data: newsletter.serialize(), 
              success:function(data) {
                 alert("Row Guardada"); 
              }
           });*/

}
$(document).ready(function(){   

//API methods newsletters
//guardar


$("#newsletters").click(function(){
    $.getJSON("/newsletter/getNewsletters", function(result){

        var grid="<br><table id='newsletter_grid'>";
        grid+="<thead><tr><th></th><th>Año</th><th>Mes</th><th>Quincena</th><th></th><th></th><th>Publicado</th></tr></thead>";

         grid+="<tr><td><button id='agregar_button'>Nuevo</button></td></tr>";

         grid+="<tr id='nuevo_field' style='display:none'>";

         grid+=crearNuevaRow();

         grid+="</tr>";



        $.each(result, function(i, elem){

            //show view fieldset, son los campos que se muestran para visualizar los datos

            grid+="<tr id='fieldset_"+elem.id+"'>";

            grid+=mostrarElementosViewMode(elem);               

            grid+="</tr>";


            //hidden field

            grid+="<tr id='fieldset_hidden_"+elem.id+"' style='display:none'>";

            grid+=crearRowHidden(elem);

            grid+="</tr>";


        });

        grid+="</table>";

        $("#grilla").html(grid);


    });




}); 

//crea los elementos editables con el value de su correspondiente existente en modo View o se usa para crear un elemento nuevo

function crearRowHidden(elem){

    var nuevoHiddenFieldSet="";

    nuevoHiddenFieldSet+="<td><input type='hidden' value='"+elem.id+"'></td>";

    nuevoHiddenFieldSet+="<td><input name='anio' value='"+elem.anio+"'/></td>";

    nuevoHiddenFieldSet+="<td><input name='anio' value='"+elem.mes+"'/></td>";

    nuevoHiddenFieldSet+="<td><input name='quincena' value='"+elem.quincena+"'/></td>";

    nuevoHiddenFieldSet+="<td><button value='Guardar' name='guardar_newsletter' id='guardar_newsletter_"+elem.id+"' onclick='guardarNewsletter("+elem.id+")'>Guardar</td>";

    nuevoHiddenFieldSet+="<td></td>";

    if(elem.publicado==1){
        nuevoHiddenFieldSet+="<td><input type='checkbox' id='publicado_"+elem.id+"' name='publicado' checked='checked'></td>";
    }else{
        nuevoHiddenFieldSet+="<td><input type='checkbox' id='publicado_"+elem.id+"' name='publicado'></td>";
    }
    return nuevoHiddenFieldSet;

}

function crearNuevaRow(){

    var nuevaRow="";

    nuevaRow+="<td><input type='hidden' value=''></td>";

    nuevaRow+="<td><input name='anio' value=''/></td>";

    nuevaRow+="<td><input name='anio' value=''/></td>";

    nuevaRow+="<td><input name='quincena' value=''/></td>";
//ver que ponerle en id
    nuevaRow+="<td><button value='Guardar' name='guardar_newstletter' id=''>Guardar</td>";

    nuevaRow+="<td></td>";
    //ver que ponerle en id
    nuevaRow+="<td><input type='checkbox' id='' name='publicado'></td>";

    return nuevaRow;

}

//muestra los elementos del listado que se trae de la base de datos

function mostrarElementosViewMode(elem){

    var elemento;

    elemento+="<td><input type='hidden' value='"+elem.id+"'></td>";

    elemento+="<td>"+elem.anio+"</td>";

    elemento+="<td>"+elem.mes+"</td>";

    elemento+="<td>"+elem.quincena+"</td>";

    elemento+="<td><button id='editar_"+elem.id+"' value='Editar' onclick='muestraEditarFields(\""+elem.id+"\")'>Editar</td>";

    elemento+="<td><button id='eliminar_newsletter_"+elem.id+"' value='Eliminar'>Eliminar</td>";

    if(elem.publicado == 1){
        elemento+="<td><input type='checkbox' id='publicado_"+elem.id+"' name='publicado' checked='checked'></td>";
    } else {
        elemento+="<td><input type='checkbox' id='publicado_"+elem.id+"' name='publicado'></td>";
    }

    return elemento;

}

});

标签：

相关文章