How can I implement a website using HTML and CSS without functionality?

[evinda]

How about:

var showApple = false
if (Apple is checked) {
    if (Large Screen is checked OR (FROM <= 6.1 AND TO >= 6.1)) {
        if (iOS is checked){
            showApple = true
        }
    }
}
if (showApple) {
    Apple is shown
} else{
    Apple is not shown
}

So we define a local variable at the beginning of the function that has the value "false" and it gets the value "true" if the specific product should be shown. Is this the right idea of the way you described?

 

[I like Serena]

So we define a local variable at the beginning of the function that has the value "false" and it gets the value "true" if the specific product should be shown. Is this the right idea of the way you described?

Yep. (Nod)

Alternatively we can put everything in a single if-statement and combine with AND and OR.
Something like:

if (Apple checked AND (Large screen selected OR (from <= 6.1 AND 6.1 <= to)) AND iOS selected) {
    show apple product
} else {
    hide apple product
}

 

[evinda]

Yep. (Nod)

Alternatively we can put everything in a single if-statement and combine with AND and OR.
Something like:

if (Apple checked AND (Large screen selected OR (from <= 6.1 AND 6.1 <= to)) AND iOS selected) {
    show apple product
} else {
    hide apple product
}

Ok! Which of the two ways do you suggest? Which one is better?

 

[I like Serena]

Ok! Which of the two ways do you suggest? Which one is better?

Both are fine. :geek:

I expect we'll revisit it anyway since I suspect there is another stage coming up. Are we also going to write php code? :unsure:

 

[evinda]

I want now to create the initial side that consists of the logo and a searchbox. I did this, but it is small and I don't really know how to change the size. I tried differend ways at css styles, but the height doesn't change. I can only change the length of the search box.

I wrote:

<input type="text" id="search" size="40">
              <button id="search"type="button"  style="background-color:red;color:white">
                  Search 
              </button>

How can we change the height? I tried to add also "height:..." but I didn't see any change.

 

[I like Serena]

It shouldn't be an html attribute. Instead it should be css style. That is, either in the <style> section, or as a style="..." attribute.
Then font-size or height should work. They do need a unit like 'px' for pixels.

 

[evinda]

It shouldn't be an html attribute. Instead it should be css style. That is, either in the <style> section, or as a style="..." attribute.
Then font-size or height should work. They do need a unit like 'px' for pixels.

It works now! (Nod) Now I have a quesion about php (Blush)

In a .php file we have the filters and products with title, description and price that we had above. The file is in the form:

<?php 
$content = [ 
   "Mobile" => [ 
       "filters" => [ ... ] 
       "products" => [ ... ]  
    ] 
] 
?>

If we write in the searchbox above "Mobile" all mobiles should be shown. So do we write in an other .php file "if (input == Mobile)" then show these products otherwise no product should be shown, in the way we did it above with javascript with the different combinations of filters to show Apple and Samsung? But how do we combine these two files? :unsure:

 

[I like Serena]

It works now!

Nice! (Nod)

Now I have a quesion about php

If we write in the searchbox above "Mobile" all mobiles should be shown. So do we write in an other .php file "if (input == Mobile)" then show these products otherwise no product should be shown, in the way we did it above with javascript with the different combinations of filters to show Apple and Samsung? But how do we combine these two files? :unsure:

We would basically replace the javascript code by php code and it will all still be one file.

We would have a special "Submit" button that posts the selections to the server.
The server will execute the php script and send the result back.
That is, the page will be shown again, but now the php script decides what to show instead of the javascript.

See the PHP intro on w3schools.
Ultimately our page should look like the example shown in the PHP Full Form page.

 

[evinda]

We would basically replace the javascript code by php code and it will all still be one file.

We would have a special "Submit" button that posts the selections to the server.
The server will execute the php script and send the result back.
That is, the page will be shown again, but now the php script decides what to show instead of the javascript.

See the PHP intro on w3schools.
Ultimately our page should look like the example shown in the PHP Full Form page.

So at the definition of the searchbox do we add a value to connect it with the server?

I mean:

<input type="text" id="input" value="<?php echo $input;?>">

:unsure:

 

[I like Serena]

So at the definition of the searchbox do we add a value to connect it with the server?
I mean:

