简体   繁体   中英

How to retrieve the contents of PHP page in HTML page?

I'm trying to implement the following architecture using example of finding even/odd number. I'm using client as HTML file and web server as PHP.

简单的 HTTP 请求 在此处输入图片说明

[ "FindEO.html" ] - The HTML file is shown below:

 <!DOCTYPE html> <html> <body> <h3>Check Even/ODD Number</h3> <form method="get" action="http://192.168.0.103:81/DUNNO/eo.php"> Enter number: <input type="text" name="fname"> <input type="submit"> </form> </body> </html>

[ "EO.php" ] - The PHP file is as follows:

<?php
if ($_SERVER["REQUEST_METHOD"] == "GET") {
    $name = $_GET['fname'];
    $num = (int)$name;
    if (($num%2)==0) {
        echo "$name is Even";
    } else {
        echo "$name is Odd!";
    }   
} 
?>

When the HTML file is executed, it ask for input as:

在此处输入图片说明

After clicking on the submit button. The PHP page is displayed rather than showing content of the PHP page inside the HTML file.

[ Currently showing (PHP file): ]

在此处输入图片说明

[ It should show PHP content in HTML File ]

在此处输入图片说明

So, the request is sent from HTML file to PHP server, and instead of getting response from PHP file to HTML file, it is showing directly the PHP file itself.

1) Is this possible to display the expected output. (PHP processed output in HTML file)?

2) Suppose I stored the current PHP code in function as:

<?php
function findeo($num){
    if (($num%2)==0) {
        echo "$name is Even";
    } else {
        echo "$name is Odd!";
    } 
}
if ($_SERVER["REQUEST_METHOD"] == "GET") {
    $name = $_GET['fname'];
    $num = (int)$name;
    findeo($num);
} 
?>

then how to pass parameter (10 or any number to $num variable) and call the findeo() function of the PHP page inside the HTML file?

Someone please help me to implement the client - server architecture or tell me if there as any other way where this architecture can work using HTML as client & PHP as server .

use javascript to send the form to the php file and retrieve the answer. here is how i would have done it:

 function getAnswer(e) { e.preventDefault(); var xhr = new XMLHttpRequest(); xhr.open('GET', 'http://192.168.0.103:81/DUNNO/eo.php', true); xhr.responseType = 'text'; xhr.onload = function () { if (xhr.readyState === xhr.DONE) { if (xhr.status === 200) { document.getElementById('answer').textContent = xhr.response; } } }; xhr.onerror = function() { document.getElementById('answer').textContent = "Error..."; } xhr.send(null); }
 <!DOCTYPE html> <html> <body> <h3>Check Even/ODD Number</h3> <form method="get" onsubmit="getAnswer(event)"> Enter number: <input type="text" name="fname"> <input type="submit"> </form> <div id="answer"></div> </body> </html>

using preventDefault() will stop the page from trying to submit the form, and allow the javascript to perform the request by itself. also, i added a div to your HTML that will hold the respone given by your PHP file.

PHP cannot modify the content of the page after it has been served to the browser. However this would be trivial with a JavaScript Library such as jQuery. or by using AJAX to call the php script to update an element. There are examples on StackOverFlow like: Change DIV content using ajax, php and jQuery

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM