openjs grid v2.1 - 可编辑的列不起作用

时间:2013-01-19 02:07:08

标签: javascript php mysql

我一直在测试openjs grid v2.1 - 从修改ajax.php和index.php开始 - 我可以让网格显示数据,删除功能,排序和导航工作但我似乎无法得到内联编辑工作,我已经尝试了一切,观看旧版本的YouTube视频,搜索谷歌,已经尝试了很多个小时 - 我被卡住了!

我的表有一个主键'id'

ajax.php

<?php
    // connect to db
    mysql_connect("localhost","user","pass");
    mysql_select_db("db");

    // require our class
    require_once("grid.php");

    // load our grid with a table
    $grid = new Grid("phpbb_rivals_players", array(
        "save"=>true,
        "delete"=>true,
        "editing"=>true,
        "where"=>"Console = 'PS3'",
        "select" => 'selectFunction'
    ));

    // drop down function
    // if you have anonymous function support, then you can just put this function in place of
    // 'selectFunction'
    function selectFunction($grid) {
        $selects = array();

        // category select
        $grid->table = "phpbb_rivals_players";
        $selects["id"] = $grid->makeSelect("id","ForumID");

        // active select
        $selects["active"] = array("1"=>"true","0"=>"false");

        // render data          
        $grid->render($selects);
    }


?>

的index.php

<!DOCTYPE html>
<html lang="en">
    <head>

        <link rel="stylesheet" href="bootstrap/css/bootstrap.css"/>

        <link rel="stylesheet" href="grid.css" title="openJsGrid"/>
        <!--<link rel="stylesheet" href="jquery-ui/css/smoothness/jquery-ui-1.8.22.custom.css"/>-->
        <script src="jquery.js" type="text/javascript"></script>
        <!--<script src="jquery-ui/js/jquery-ui-1.8.22.custom.min.js" type="text/javascript"></script>-->
        <script src="root.js"></script>
        <script src="grid.js"></script>

        <script type="text/javascript">
            $(function() {


                $(".users").grid({
                    title : "users",
                    page : 1,
                    showPager : true,
                    editing : true,
                    nRowsShowing : 10,
                    width: 800,
                    editing: true,
                    deleting : true
                }).on("loadComplete",function(e) {
                    //console.log("loadComplete", this.instance);
                }).on("cellClick",function(e, $cell) {
                    //console.log("cell",$cell);
                }).on("rowCheck",function(e, $checkbox) {
                    //console.log("rowCheck",$checkbox);
                }).on("rowClick",function(e, $rows) {
                    //console.log("rowClick",$rows);
                });

            });
        </script>
    </head>
    <body>
        <h2>Players</h2>
        <table class="grid users" action="ajax.php">
            <tr>    
                <th col="id" width="50">id</th>
                <th col="ForumID">ForumID</th>
                <th col="GTPSN">GTPSN</th>
                <th col="Position">Position</th>
                <th col="Formation">Formation</th>
            </tr>
        </table>
    </body>
</html>

我希望能够编辑GTPSN,位置,编队,控制台等...

1 个答案:

答案 0 :(得分:1)

开发人员非常友好地回应我在github上的问题!

在你的表格html中,设置type =“text” - 它在原始文档中被省略,现在将被添加。

        <table class="grid users" action="ajax.php">
        <tr>    
            <th col="id" width="50">id</th>
            <th col="ForumID">ForumID</th>
            <th col="GTPSN">GTPSN</th>
            <th col="Position">Position</th>
            <th col="Formation">Formation</th>
        </tr>
    </table>

应该是

        <table class="grid users" action="ajax.php">
        <tr>    
            <th col="id" width="50">id</th>
            <th col="ForumID">ForumID</th>
            <th type="text" col="GTPSN">GTPSN</th>
            <th type="text" col="Position">Position</th>
            <th type="text" col="Formation">Formation</th>
        </tr>
    </table>

向这个伟大工具的开发人员致敬。对于构建后端管理控制面板的任何人来说,这是一个很好的补充!