Link to home
Start Free TrialLog in
Avatar of Peter Chan
Peter ChanFlag for Hong Kong

asked on

Adjust to code

Hi,
I want to have 2 more separate lines between word "Logon Page" and user name below. How to adjust it? How to also center "Logon Page" on the line?

        <div class="container" style="background:url('./pict/ID-10028343.jpg');border: 0px solid green;background-color: C9D3DD;background-size: cover;background-repeat: no-repeat;width:1200px;height:800px;font-family:Verdana;font-size:14px;">
          <form action="page.php" method="POST">
          <div class="row" style="border: 0px solid red;">
                <div class="col" style="border: 0px solid blue;"></div>
                <div class="col"></div>
                <div class="col text-center" style="border: 0px solid orange;foreground-color: 848484;font-size:18px;"><b>Logon Page</b></div>
                <div class="col"></div>

                <div class="col" style="border: 0px solid blue;"></div>
                <div class="col text-right" style="border: 0px solid orange;"><b>Username:</b></div>
                <div class="col" style="border: 0px solid yellow;"><input type="text" name="username" style="background-color: white;" /></div>
                <div class="col"></div>

                <div class="w-100"></div>

                <div class="col" style="border: 0px solid blue;"></div>
                <div class="col text-right" style="border: 0px solid orange;"><b>Password:</b></div>
                <div class="col" style="border: 0px solid yellow;"><input type="password" name="password" style="background-color: white;" /></div>
                <div class="col"></div>

                <div class="w-100"></div>
                <div class="col text-center" style="border: 0px solid blue;"><input type="submit" value="Login" style="background-color: 848484;"></div>
          </div>
      </form>
        </div>

Open in new window

Avatar of Ryan Chong
Ryan Chong
Flag of Singapore image

does something like this looks better for you?

<div class="container medium"
            style="background:url('./pict/ID-10028343.jpg');border: 0px solid green;background-color: C9D3DD;background-size: cover;background-repeat: no-repeat;font-family:Verdana;font-size:14px;">
            <header>
                <h2>Logon Page</h2>
            </header>
            <div class="row">
                <form action="page.php" method="POST">
                    <div class="row" style="border: 0px solid red;">
                        <div class="col-6 text-right" style="border: 0px solid orange;"><b>Username:</b></div>
                        <div class="col-6" style="border: 0px solid yellow;"><input type="text" name="username"
                                style="background-color: white;" /></div>
                        <div class="col-6 text-right" style="border: 0px solid orange;"><b>Password:</b></div>
                        <div class="col-6" style="border: 0px solid yellow;"><input type="password" name="password"
                                style="background-color: white;" /></div>
                        <div class="col-6 text-center" style="border: 0px solid blue;"><input type="submit" value="Login"
                                style="background-color: 848484;"></div>
                    </div>
                </form>
            </div>
        </div>

Open in new window

Avatar of Peter Chan

ASKER

Thanks. Value is initialized below:

<?php
    $hdr1 = "Logon Page";

Open in new window

But I cannot show the value of Label below. Why?

<body>
        <div class="container" style="background:url('./pict/ID-10028343.jpg');border: 0px solid green;background-color: C9D3DD;background-size: cover;background-repeat: no-repeat;width:1200px;height:800px;font-family:Verdana;font-size:14px;">
          <form action="page.php" method="POST">
			<div class="col text-center" style="border: 0px solid blue;">
				<header>
					<h2><label><?php echo $hdr1; ?></label></h2>
				</header>
			</div>
			...

Open in new window

But I cannot show the value of Label below. Why?

your syntax looks good to me and it should worked.

try check what's the value of $hdr1 just before the echo? You can also verify the HTML code to see what's the output.
I try to write it out below but I cannot see its value.

					<h2><label><?php document.write($hdr1);echo $hdr1; ?></label></h2>

Open in new window

what's the output of:

<h2><label><?php document.write($hdr1);echo $hdr1; ?></label></h2>

?
I see no value is shown on Html page.
what if you running this alone?

$hdr1 = "Logon Page";

Open in new window


....

then

    echo "<h2><label>|$hdr1|</label></h2>";

Open in new window

Sorry to that I got the following on Html page
User generated image
Sorry to that I got the following on Html page

it seems like your PHP is not running at all.

are you trying to do this in IIS? have you configured it correctly?

can you also run this?

<?php

// Show all information, defaults to INFO_ALL
phpinfo();

?>

Open in new window

Hi,
I adjusted PHP like
<?php
    $hdr1 = "Logon Page";
    phpinfo();
    ...
<body>
        <div class="container" style="background:url('./pict/ID-10028343.jpg');border: 0px solid green;background-color: C9D3DD;background-size: cover;background-repeat: no-repeat;width:1200px;height:800px;font-family:Verdana;font-size:14px;">
          <form action="page.php" method="POST">
			<div class="col text-center" style="border: 0px solid blue;">
				<header>
					<h2><label><?php echo $hdr1; ?></label></h2>
				</header>
			</div>
			...
			

