Saving Changes in SlickGrid with php

前端 未结 1 1010
粉色の甜心
粉色の甜心 2021-01-01 06:17

I have a SlickGrid set up, it is reading data from my database with PHP, my problem is arising when i try to save the data back to my database, I am trying to use JSON to gi

相关标签:
1条回答
  • 2021-01-01 07:07

    Ok so I found the problem, just incase anyone is struggling to get this all to work, here is the working code, it gets data from a database, then sends the changed data to another page for processing, it nees a little bit of refinements, that will happen once I've got it all implemented:

    <?php 
    include("includes/check_session.php");
    require_once('includes/functions.php');
    require_once('includes/config.php');
    
    $data = '';
    $i = 0;
    
    $query = "
        SELECT * FROM `prices`";
    $result = mysql_query($query);
    while($row = mysql_fetch_array($result, MYSQL_ASSOC)){
        $data .= '
            data['.$i.'] = {
                id: "'.$row['id'].'",
                title: "'.$row['title'].'",
                duration: "'.$row['duration'].'",
                percentComplete: "'.$row['percentComplete'].'",
                start: "'.$row['start'].'",
                finish: "'.$row['finish'].'",
                effortDriven: "'.$row['effortDriven'].'"
            };
        ';
    
        $i++;
    
    echo $data;
    }
    
    ?>
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset=utf-8>
    
        <?php // include("includes/cms_head_scripts.php"); ?>
        <link rel="stylesheet" href="css/slick.grid.css" type="text/css" media="screen" charset="utf-8" />
        <link rel="stylesheet" href="css/smoothness/jquery-ui-1.8.5.custom.css" type="text/css" media="screen" charset="utf-8" />
        <link rel="stylesheet" href="css/examples.css" type="text/css" media="screen" charset="utf-8" />
        <script src="http://code.jquery.com/jquery-latest.js"></script>
        <script language="javascript" src="js/jquery.json.js"></script>
    
    </head>
    <body>
        <div id="content_cont">
    
            <div id="main">
    
                    <div style="position:relative">
                        <div style="width:600px;">
                            <div id="myGrid" style="width:100%;height:500px;"></div>
                        </div>
                    </div>  
    
    
    
                pricing
    
            </div><!-- #main -->
    
        </div><!-- #content_cont -->
    
            <script src="lib/firebugx.js"></script>
    
    
            <script src="lib/jquery-ui-1.8.5.custom.min.js"></script>
            <script src="lib/jquery.event.drag-2.0.min.js"></script>
    
            <script src="slick.core.js"></script>
            <script src="plugins/slick.cellrangeselector.js"></script>
            <script src="plugins/slick.cellselectionmodel.js"></script>
            <script src="slick.editors.js"></script>
            <script src="slick.grid.js"></script>
    
    
            <script type="text/javascript">
                var grid;
                var data = [];
                var columns = [
                    {id:"title", name:"Title", field:"title", editor:TextCellEditor},
                    {id:"duration", name:"Duration", field:"duration", editor:TextCellEditor},
                    {id:"%", name:"% Complete", field:"percentComplete", editor:TextCellEditor},
                    {id:"start", name:"Start", field:"start", editor:TextCellEditor},
                    {id:"finish", name:"Finish", field:"finish", editor:TextCellEditor},
                    {id:"effort-driven", name:"Effort Driven", field:"effortDriven", editor:TextCellEditor}
                ];
    
                var options = {
                        editable: true,
                        enableCellNavigation: true,
                        asyncEditorLoading: false,
                        autoEdit: true
                    };
    
                $(function() {
    
                    <?php echo $data ?>
                    grid = new Slick.Grid($("#myGrid"), data, columns, options);
    
                })
    
    
    
            </script>
    
    <form method="POST" action="save_price.php">
        <input type="submit" value="Save">
        <input type="hidden" name="data" value="">
    </form>
    <script type="text/javascript">
      $(function() {
        $("form").submit(
          function() {
            $("input[name='data']").val($.JSON.encode(data));
    
          }
        );
      });
    </script>
    
    </body>
    </html>
    
    0 讨论(0)
提交回复
热议问题