<input type="text" id="input" value="<?php echo $input;?>">

Not exactly. :unsure:
The value doesn't really connect it to the server.
Instead the value ensures that a user gets to see the same value they entered when the server generates a new page.
The connection to the server is when we respond to a "submit" button and pick up the value by its id="input".
That is, we still need php code somewhere else that uses $_POST["input"].

 

[evinda]

Not exactly. :unsure:
The value doesn't really connect it to the server.
Instead the value ensures that a user gets to see the same value they entered when the server generates a new page.
The connection to the server is when we respond to a "submit" button and pick up the value by its id="input".
That is, we still need php code somewhere else that uses $_POST["input"].

Do we need the value of the submit button or the searchbox? I mean where do we write id="input"? At the definition of the textbox of the searchbox or the submit button?

 

[I like Serena]

Do we need the value of the submit button or the searchbox? I mean where do we write id="input"? At the definition of the textbox of the searchbox or the submit button?

The search box needs the id="input".
The submit button needs to be of type="submit".
Both need to be in a <form>, with a method="post", and an action that specifies the name of the .php file.
And we will need php code somewhere that uses $_POST["input"], which is the value entered in the search box after submitting.

 

[evinda]

The search box needs the id="input".
The submit button needs to be of type="submit".
Both need to be in a <form>, with a method="post", and an action that specifies the name of the .php file.
And we will need php code somewhere that uses $_POST["input"], which is the value entered in the search box after submitting.

Ok! The php code that uses $_POST["input"] must be in the file with name that we wrote in action, (action = "file.php"), is this right?

I tried to check that, writing in "file.php" the following code:

<html>
<body>
The input is: <?php echo $_POST["input"]; ?>
</body>
</html>

But I get as result the code exactly as it is, not "The input is: ... ". Do we have to write something more in the php file?

 

[I like Serena]

Ok! The php code that uses $_POST["input"] must be in the file with name that we wrote in action, (action = "file.php"), is this right?

But I get as result the code exactly as it is, not "The input is: ... ". Do we have to write something more in the php file?

I don't think so. That should be enough.
We do need a <form> with a "submit" button in the original file. And specify the method to POST and specify the php file.
Perhaps the method is missing? :unsure:

 

[evinda]

I don't think so. That should be enough.
We do need a <form> with a "submit" button in the original file. And specify the method to POST and specify the php file.
Perhaps the method is missing? :unsure:

I have used the <form>, and I have also written the action and the method... What else could be wrong?

 

[I like Serena]

I have used the <form>, and I have also written the action and the method... What else could be wrong?

I think we need name="input" instead of id="input". :unsure:

 

[evinda]

I think we need name="input" instead of id="input". :unsure:

I tried now also an example I found online: https://www.php.net/manual/de/tutorial.forms.php
So in an file with name example.html I wrote:

 <form action="action.php" method="post"> <p>Ihr Name: <input type="text" name="name" /></p> <p>Ihr Alter: <input type="text" name="alter" /></p> <p><input type="submit" /></p> </form>

and in a file with name action.php I wrote:

 Hallo <?php echo htmlspecialchars($_POST['name']); ?>. Sie sind <?php echo (int)$_POST['alter']; ?> Jahre alt.

Then running it we get:

So I get the code of the php-file.

What am I doing wrong?

 

[I like Serena]

Then running it we get:

So I get the code of the php-file.
What am I doing wrong?

It looks as if your php file is interpreted as an HTML file.
The php-file must be executed as PHP code and not be shown as if it is an HTML file.
To achieve that, the php-file must typically be in the cgi-bin directory of the webserver, it must have been marked as an executable file, and the web server must have PHP enabled.

 

[evinda]

It looks as if your php file is interpreted as an HTML file.
The php-file must be executed as PHP code and not be shown as if it is an HTML file.
To achieve that, the php-file must typically be in the cgi-bin directory of the webserver, it must have been marked as an executable file, and the web server must have PHP enabled.

Is it possible to compile this in https://www.w3schools.com/ althrough we have two files, one html and one php?

 

[I like Serena]

Is it possible to compile this in https://www.w3schools.com/ althrough we have two files, one html and one php?

