未在 php 文件中定义 javascript 函数的错误

Posted

技术标签:

【中文标题】未在 php 文件中定义 javascript 函数的错误【英文标题】:Error with javascript function not being defined in php file 【发布时间】:2019-05-20 20:15:09 【问题描述】:

我在这里看到了许多类似的问题,它们已经解决了这个问题,但我无法弄清楚为什么我的代码会产生这个错误:editRow() not defined,因为我已经遵循了其他问题所说的一切。我想打开一个弹出窗口,在 php.ini 中编辑 crud 表中的一行。我试图将函数放在文件的头部,但没有任何改变。

<!DOCTYPE html PUCLIC "-//W3C//DTDHTML 4.0 Transitional//EN">
<HTML>
<HEAD>
    <TITLE>LIBRARY DATABASE</TITLE>
    <link rel="stylesheet" type="text/css" href="tablestyle.css">
    <link rel="stylesheet" type="text/css" href="style.css">
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
            var newObj =  
                        width: 900, 
                        height: 460, 
                        editable: false,
                        pageModel:  type: "local", rPP: 15, rPPOptions: [10, 15, 20, 50, 100] ,
                        flexHeight: true,
                        title: "Companies listed on the <b>NASDAQ</b>",
                        freezeCols: 1,
                        resizable: true,            
                        editModel:  clicksToEdit: 2 ,
                        selectionModel:  mode: 'single', type: 'row' 
                     ;

                  var $grid = $("#grid_crud").pqGrid(newObj);
                    //create popup dialog.
                    $("#popup-dialog-crud").dialog( width: 400, modal: true,
                     open: function ()  $(".ui-dialog").position( of: "#grid_crud" ); ,
                     autoOpen: false
                    );
                 function getRowIndx() 
                        var arr = $grid.pqGrid("selection",  type: 'row', method: 'getSelection' );
                        if (arr && arr.length > 0) 
                            return arr[0].rowIndx;                                
                        
                         else 
                            alert("Select a row.");
                            return null;
                        
                 
                function editRow() 
                    var rowIndx = getRowIndx();
                    if (rowIndx != null) 

                        var row = $grid.pqGrid('getRowData', rowIndx: rowIndx);

                        var $frm = $("form#crud-form");
                        $frm.find("input[name='memberID']").val(row[0]);
                        $frm.find("input[name='MFirst']").val(row[1]);
                        $frm.find("input[name='MLast']").val(row[3]);
                        $frm.find("input[name='Street']").val(row[4]);
                        $frm.find("input[name='number']").val(row[5]);
                        $frm.find("input[name='postalCode']").val(row[6]);
                        $frm.find("input[name='Mbirthdate']").val(row[7]);

                        $("#popup-dialog-crud").dialog( title: "Edit Record (" + (rowIndx + 1) + ")", buttons: 
                            Update: function () 
                                //update row.
                                var row = [];
                                row[0] = $frm.find("input[name='memberID']").val();
                                row[1] = $frm.find("input[name='MFirst']").val();
                                row[3] = $frm.find("input[name='MLast']").val();
                                row[4] = $frm.find("input[name='Street']").val();
                                row[5] = $frm.find("input[name='number']").val();
                                row[6] = $frm.find("input[name='postalCode']").val();
                                row[7] = $frm.find("input[name='Mbirthdate']").val();

                                $grid.pqGrid('updateRow',  rowIndx: rowIndx, row: row, checkEditable: false );

                                $(this).dialog("close");
                            ,
                            Cancel: function () 
                                $(this).dialog("close");
                            
                        
                        ).dialog("open");
                    
                
        </script>
</HEAD>
<div class="navbar">
                <a href="mydatabase.php">Home</a>
                <a href="member_table.php">Member</a>
                <a href="book_table.php">Book</a>
                <a href="borrows_table.php">Borrows</a>
              </div>
              <br><br>
              <div class="navbar">
                    <a href="insert.php">Insert</a>
                    <a href="update.php">Update</a>
                    <a href="delete.php">Delete</a>
                  </div>

    <TABLE class="minimalistBlack">
        <thead>
        <tr>
        <th> memberID </th>
        <th> First Name </th>
        <th> Last Name </th>
        <th> Street </th>
        <th> Number </th>
        <th> Postal Code </th>
        <th> Birthdate </th>
        <th> Update </th>
        </tr>
        </thead>
        <?php 
            $conn= mysqli_connect("localhost","root","","library");
            if ($conn -> connect_error)
                die("Conenction failed:". $conn->connect_error);
            
            $sql="SELECT memberID,MFirst,MLast,Street,number,postalCode,Mbirthdate FROM member";
            $result = $conn->query($sql);
            if ($result->num_rows>0)

                while($row= $result->fetch_assoc())
                    echo "<tr>";
                    echo "<td>".$row['memberID']."</td>";
                    echo "<td>".$row['MFirst']."</td>";
                    echo "<td>".$row['MLast']."</td>";    
                    echo "<td>".$row['Street']."</td>"; 
                    echo "<td>".$row['number']."</td>"; 
                    echo "<td>".$row['postalCode']."</td>"; 
                    echo "<td>".$row['Mbirthdate']."</td>"; 
                    echo "<td><a href='#' onclick='editRow()'>Edit </a>
                     | <a href=\"deletefmtable.php?memberID=$row[memberID]\" onClick=\"return confirm('Are you sure you want to delete?')\">Delete</a></td>";  
                
                echo "</TABLE>";
            
            else  echo "0 result"; 
            $conn->close();
         ?>
    </TABLE>
</HTML>

【问题讨论】:

将你的 javascript 包装在一个 $(document).ready 函数中,这应该可以解决你的问题 @tiborK 解决了找不到DOM元素的问题,不是找不到函数。 事实上,这显然行不通,因为onclick 属性中使用的函数必须是全局的,但是将代码包装在$(document).ready 中会使所有内容都本地化。 正如下面提到的@Barmar,您需要单独的脚本标签 @Barmar 点击事件将是全局的。当页面的文档对象模型 (DOM) 变得可以安全操作时,ready 函数用于运行 JavaScript 代码 【参考方案1】:

您不能将脚本代码放在具有src 属性的&lt;script&gt; 标记中。您需要两个单独的标签,一个用于加载 jQuery,另一个用于加载您的脚本。

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript">
... your code here
</script>

【讨论】:

【参考方案2】:

不确定,但您的文档没有 &lt;body&gt; 标记,因此这可能是个问题。

你还需要分开加载jquery脚本和你自定义的js。所以:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

<script>//Your custom scripts</script>

【讨论】:

谢谢,我认为这解决了问题,但我收到一个错误,指出 pqGrid 不是函数 这好像是一个单独的jquery插件,也就是说你需要下载它并在jquery script标签之后引用它。

以上是关于未在 php 文件中定义 javascript 函数的错误的主要内容,如果未能解决你的问题,请参考以下文章