如何根据用户输入使用PHP和AJAX从XML中提取数据


How to extract data from XML using PHP and AJAX based on user input?

我有一个表单,用户在其中输入6个数字,然后将这些数字与xml文档中包含的数字进行比较。我在PHP中使用了SimpleXML将输入的数字与xml文档中存储的数字进行比较,然后从xml中回显相应的日期。这是正确的。

我现在尝试使用AJAX在结果显示之前显示一个加载屏幕。提交表单后,将显示加载屏幕,但不会显示结果。

如何显示结果?

这是形式:

<form id="numbers_form" method="post" action="index.php" ajax="true">
        <div class="col-lg-2 col-md-2 numbers">
            <input class="num_input" type="number" name="num1" id="num1" required >
        </div>
        <div class="col-lg-2 col-md-2 numbers">
            <input class="num_input" type="number" name="num2" id="num2" required >
        </div>  
        <div class="col-lg-2 col-md-2 numbers">
            <input class="num_input" type="number" name="num3" id="num3" required >
        </div>
        <div class="col-lg-2 col-md-2 numbers">
            <input class="num_input" type="number" name="num4" id="num4" required >
        </div>
        <div class="col-lg-2 col-md-2 numbers">
            <input class="num_input" type="number" name="num5" id="num5" required >
        </div>
        <div class="col-lg-2 col-md-2 numbers">
            <input class="num_input" type="number" name="num6" id="num6" required >
        </div>
        <div class="input-button">
            <input class="submit" type="submit" value="Show me the money" name="submit">
        </div>
        <div class="img">
            <img id="loader" src="images/loader.gif" alt="loading image">
        </div>
</form>

这是我的php:

$num1 = $_POST['num1'];
$num2 = $_POST['num2'];
$num3 = $_POST['num3'];
$num4 = $_POST['num4'];
$num5 = $_POST['num5'];
$num6 = $_POST['num6'];
$xml = simplexml_load_file('lottery.xml') or die("Error: Cannot create object");
if(isset($_POST['num1'])&& isset($_POST['num2'])&& isset($_POST['num3']))
{
foreach($xml->children() as $record) 
    { // for every record node
        if($record->num1 == $num1 && $record->num2 == $num2 && $record->num3 == $num3 && $record->num4 == $num4 && $record->num5 == $num5 && $record->num6 == $num6)
     {
           echo 
           "<div class='success'>
           <h1>".$record->date."</h1>
           </div>";
     }
   }    
}

这是AJAX:

$(function() {  
    $(".submit").click(function() {  
    var num1 = $("#num1").val();  
    var num2 = $("#num2").val(); 
    var num3 = $("#num3").val();  
    var num4 = $("#num4").val(); 
    var num5 = $("#num5").val();  
    var num6 = $("#num6").val();  
    var dataString  = 'num1='+ num1 + '&num2=' + num2 + '&num3=' + num3 + '&num4=' + num4 + '&num5=' + num5 + '&num6=' + num6;  
    if(num1=='' || num2=='')  
    {   
    $('.error').fadeOut(200).show();  
    }  
    else  
    {  
    $.ajax({  
    type: "POST",  
    url: "index.php",  
    data: dataString,  
    data:jQuery('#numbers_form').serializeArray(),
        beforeSend: function(){
        $('#loader').css('display','block');
        },
            success: function(res){
            $('#loader').css('display','none');
            }
    });  
    }  
    return false;  
    });  
    });

删除ajax调用下方的行return false;