I think we cannot test php on w3schools. :unsure:
We may need our own server that executes our php code.
Then again, there may be online php test locations.

 

[evinda]

I think we cannot test php on w3schools. :unsure:
We may need our own server that executes our php code.
Then again, there may be online php test locations.

Do I have to download something? Or how does this work?

 

[I like Serena]

Do I have to download something? Or how does this work?

I've found a php compiler on w3schools now.
However, it doesn't seem to give us the option to create an html form and submit from there. :unsure:

If we want our own local web server, we can install apache.

 

[I like Serena]

I have Apache installed on my system and I was able to create a search box so that the submit button runs a php script in cgi-bin:

 

[evinda]

I have Apache installed on my system and I was able to create a search box so that the submit button runs a php script in cgi-bin:

View attachment 11045

https://www.physicsforums.com/attachments/11046

Downloading Apache we get a file Apache -> httpd-2.4.35 -> httpd-2.4.35-o102p-x64-vc14 (and one httpd-2.4.35-o102p-x86-vc14 ) -> Apache24. In the last one there are several files. Do we save the php file that we write in the file "cgi-bin"? And where do we save the html file? Also there?

 

[I like Serena]

Downloading Apache we get a file Apache -> httpd-2.4.35 -> httpd-2.4.35-o102p-x64-vc14 (and one httpd-2.4.35-o102p-x86-vc14 ) -> Apache24. In the last one there are several files. Do we save the php file that we write in the file "cgi-bin"? And where do we save the html file? Also there?

The html file should go to something like a /www/html/ directory, where there should already be an index.html file.

 

[evinda]

The html file should go to something like a /www/html/ directory, where there should already be an index.html file.

In the Apache24 file there is "htdocs" which includes an index.html file. Do you mean to save my html file there? :unsure:

 

[I like Serena]

In the Apache24 file there is "htdocs" which includes an index.html file. Do you mean to save my html file there?

Yep. (Nod)

 

[evinda]

Yep. (Nod)

It doesn't work (Sweating)

I get:

I saved the two files like this:

Is this wrong?

 

[I like Serena]

It doesn't work
I saved the two files like this:

Is this wrong?

That is correct. (Nod)

What do you get if you open http://localhost or http://localhost/index.html in your browser?
If Apache is working you should get a standard apache html page that shows 'It works!'
If that works, what do you get if you open http://localhost/example.html?

 

[evinda]

What do you get if you open http://localhost or http://localhost/index.html in your browser?
If Apache is working you should get a standard apache html page that shows 'It works!'
If that works, what do you get if you open http://localhost/example.html?

It doesn't work... I get:

 

[I like Serena]

It doesn't wotk. I get:

Then you're not running apache yet.
Can you open the apache application?

Apparently one way to do it on Windows, is to open a command prompt, and type:

cd ...\Apache24\bin
httpd.exe

where ... should be replaced by the location where you have Apache.
It's explained in the readme_first.html file that is in the top directory.

 

[evinda]

Then you're not running apache yet.
Can you open the apache application?

Apparently one way to do it on Windows, is to open a command prompt, and type:

cd ...\Apache24\bin
httpd.exe

where ... should be replaced by the location where you have Apache.
It's explained in the readme_first.html file that is in the top directory.

Which of the following files do we use?

 

[I like Serena]

Which of the following files do we use?

Those look the same. :unsure:
Perhaps one of them is a .zip file and the other is the unzipped version.
In that case we need the one that is unzipped.
Either way, we'll find out if we open a command prompt.

If I do it on my Windows I get:

 

[I like Serena]

Which of the following files do we use?

Oh wait. (Wait)
I see now that one is for x64 and the other is for x86.
The first would be a 64-bit version and the other is a 32-bit version.
Either should work.

 

[evinda]

Those look the same. :unsure:
Perhaps one of them is a .zip file and the other is the unzipped version.
In that case we need the one that is unzipped.
Either way, we'll find out if we open a command prompt.

If I do it on my Windows I get:
View attachment 11052

I get:

httpd: Syntax error on line 39 of C:/Users/evinda/Desktop/Apache/httpd-2.4.35/httpd-2.4.35-o102p-x86-vc14/Apache24/conf/httpd.conf: ServerRoot must be a valid directory