我想将数据发送到php文件进行处理,并使用ajax接收响应,而无需刷新页面

问题描述 投票:0回答:1

我想从xml文件中读取并打印标签属性名称,并使用ajax将其打印在屏幕上。我在file_controller.php文件中编写的代码在打印属性名称时效果很好,但ajax无法获取打印出来的数据保存在数据数组中。请大家帮我解决这个问题。数据库文件,xml文件都很好。它只是问题的ajax调用。在此先感谢

这是我的index.php代码,用于接收数据

<?php 
require('connect.php'); 
?>



<html>
<head>
    <title>Bellcom Test</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

</head>
<body>
    <div class="container">
        <div class="row">
            <div class="col-md-9" style="margin:0 auto; float:none;">
                <span id="message"></span>

                    <div class="form-group">
                        <label>Upload files</label>
                        <input type="file" name="file" id="file">
                    </div>
                    <br>
                    <div class ="form-group">
                        <label>Search for a File Number</label>
                        <input type="text" id="file_name" name="file_name">
                    </div>
                    <br>
                    <div class="form-group">
                        <button type="button" name="submit" id="submit" class="btn btn-info" >Fetch</button>
                    </div>

                <div class="table-responsive" id="display" style="display:none">
                    <table class="table table-bordered">
                        <tr>
                            <td width="10%" align="right"><b>Attribute Name</b></td>
                            <td width="90%"><span id="name"></span></td>
                        </tr>

                         <tr>
                            <td width="10%" align="right"><b>System ID</b></td>
                            <td width="90%"><span id="sysid"></span></td>
                         </tr>
                         <tr>
                            <td width="10%" align="right"><b>Date</b></td>
                            <td width="90%"><span id="date"></span></td>
                         </tr>
                    </table>
                </div>
            </div>

        </div>
    </div>
</body>
</html>

<script>
    $(document).ready(function(){ 
        $('#submit').click(function(){
            var id= $('#file_name').val();
                  if(id != '')
                  {
                    $.ajax({ 
                        url:"file_controller.php",
                        type: "POST",
                        data:{id:id},
                        dataType:"JSON",
                        success:function(data)
                            {
                                 $('#meeting_details').css("display", "block");
                                 $('#name').text(data.name);
                                 $('#sysid').text(data.sysid);
                                 $('#date').text(data.date);
                            },
                        error: function (data) {
                          alert("data is not received");
                        }
                    })
                  }else{
                    alert("Please Select a file");
                    $('#meeting_details').css("display", "none");
                  }
        });
    });
</script>

这是我的用于处理数据的php文件。

<?php 

require('connect.php'); 

    $f_name = "";


    if (isset($_POST['id'])) {
        $f_name = strip_tags($_POST['id']);//remvove html tags
        $f_name = str_replace(' ', '', $f_name);//remove spaces
        $f_name = strtolower($f_name);//lower case
        $arr = array('XML_','.xml');
        $f_name = implode("$f_name",$arr);

        $database_file = mysqli_query($conn,"SELECT * FROM xml_files WHERE file_name='$f_name'");
        $row = mysqli_fetch_array($database_file);
        $database_file_name=$row['file_name'];



        if (file_exists("files/$database_file_name")) {
            $xml=simplexml_load_file("$database_file_name") or die("Error: Cannot create object");


            foreach ($xml->children() as $node) {
                foreach ($node->children() as $nodechild) {
                    foreach ($nodechild->children() as $nodegrandchild){
                        $arr = $nodegrandchild->attributes();   // returns an array

                        if (!empty($arr["name"])) {
                            $data['name'] = $arr["name"];   //save the attribute name in an array format 
                            print ("name=".$arr["name"]);     // get the value of this attribute
                            print ("<br>");
                            print ("<p><hr>");
                        }
                        if (!empty($arr["sysid"])) {
                            $data['sysid'] = $arr["sysid"];
                            print ("sysid=".$arr["sysid"]);
                            print ("<br>");
                            print ("<p><hr>");
                        }
                         if (!empty($arr["date"])) {
                            $data['date'] = $arr["date"];
                            print ("date=".$arr["date"]);
                            print ("<br>");                 
                            print ("<p><hr>");
                        }
                    }
                }
            }
        }
    echo json_encode($data);
    }       
 ?>
javascript php json ajax xml
1个回答
0
投票
尝试添加event.preventDefault()

$('#submit').click(function(event){ event.preventDefault()

© www.soinside.com 2019 - 2024. All rights reserved.