2017-03-21 15 views
0

好吧所以我很忙php代码,当我点击插入按钮,我希望值显示时不重新加载页面。 这里是我的代码:SQL查询插入值,并显示没有重新加载页面

<?php 
$connection = mysqli_connect('localhost', 'root', '', 'universitynew'); 


$sql="SELECT * FROM tblstudent"; 
$student_records=mysqli_query($connection,$sql); 


?> 
<html> 
    <head> 
     <title></title> 
     <link rel="stylesheet" type='text/css' href="bootstrap.min.css" /> 
     <script type='text/javascript' src="bootstrap.min.js"></script> 
     <script type='text/javascript' src="jquery.min.js"></script> 
    </head> 
<body> 
    <a href="Student.php"class="btn btn-primary active" role="button">Student table</a> 
    <a href="Degree.php"class="btn btn-primary" role="button">Degree table</a> 
    <a href="Subject.php"class="btn btn-primary" role="button">Subject table</a> 
    <a href="assessment.php"class="btn btn-primary" role="button">Assessment table</a> 
    <a href="student_assessments.php"class="btn btn-primary" role="button">Student Assessment table</a> 
    <a href="Degree_student.php" class="btn btn-primary" role="button">Student Degree table</a> 
    <a href="Student_Subject.php"class="btn btn-primary" role="button">Student Subject table</a> 
    <hr></hr> 
    <table width="800" border="1" cellpadding="1" cellspacing="1"> 
    <input type="button" name="insertrecords" id="insertrecords" value="Insert Records" /> 
    <span id="success" style="display: none">Successfully Inserted</span> 
    <div id="response"></div> 

    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("#insertrecords").click(function() { 
       $("#success").show(); 
       $.ajax({ 
        url: "insert_student.php", 
        type: 'POST', 
        data: {'action':'submit'}, 
        dataType: 'json', 
        success: function (data) { 
         $("#success").hide(); 
         if(data.status=="true"){ 
          $("#response").html(data.universitynew); 
         }else{ 
          $("#response").html("Error in db query"); 
         } 
        } 
       }); 

      }); 
     }); 
    </script> 
    <h1><a href="insert_student.php".php" class="btn btn-info" role="button">Delete Students</a></h1> 
    <h1><a href="insert_student.php".php" class="btn btn-info" role="button">Update Students</a></h1> 

    <tr> 
    <th>Student ID</th> 
    <th>Student number</th> 
    <th>Student name </th> 
    <th>Student surname</th> 
    <th>Student course</th> 
    </tr> 
    <?php 
    while ($student=mysqli_fetch_assoc($student_records)){ 
     echo"<tr>"; 
     echo"<td>".$student['student_id']."</td>"; 
     echo"<td>".$student['student_number']."</td>"; 
     echo"<td>".$student['student_name']."</td>"; 
     echo"<td>".$student['student_surname']."</td>"; 
     echo"<td>".$student['student_course']."</td>"; 
     echo"</tr>"; 


    } 


    ?> 

我设法做一些jquery和Ajax的,显示成功插入按钮,它并插入到我的数据库我的问题由不重新加载页面显示的表格出现。任何人都可以帮我做到这一点?

+0

你写了一些j查询代码? –

+0

@Ilyaskarim我为按钮做了,但我不知道如何写jQuery来显示更新后的结果,那是我的问题出现的地方 –

回答

0

您可以用show功能jQuery中做到这一点:

$('#success').show(); 

有关详细指导检查:http://api.jquery.com/show/

编辑: 刚刚看到您正在使用的功能,你的问题是,当请求成功时,您使用隐藏,如果失败,则需要使用它。

$("#insertrecords").click(function() { 
    var request = $.ajax({ 
     url: "insert_student.php", 
     type: 'POST', 
     data: {'action':'submit'}, 
     dataType: 'json' 
    }); 
    request.done(function(data){ 
    $("#success").show(); 
    $("#response").html(data.universitynew); 
    }); 
    request.fail(function(error){ 
    $("#response").html("Error in db query"); 
    }); 
} 
0

当AJAX变得完成你需要证明#success element.The元件通过CSS display属性隐藏的价值none。你可以简单的显示属性更改为block所以这将是对阿贾克斯的成功可见:

$('#success').css("display","block"); 

您还可以通过jQuery的show()功能显示元素

$('#success').show(); 

你可以找到更多在这里:http://api.jquery.com/css/

编辑:

$.ajax({ 
    url: '/path/to/file', 
    type: 'default GET (Other values: POST)', 
    dataType: 'default: Intelligent Guess (Other values: xml, json, script, or html)', 
    data: {param1: 'value1'}, 
}) 
.done(function() { 
    $("#success").show(); // this will show the message 
    ... 
}) 
.fail(function() { 
    ... 
}); 
相关问题