可编辑的动态PHP表

时间:2013-09-08 02:52:00

标签: php javascript jquery mysql

我正在动态创建一个可编辑的表。它效果很好,也许对我需要的东西来说太好了。使用我的表格,我有一个编辑列,每行都有一个更改按钮,并在表格的末尾自动创建。您必须单击行上的更改按钮进行编辑。我想摆脱编辑按钮/列(这样用户可以单击单元格按钮,它将始终是可编辑的)并将其转到用户只能编辑分配给它们的行的位置ID。此外,我无法弄清楚如何创建一个单击单元格按钮时弹出的框,用户将在弹出框中有选项,当用户选择该选项时,它会将数据加载到单元格。  感谢您提供的任何帮助。

 <?php 
 session_start();
 $tbvbr= $_SESSION['gamecode'];
 $pn = $_POST['playername'];

 function stripslashes2( $string ) 
{ 
if ( get_magic_quotes_gpc() ) { 
    return stripslashes( $string ); 
} else { 
    return $string; 
}  
}  

function display_db_query( $tablename, $header_bool , $border ) 
{  
// find out the number of columns in result 
$result = mysql_query( "SHOW FIELDS FROM $tablename" ); 
while ( $row = mysql_fetch_assoc( $result ) ) { 
    if ( $row['Key'] == "PRI" ) 
        $primarykey = $row['Field']; 
    else 
        $field[$row['Field']] = array( $row['Type'] ); 
}  

if ( isset( $_POST["update$tablename"] ) ) { 
    $sql = sprintf( "update $tablename SET " ); 
    $sqlfields = array(); 

    foreach( $field AS $k => $v ) { 
        if ( !empty( $_POST["edit"][$k] ) ) 
            $sqlfields[] = "$k='" . mysql_real_escape_string( stripslashes2(             $_POST["edit"][$k] ) ) . "'"; 
        else 
            $sqlfields[] = "$k = NULL "; 
    }  
    if ( count( $sqlfields ) > 0 ) { 
        $sql .= implode( " , " , $sqlfields ) . " WHERE $primarykey=" . intval(  $_POST["updateid"] ) ; 

    mysql_query( $sql ) OR DIE( mysql_error() ); 
    if ( mysql_affected_rows() > 0 ) 
        print "Updated succesfully<br />"; 
    }  
    else 
    echo "No change<br />"; 
}  
// perform the database query 
$result_id = mysql_query( "SELECT * from $tablename" ) 
or die( "display_db_query:" . mysql_error() ); 

if ( $header_bool ) { 
    echo "<table width='850' $border align='center' cellpadding='5' cellspacing='1'    class='entryTable'>"; 
    echo "<tr class='entryTableHeader'>"; 
    foreach( $field AS $k => $v ) 
    print( "<td><center><b>$k</b></center></td>" ); 

    print( "<td><center><b>Edit</b></center></td> 
    </tr>\n" ); 
    } else 
    echo "<table width='850' $border align='center' cellpadding='5' cellspacing='1'   class='entryTable'> "; 

while ( $row = mysql_fetch_assoc( $result_id ) ) { 
    print( "<tr>" ); 
    if ( isset( $_GET["editmode"] ) AND $_GET["editmode"] == $row[$primarykey] ) { 
        $editmodeison = true; 
        echo "<form method=\"post\" action=\"{$_SERVER["PHP_SELF"]}\">"; 
    } else 
        $editmodeison = false; 

    foreach( $field AS $k => $v ) { 
        if ( $editmodeison ) 
            print( "<td class='content' align='center'><input type=\"button\"  name=\"edit[$k]\" value=\"" . ( !empty( $row[$k] )?htmlspecialchars( $row[$k] ) : htmlspecialchars( '' ) ) . "\" /></td>\n" ); 
        else 
            print( "<td class='content' align='center'>" . ( !empty( $row[$k] )?htmlspecialchars( $row[$k] ) : htmlspecialchars( 'change' ) ) . "</td>\n" ); 
    }  

    if ( $editmodeison ) 
        print( "<td class='content' align='center'><input type=\"hidden\" name=\"updateid\" value=\"{$row[$primarykey]}\"><input type=\"submit\" name=\"update$tablename\" value=\"update\"></form></td>\n" ); 
    else 

        print( "<td class='content' align='center'><a href=\"{$_SERVER["PHP_SELF"]}?   editmode=" . $row[$primarykey] . "\">change</a></td>\n" ); 

    print( "</tr>\n" ); 
}  
print( "</table>\n" ); 
}  

 ?> 
 <HTML><HEAD><TITLE>Products Orderable table</TITLE></HEAD> 
 <BODY> 
 <TABLE><TR><TD> 
 <?php 

 /* DB info  */ 
$dbhost = "localhost"; 
$dbuser = "placeholder"; 
$dbpass = "placeholder"; 
$dbname = "placeholder"; 
mysql_connect( $dbhost, $dbuser, $dbpass ) or die ( "Unable to connect to MySQL server" ); 
mysql_select_db( "$dbname" ); 
mysql_query( "SET NAMES utf8" ); 

$table = $tbvbr; 

display_db_query( $table, // $global_dbh, 
true, "border='2'" ); 

 ?> 
</TD></TR></TABLE></BODY></HTML>

2 个答案:

答案 0 :(得分:0)

您也可以使用HTML5内容编辑。这是一个简单的fiddle说明它。

dom.contentEditable = true;

设置它并且可以编辑任何DOM对象。您可能可以使用click事件来启用或禁用内容可编辑属性。

答案 1 :(得分:0)

回答我自己提出的问题

    if ( $editmodeison ) 
        print( "<td class='content' align='center'><input type=\"hidden\" name=\"updateid\" value=\"{$row[$primarykey]}\"><input type=\"submit\" name=\"update$tablename\" value=\"update\"></form></td>\n" ); 
     else 

        print( "<td class='content' align='center'><a href=\"{$_SERVER["PHP_SELF"]}?editmode=" . $row[$primarykey] . "\">change</a></td>\n" ); 

我设置了

 $_GET["editmode"] 

指向分配给用户的变量ID。

我还使用了以下Javascript

   <script type="text/javascript">
 function reply_click(clicked_name)
 {
var clicked_name;
document.location="http://www.localhost.com/update.php?location=" + clicked_name;

  }
  </script>