Open in new window

but still see no values (pressing Clt-F5 to refresh page) shown.
are you running php in IIS or Apache HTTP server, etc?

what if you just running below?

<?php

$hdr1 = "world";

echo "hello";
echo $hdr1;

?>

Open in new window


will you get:

helloworld

Open in new window


?
It is Apache Http server. PHP file did ever work fine. I tried your advice but no help.

Any other help, to error below
Uncaught ReferenceError: echo is not defined
    at event0 ((index):19)
    at onload ((index):23)
owing to these codes (echo is line 19, and onload is line 23)?    
  <script>
  	function event0() {
		$hdr1 = "Logon Page";
		echo("Hello");
  	}
  </script>
</head>
<body onload="event0()">

Open in new window

Any other help?
you messed up the php with javascript, something like this should worked:

<html>

<head>
    <script>
    function event0() {
        <?php
        $hdr1 = "Logon Page";
        echo "var hdr1 = '$hdr1';";
        echo "alert(hdr1);";
        ?>
    }
    </script>
</head>

<body onload="event0()">
    <?php echo("Hello"); ?>
</body>

</html>

Open in new window

I don't run php in Apache Http server these days, so can't really help in this part. I run php in IIS.
Please help, to error below
(index):18 Uncaught SyntaxError: Unexpected token '<'
(index):26 Uncaught ReferenceError: event0 is not defined
    at onload ((index):26)
/favicon.ico:1 Failed to load resource: the server responded with a status
for these codes:

Line 18        <?php
        $hdr1 = "Logon Page";
        echo "var hdr1 = '$hdr1';";
        echo "alert(hdr1);";
        ?>
  	}
  </script>
</head>
Line 26<body onload="event0()">

Open in new window

you forgot to define function event0() ?

pls try as what I have posted:

<html>

<head>
    <script>
    function event0() {
        <?php
        $hdr1 = "Logon Page";
        echo "var hdr1 = '$hdr1';";
        echo "alert(hdr1);";
        ?>
    }
    </script>
</head>

<body onload="event0()">
    <?php echo("Hello"); ?>
</body>

</html>
I still get same error by putting your codes. Here is my codes
<html>
<head>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
  <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
    <style>
        input {
            background-color: F0F08B;
            width: 200px;
        }
        div {
            margin:10px auto;
        }
    </style>
  <script>
  	function event0() {
        <?php
        $hdr1 = "Logon Page";
        echo "var hdr1 = '$hdr1';";
        echo "alert(hdr1);";
        ?>
  	}
  </script>
</head>
<body onload="event0()">
    <?php echo("Hello"); ?>
        <div class="container" style="background:url('./pict/ID-10028343.jpg');border: 0px solid green;background-color: C9D3DD;background-size: cover;background-repeat: no-repeat;width:1200px;height:800px;font-family:Verdana;font-size:14px;">
          <form action="page.php" method="POST">
			<div class="col text-center" style="border: 0px solid blue;">
				<header>
					<h2><label><?php echo $hdr1; ?></label></h2>
				</header>
			</div>
          <div class="row" style="border: 0px solid red;">
                <div class="col" style="border: 0px solid blue;"></div>
                <div class="col text-right" style="border: 0px solid orange;"><b>Username:</b></div>
                <div class="col" style="border: 0px solid yellow;"><input type="text" name="username" style="background-color: white;" /></div>
                <div class="col"></div>

                <div class="w-100"></div>

                <div class="col" style="border: 0px solid blue;"></div>
                <div class="col text-right" style="border: 0px solid orange;"><b>Password:</b></div>
                <div class="col" style="border: 0px solid yellow;"><input type="password" name="password" style="background-color: white;" /></div>
                <div class="col"></div>

                <div class="w-100"></div>
                <div class="col text-center" style="border: 0px solid blue;"><input type="submit" value="Login" style="background-color: 848484;foreground-color: 0404B4;"></div>
          </div>
      </form>
        </div>
    </body>
</html>

Open in new window

I will need to test it after work today as I don't have php running with me right now.
Thanks a lot. Would appreciate to your further check!
I tested the last codes you posted and it's working fine in my local machine's IIS.

User generated image
so I guess it could be something wrong in the configuration for your Apache HTTP server?
Thanks. What can be the reason with Apache HTTP server? It did work with PHP code.
do you have the URL so that we can debug for you?

or if it's possible, share the generated HTML so we can do the debug as well?
Hi,
You can refer to

http://113.255.249.225
did you name the page as index.php ? or do you have index.html in your root folder as well?

it seems that it can't interpret php codes in index.php
Hi,
I removed index.php file but any idea to error below?

