1

For learning purposes, I am building a simple web app that allows users to write an introduction page for themselves. I am very confused about dynamically generated HTML on the server-side and how it connects to the client-side. I am currently using PHP and Mustache templates to generate the about page HTML on the server side and that works fine.

Lets say I type in the URL: localhost/intro.html

On intro.html there is a button and if I click it then the browser would bring me to a new URL (localhost/intro.html/Adam) with the introduction information of a user, lets just say "Adam".

From my understanding, this should send a request to the server to generate an about HTML page with information about Adam and send that HTML page back to the browser.

What I don't understand is what it would look like in HTML, JS (JQuery), and PHP. Again, I can generate the HTML on the server side just fine, but how would clicking a button on localhost/intro.html change the page to localhost/intro.html/Adam ? How would my PHP code detect the page localhost/intro.html/Adam and know to generate HTML for it? What does the code look like and am I missing some concepts?

Any direction, sample code or tutorials would be much appreciated. All I can find is strictly PHP tutorials. Thank you!

Alan
  • 313
  • 4
  • 14
  • How much do you know about creating a database and database queries? Not trying to be rude. Just trying to find out what your experience level is. I can help you, but I need to know where to start. – Kuya Sep 13 '15 at 06:57
  • @Kuya Thank you, I am currently using XAMMP and have a basic understanding of databases and database queries. I'm sure I'll be fine on that. – Alan Sep 13 '15 at 07:02
  • You'll do well to spend some time on w3schools – Darren H Sep 13 '15 at 07:24
  • @DarrenH, Thank you for the advice. I have been on w3schools before coming here to ask the question, but I couldn't seem to find what I need. Would it be possible for you to direct me to the link on w3schools that is related to my question? – Alan Sep 13 '15 at 07:34

1 Answers1

2

Okay, with your knowledge of databases and queries, you can do this...

Create your main page... we will call it index.php.

  1. Put this js in your <head> tag

    function MM_jumpMenuGo(objId,targ,restore){ //v9.0 var selObj = null; with (document) { if (getElementById) selObj = getElementById(objId); if (selObj) eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'"); if (restore) selObj.selectedIndex=0; } }

  2. Create a form with a dropdown that has dynamically generated options and a submit button, inside a repeat region.

  3. The values for that dropdown would be something like <option value="/<?php echo $row['username'] ?>"><?php echo $row['username'] ?></option>

  4. Your submit button will call the javascript to send you to the page you want
    <input type="button" name="go_button" id= "go_button" value="Go" onClick="MM_jumpMenuGo('jumpMenu','parent',0)">

Completed main page...

<form name="form1">
  <select name="name" id="name">
    <option selected>Please make a selection</option>
    <?php do { ?>
    <option value="/<?php echo $row['username'] ?>"><?php echo $row['username'] ?></option>
    <?php } while($row = $query->fetch(PDO::FETCH_ASSOC)) ?>
  </select>
<input type="button" name="go_button" id= "go_button" value="Go" onClick="MM_jumpMenuGo('select14','parent',0)">
</form>

Then we start on your "target" page... we'll call it results.php

  1. Query the database for the username being passed from the main page.

    $name = $_GET['name']; // this is the name of the dropdown on the main page SELECT * FROM mytable WHERE username=:name

  2. Make sure you bind your parameters $query->bindValue(':name', $name, PDO::PARAM_STR);

  3. Then you can echo the information you want to display like this... <?php echo $row['fieldname'] ?>

Finally, the .htaccess file...

Create a rewrite rule to handle this...

RewriteEngine On    # Turn on the rewriting engine
RewriteCond %{REQUEST_FILENAME} !-f # if this is not a real file
RewriteCond %{REQUEST_FILENAME} !-d # if this is not a real directory
RewriteRule    ^([A-Za-z0-9_-]+)$    results.php?name=$1    [NC,L]    # Handle page requests

And you're done.

Note: The code I use is pdo_mysql. You can get more information here

Nimantha
  • 6,405
  • 6
  • 28
  • 69
Kuya
  • 7,280
  • 4
  • 19
  • 31
  • Is it possible to accomplish this by separating the HTML and PHP files? Or was this a false misconception I had? Otherwise I understand what is happening so far. – Alan Sep 13 '15 at 07:33
  • You will have a main page (index.php), a results page (results.php) and the `.htaccess` file – Kuya Sep 13 '15 at 07:36
  • Thank you, this makes sense to me! – Alan Sep 13 '15 at 07:41
  • Actually, I got a follow up question. Lets say the user typed in results.php/Adam in an attempt to access information about Adam and assuming they have permission to. How exactly would that convert to be results.php?name=Adam ? – Alan Sep 13 '15 at 07:48
  • The user will never know that `results.php` is the "real" name of the page. All they will ever see in the URL bar is something like `www.example.com/Adam`. If they type `example.com/Bill` they will get info about Bill... if he exists in the database. – Kuya Sep 13 '15 at 07:50
  • I see, is there any additional PHP code to write for the server to understand example.com/Bill means they are looking for Bill? Or would $name = $_GET['name']; suffice? – Alan Sep 13 '15 at 07:57
  • 1
    `$name = $_GET['name']` This is what is happening... You're creating a variable called `$name` and assigning a value to it by calling `$_GET['name']`. This makes (in your example) the variable `$name` equal to "Adam" or whatever other name is passed. So... `$name = $_GET['name']` is what you need. – Kuya Sep 13 '15 at 08:01