How to pass variables and retrieve data from DB with jQuery Mobile, PHP and MySQL

Question

I'm really new to jQuery so I need your professional help in solving some of the issues I have.

I want to create an application for checking out events. User chooses type of events (choose_type.php) -> user chooses city (choose_city.php) -> user chooses event(choose_event.php) -> user sees event details (event.php)

I have a user interface which is done with jQuery Mobile. I have created it based on Restaurant Picker application here

All of the choices in these html files are displayed as <li> elements with href links.

PHP code for my index page is given below.

if (!isset($_POST['SUBMIT'])){   //ERROR: Undefined index

    $typequery= "SELECT * FROM eventtype ";
    $typeresult = mysql_query($typequery);
                                        while($row=mysql_fetch_array($typeresult))
{                                   $typeid=$row['TypeID'];
$typeimg=$row['Image'];
$typename=$row['TypeName'];
    ?>     
<li><a href="choose_city.php?id=<?php echo $typeid?>"data-transition="slidedown"> <img src="<?php echo $typeimg?>"/><h3><?php echo $typename ?></h3></a></li>

<?php  } } ELSE {} ?>

This reads all types and their image paths from the DB, however, when I click on a link to go to choose_city.php, I am returned a blank screen which only says UNDEFINED.

How should I continue working on this? I need to keep passing parameters like typeid to next query, and typeid,cityid to the next one in order to get to event details.

my database is structured like City --< Events , EventType ---< Events, Event (contains only PK and FK ) ---- Description.

Any guidance would be really helpful. Thank you in advance,