Uncaught SyntaxError: Unexpected token '<'
(index):26 Uncaught ReferenceError: event0 is not defined
    at onload ((index):26)
/favicon.ico:1 Failed to load resource: the server responded with a status of 404 (Not Found)
I removed index.php file but any idea to error below?

so you hitting that error and you got an index.html ?

Uncaught SyntaxError: Unexpected token '<' (index):26 Uncaught ReferenceError: event0 is not defined

if it's a html file, you can't put php codes inside as it won't run at all.
It is running index.html.

What to adjust below?
  <script>
  	function event0() {
        <?php
        $hdr1 = "Logon Page";
        echo "var hdr1 = '$hdr1';";
        echo "alert(hdr1);";
        ?>
  	}
  </script>
</head>
<body onload="event0()">
    <?php echo("Hello"); ?>

Open in new window

as mentioned, if it's index.html, it cannot run php.

so change it to:

  <script>
  	function event0() {
        var hdr1 = "Logon Page";
        alert(hdr1);
  	}
  </script>
</head>
<body onload="event0()">
    <script> document.write("Hello"); </script>

Open in new window


if you only got index.php, this should worked:

  <script>
  	function event0() {
        <?php
        $hdr1 = "Logon Page";
        echo "var hdr1 = '$hdr1';";
        echo "alert(hdr1);";
        ?>
  	}
  </script>
</head>
<body onload="event0()">
    <?php echo("Hello"); ?>

Open in new window

Thanks. How to show (or adjust) value of hdr1 below?
  <script>
  	function event0() {
        var hdr1 = "Logon Page";
        //alert(hdr1);
  	}
  </script>
</head>
<body onload="event0()">
        <div class="container" style="background:url('./pict/ID-10028343.jpg');border: 0px solid green;background-color: C9D3DD;background-size: cover;background-repeat: no-repeat;width:1200px;height:800px;font-family:Verdana;font-size:14px;">
          <form action="page.php" method="POST">
			<div class="col text-center" style="border: 0px solid blue;">
				<header>
					<h2><label>hdr1</label></h2>
				</header>

Open in new window

you can simply try this:

like:

<script>
        function event0() {
            var hdr1 = "Logon Page";
            document.getElementById("yourHeader").innerHTML = hdr1;
        }
    </script>

Open in new window


then:

<h2><label id="yourHeader">hdr1</label></h2>

Open in new window

Thanks a lot. How to move code of event0 to another php file?
How to move code of event0 to another php file?

Well, if you defined event0 as a Javascript function, you can treat it as simple as copy and paste to another file, regarding it's a HTML or PHP.

when you try to test it out, you can go to browser's Inspect for debugging when it's necessary.
I moved the event to page.php file like
<?php
        function event0() {
            var hdr1 = "Logon Page";
            document.getElementById("hdr0").innerHTML = hdr1;
        }

    $dbconn3 = pg_connect("host=sheep port=5432 dbname=mary user=lamb password=foo");
    if ($_SERVER['REQUEST_METHOD'] === 'POST')
    {
        var_dump($_PSOT);
        //Do stuff...
        //Write results to session
        session_start();
        $_SESSION['stuff'] = $something;
        //You can store stuff such as the user ID, so you can remeember him.
        //redirect:
        header('Location: ', true, 303);
        //The redirection will cause the browser to request with GET
        //The results of the operation are in the session variable
        //It has empty location because we are redirecting to the same page
        //Otherwise use `header('Location: anotherpage.php', true, 303);`
        exit();
    }
    else
    {
        //You could assume you got a GET
        var_dump($_GET); //Use this to see what info we got!
        //Get stuff from session
        session_start();
        if (array_key_exists('stuff', $_SESSION))
        {
           $something = $_SESSION['stuff'];
           //we got stuff
           //later use present the results of the operation to the user.
        }
        //clear stuff from session:
        unset($_SESSION['stuff']);
        //set headers
        header('Content-Type: text/html; charset=utf-8');
        //This header is telling the browser what are we sending.
        //And it says we are sending HTML in UTF-8 encoding
    }
 ?>

Open in new window

but it is not OK to show Header properly.
ASKER CERTIFIED SOLUTION
Avatar of Ryan Chong
Ryan Chong
Flag of Singapore image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
event0 is in page.php and this is reason that it can not be fired, right?

Have you checked the browser's Inspect and if there's any error? If the Javascript function event0 placed correctly in the page, it should be called.

Where to put other php file (having event0 inside)?

You can put it within the Head tag, or at the bottom of your page.

It's fine if you defined and make it as an included file, just include it when it's necessary.
With code below

