javascriptphphtmlservermustache.php

Dynamically generated HTML (Server-side) in new page

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!

Solution

  • 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