Html onclick似乎不适用于echo PhP

时间:2015-05-05 12:57:43

标签: php jquery html mysql ajax

我是PHP的初学者。基本上我试图在表的行中添加一个名为“delete”的按钮。但是:

  1. 按钮名称即使我将其命名为“删除”,它仍显示为“提交”
  2. onclick函数似乎不适用于echo。(我已经看过其他方法,但似乎不理解或与我打算做的事情相匹配)
  3. 感谢您提供任何帮助或建议。

    更新:我已经修复了问题1.但是当我按下任何帮助时,我无法获得问题2 onClick功能删除任何表数据。

    更新1:Admin.php代码

     <!DOCTYPE html>
     <html>
    <head> <!--inseart script here -->
        <script type= "text/javascript" src="js/jquery.js"></script>  <!-- jquery script -->
        <script type= "text/javascript" src="js/func_submit_msg.js"></script> 
    </head>
    
    <body>
        Message: <input type="text" name="message" id= "message_form"><br> <!-- br break new line -->
    
    
        <input type="submit" id= "submit_form" onclick = "submit_msg()">
    
        <div id="result"></div>
    
    
        <table border= "1" style="width: 100%">
            <!--create top table -->
            <tr> <!--tr defines a row --> <!-- define row 1 -->
                <th> No </th> <!-- th defines a header cell--> 
                <th> messages </th>
                <th> action </th>
            </tr>
             <!-- row 2 : display results onwards and creates dynamically -->   
            <!-- input fields at the bottom -->
    
    
                <?php
                    include "connect.php";
                    $get_data2admin = $db->query("SELECT ID,message FROM test_table_1");
    
    
                    if( $get_data2admin->num_rows >0 ){ //if selected rows is more than zero
                        while($row_msg = $get_data2admin->fetch_assoc()){
                            //insert html tag table inside echo
    
                            echo "<tr>";
                            echo "<td></td>";
                            echo "<td>".$row_msg['message']. "</td>";
                            echo "<td>"."<input  type='submit' name='delete' id='delete_row' value='Delete' onClick='Delete()'>"."</td>"; //new updated line
    
    
                            echo "</tr>";
                        }
                    }
    
                ?>
        </table>
      </body>
    </html>
    

    更新1:func_submit_msg.js(可能会将此文件重命名为global.js以避免混淆)

    //this is a function file to submit message to database, use include before calling function
    
    $(document).ready(function(){
    
      $('#submit_form').on('click', function(e){
    e.preventDefault();
    message_form = $('#message_form').val();
    
    $.ajax({
        type: "POST",
        url: "submit_data.php",
        data: {message: message_form},
            success: function(data) {
              $('#result').html(data);
            },
            error:function(err){
               //handle your error
               alert('did not work');
            }
        });
      });
    
      $function Delete() {
    $('input[name="delete"]').on('click', function(e){
      e.preventDefault();
      var show_id=$(this).attr('id') //to grab id of element
    
      if(confirm("Are you sure you wish to delete")){
      $.ajax({
          type: "POST",
          url: "delete.php",
          data: {show_id},
            success: function() {
    
            },
            error:function(err){
               //handle your error
               alert('did not work');
            }
          });
    });
    });
    });
    });
    

    原始讯息:

    主按钮代码与onclick函数一起位于admin.php页面中:

    admin.php的

     <!DOCTYPE html>
    <html>
    <head> <!--inseart script here -->
        <script type= "text/javascript" src="js/jquery.js"></script>  <!-- jQuery script -->
        <script type= "text/javascript" src="js/func_submit_msg.js"></script> 
    </head>
    
    <body>
        Message: <input type="text" name="message" id= "message_form"><br> <!-- br break new line -->
    
    
        <input type="submit" id= "submit_form" onclick = "submit_msg()">
    
        <div id="result"></div>
    
    
        <table border= "1" style="width: 100%">
            <!--create top table -->
            <tr> <!--tr defines a row --> <!-- define row 1 -->
                <th> No </th> <!-- th defines a header cell--> 
                <th> messages </th>
                <th> action </th>
            </tr>
             <!-- row 2 : display results onwards and creates dynamically -->   
            <!-- input fields at the bottom -->
    
    
                <?php
                    include "connect.php";
                    $get_data2admin = $db->query("SELECT ID,message FROM test_table_1");
    
    
                    if( $get_data2admin->num_rows >0 ){ //if selected rows is more than zero
                        while($row_msg = $get_data2admin->fetch_assoc()){
                            //insert html tag table inside echo
    
                            echo "<tr>";
                            echo "<td></td>";
                            echo "<td>".$row_msg['message']. "</td>";
                            echo "<td>"."<input  type='submit' name='delete' id='delete_row' onclick =' '>"."</td>"; //in this scenario the indents ' and " matters
    
                            echo "</tr>";
                        }
                    }
    
                ?>
        </table>
    
    </body>
    

    以下是名为func_submit_msg.js的javascript文件,它具有ajax删除功能(代码的第二个功能)

    //this is a function file to submit message to database, use include     before calling function
    
    $(document).ready(function(){
    
    $('#submit_form').on('click', function(e){
    e.preventDefault();
    message_form = $('#message_form').val();
    
    $.ajax({
        type: "POST",
        url: "submit_data.php",
        data: {message: message_form},
            success: function(data) {
              $('#result').html(data);
            },
            error:function(err){
               //handle your error
               alert('did not work');
            }
        });
      });
    
    
    
    
    $('#delete_row').on('click', function(e){
    e.preventDefault();
    var show_id=this.id //to grab id of element
    
    if(confirm("Are you sure you wish to delete")){
    $.ajax({
        type: "POST",
        url: "delete.php",
        data: {show_id},
            success: function() {
    
            },
            error:function(err){
               //handle your error
               alert('did not work');
            }
        });
      });
    });
    

    一个delete.php文件,假设按id元素删除行

    <?php
    include "connect.php";
    
    if($_POST['show_id'])
    {
        $delete_id=$db->query("DELETE FROM test_table_1 WHERE ID='$show_id'");
    }
    
    if ($insert_data === TRUE ){
    echo "Delete successfully";
    } else {
    echo "Error delete: " . $insert_data . "<br>" . $db->error;
    }
    
    $db->close();
    ?>
    

3 个答案:

答案 0 :(得分:1)

对于第1点:

<input  type='submit' name='delete' id='delete_row' onclick ='Delete(<?php echo $row_msg['id']?>)' value="Delete">

对于第2点:

<input  type='submit' name='delete' id='delete_row' onclick ='Delete(<?php echo $row_msg['id']?>)'>

答案 1 :(得分:0)

1.像这样改变删除按钮

<input  type='submit' name='delete' id='delete_row' onclick ='Delete(<?php echo $row_msg['id']?>)'>
  1. 假设你有任何唯一ID,所以我在onclick函数中提到如果你有其他名字就改变它

    function Delete(id)
    {
        var x = confirm("Are you sure you want to delete?");
        if(x)
        {
    
     $.ajax({
    type: "POST",
    url: "delete.php",
    data: {id:id},
    success: function() {
    
    },
    error:function(err){
       //handle your error
       alert('did not work');
    }
    });
     });
        }
    

答案 2 :(得分:0)

从SQL结果中将唯一ID作为ID,并将删除行的jQuery代码用作:

$('input[name="delete"]').on('click', function(e){
    e.preventDefault();
    var show_id=$(this).attr('id');
    //...
});

我希望这能解决问题。