<body action="code0.php" onload="event0()">
        <div class="container" style="background:url('./pict/ID-10028343.jpg');border: 0px solid green;background-color: C9D3DD;background-size: cover;background-repeat: no-repeat;width:1200px;height:800px;font-family:Verdana;font-size:14px;">
          <form action="page.php" method="POST">
			<div class="col text-center" style="border: 0px solid blue;">
				<header>
					<h2><label id="hdr0">hdr1</label></h2>
				</header>

Open in new window


Here is code0.php

    <script>
        function event0() {
            var hdr1 = "Logon Page";
            document.getElementById("hdr0").innerHTML = hdr1;
        }
    </script>

Open in new window

but header cannot be shown properly. Why?
The last codes posted look ok.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm3.aspx.cs" Inherits="WebApplication1.WebForm3" %>

<html>
<head>
    <script>
        function event0() {
            var hdr1 = "Logon Page hello world";
            document.getElementById("hdr0").innerHTML = hdr1;
        }
    </script>

</head>

<body action="code0.php" onload="event0()">
    <div class="container" style="background: url('./pict/ID-10028343.jpg'); border: 0px solid green; background-color: C9D3DD; background-size: cover; background-repeat: no-repeat; width: 1200px; height: 800px; font-family: Verdana; font-size: 14px;">
        <form action="page.php" method="POST">
            <div class="col text-center" style="border: 0px solid blue;">
                <header>
                    <h2>
                        <label id="hdr0">hdr1</label></h2>
                </header>
            </div>
        </form>
    </div>


</body>
</html>

Open in new window


User generated image
have you cleared the browser's cache and re-try?

sometimes it doesn't work just because we missed out this simple step.
Sorry, one last thing.

Can we put code below into a php file?

  <script>
        function event0() {
            var hdr1 = "Logon Page";
            document.getElementById("hdr0").innerHTML = hdr1;
        }
  </script>

Open in new window

I tried it like

<body action="code0.php" onload="event0()">

Open in new window


while code0.php is having

    <script>
        function event0() {
            var hdr1 = "Logon Page";
            document.getElementById("hdr0").innerHTML = hdr1;
        }
    </script>

Open in new window

inside.

but it does not work as expected, even if I've refreshed/cleared everything. Why?
<body action="code0.php" onload="event0()">

I below the "action" attribute is only for the use in Form tag.

Are you trying to load another php file into a php file?

if yes, try use function include or include_once:

https://www.php.net/manual/en/function.include.php

https://www.php.net/manual/en/function.include-once.php
Good day Ryan,
One doubt is, regarding Javascript event below

  <script>
        function event0() {
            var hdr1 = "Logon Page";
            document.getElementById("hdr0").innerHTML = hdr1;
        }
  </script>

Open in new window


I expect to make it a PHP event. How?
do you mean a PHP function or PHP event?

for web page interaction, it should be a javascript event. I didn't recall if there's any php event at server end.
PHP Function.

I expect to make it a PHP function. How?
In general:

PHP Functions
https://www.php.net/manual/en/functions.arguments.php

to implement:

(something like this? not tested)

<?php
  
function event0()
{
    echo '<script>
               var hdr1 = "Logon Page";
               document.getElementById("icons pull-right").innerHTML = hdr1;
         </script>';
  
}

event0();

?>

Open in new window

Thanks. Where to refer to relevant PHP file for using such function?

It is now referring to one Php file, in the form below.
 
<body onload="event0()">
        <div class="container" style="background:url('./pict/ID-10028343.jpg');border: 0px solid green;background-color: C9D3DD;background-size: cover;background-repeat: no-repeat;width:1200px;height:800px;font-family:Verdana;font-size:14px;">
          <form action="page.php" method="POST">

Open in new window

Where to refer to relevant PHP file?

just put codes above as a separate php file, and then include them at the place you needed.

try check the functions include or include_once:

https://www.php.net/manual/en/function.include.php

https://www.php.net/manual/en/function.include-once.php
I have

page.php
<?php
	include 'start0.php';
	...

Open in new window

start0.php
<?php
	function event0()
	{
		echo '<script>
				   var hdr1 = "Logon Page";
				   document.getElementById("icons pull-right").innerHTML = hdr1;
			 </script>';

	}

	event0();
 ?>

Open in new window

but it is not OK.

In Html file, can we refer to other php file, before using event0?
you can try debug the page.php by looking into the source code generated or using the browser's Inspect feature.

I'm uncertain about what do you mean by "but it is not OK".

can you elaborate further?


In Html file, can we refer to other php file, before using event0?

is the "html" file comes with extension .html or .php? If it's a .html file, you can't include php. If your "html" file is actually a .php file, then you can include another php file within itself.
event0 is inside start0.php, but it is not fired as expected, when refreshing Html file.
event0 is inside start0.php, but it is not fired as expected, when refreshing Html file.

well, what's the HTML codes generated from page.php (parent php) ? are you able to debug if there's any error?
>> when refreshing Html file

I hope you mean PHP file