Solved

need halp with getting users to add data about themselfs via php

Posted on 2008-10-15
12
195 Views
Last Modified: 2013-12-13
i have a profile site for runners and im wanting to be able to have users enter ther personal bests for distances such as:
distance     time
5000m        14:05
3000m         8:32

but i would like it so users can select there times and distances from drop down menus and click a button the adds anouther set of distcnes and times for them to add. Also users will need to be able to chnage existing times but im not really shore how to do this and could do with a point in the right direction.

i have included a picture to try and help you guys out with what im looking for..

so basicly all i want is so that if a user wants to add a new pb then the click an add button and a new drop down menu and textbox apprear to add more information too...
addpb.jpg
0
Comment
Question by:runnerjp
  • 6
  • 6
12 Comments
 
LVL 82

Expert Comment

by:hielo
ID: 22722899
Refer to the following:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd">
 
<html>
<head>
<title></title>
<script type="text/javascript">
function addRow(tableID)
{
	// Get a reference to the table
	var tableRef = document.getElementById(tableID);
 
	// Insert a row in the table at row index 0
	var newRow   = tableRef.insertRow(tableRef.rows.length);
 
	// Insert a cell in the row at index 0
	var leftCell  = newRow.insertCell(0);
	var rightCell  = newRow.insertCell(1);
 
	// Append a text node to the cell
	leftCell.innerHTML=tableRef.rows(0).cells(0).innerHTML;
	rightCell.innerHTML=tableRef.rows(0).cells(1).innerHTML;
}
</script>
</head>
<body>
<table id="theTable"><tr><td>a</td><td>b</td></tr></table>
<div><span onclick="addRow('theTable')">+Add Row</span></div>
</body>
</html>

Open in new window

0
 

Author Comment

by:runnerjp
ID: 22723305
ok i see how this works but how would i make it so the cells are like this:


<form id="FormName" action='<?php "$_SERVER[PHP_SELF]" ?>' method="post" name="basic">
<table width="440" border="0" align="center" cellpadding="0" cellspacing="2">
<tr><td colspan="3" align="center" valign="middle"> <p align="center"> Select your event and enter your pb here!</p>
  </td>
</tr>
<tr>
  <td align="right"><?php $lines = file('runningevents.txt');
echo '<select class="inputedit" id="event" name="event">';
foreach($lines as $line) {
    echo '<option>'.$line.'</option>';
}
echo '</select>';?></td>
  <td colspan="2"><input class="inputedit" id="pb" name="pb" type="text" size="25" value="" maxlength="255" /></td>
</tr>
<tr>
  <td width="150"><div align="right">
<label for="dob"></label>
</div></td>
  <td colspan="2">&nbsp;</td>
</tr>
<tr><td width="150"><div align="right">
<label for="first_name"></label>
</div>
</td>
  <td colspan="2">&nbsp;</td>
</tr>
<tr>
  <td width="150"><div align="right">
<label for="last_name"></label>
  </div></td>
  <td colspan="2"><p>
        <label for="birthday"></label>
  </p></td>
</tr>
<tr>
  <td width="150" align="right">status</td>
  <td colspan="2"><? 
}function check_form()
{
global $HTTP_POST_VARS, $error, $print_again;
$error['error'] = false;
if (($_POST["first_name"] == "") || (!preg_match("/^[a-z0-9]+(?:_[a-z0-9]+)?$/i", $_POST["first_name"])))
{
    $error['first_name'] = true;
    $print_again = true;
    $message = "The first name field is either empty or incorrect data was input.<br>";
}
 
 if (($_POST["last_name"] == "") || (!preg_match("/^[a-z0-9]+(?:_[a-z0-9]+)?$/i", $_POST["first_name"]))) {
        $error['last_name'] = true;
         $print_again = true;
        $message="The last name field is either empty or incorrect data was input.<br>";
    }
	 
	  
     if($print_again) {
         show_form();
       
       } else {
        show_form();
          $message="<span class='style1'>Your profile has been created</span>";
		   $id =  mysql_real_escape_string( $_POST['id']);
 
$club = mysql_real_escape_string( $_POST['club']);
$first_name = mysql_real_escape_string( $_POST['first_name']);
$last_name =  mysql_real_escape_string( $_POST['last_name']);
$gender =  mysql_real_escape_string( $_POST['gender']);
 
 
 
 
 
 
 
$update = "UPDATE users SET new_user='1', club= '$club', first_name = '$first_name', gender = '$gender', last_name = '$last_name' WHERE id='$id' ";
$result = mysql_query($update);
 
// Check result
// This shows the actual query sent to MySQL, and the error. Useful for debugging.
if (!$result) {
    $er  = 'Invalid query: ' . mysql_error() . "\n";
    $er .= 'Whole query: ' . $query;
    die($er);
       }}
  echo '			<p class="error">' . $message . '</p>' . "\n";
}
if(isset($_POST["basic"])) {
    check_form();
} else {
    show_form();
}
 
 ?></td>
</tr>
<tr>
<td width="150"></td>
<td width="112"><input name="basic" type="submit" class="submit-btn" value="">
<input type="hidden" name="id" value="<?php echo $id ?>"></td>
<td width="170">&nbsp;</td>
</tr>
</table>
</form></td>
  </tr>
</table>
 
 
</td>
          <td width="24%" valign="middle" bgcolor="#FFFFFF"></td>
        </tr>
        <tr>
          <td colspan="3" valign="middle"></td>
        </tr>
 
        <tr>
            <td colspan="3"></td>
        </tr>
 
        <tr>
            <td colspan="3"></td>
        </tr>
 
        <tr>
            <td height="143" colspan="3"></td>
  </tr>
    </table>

Open in new window

0
 
LVL 82

Expert Comment

by:hielo
ID: 22723354
>>so the cells are like this:
I don't know what "this" is. I am not seeing what you see. Provlide a url to your page OR provide the source code that the browser gets (Firefox: View > Page Source), NOT the php source code.
0
Microsoft Certification Exam 74-409

Veeam® is happy to provide the Microsoft community with a study guide prepared by MVP and MCT, Orin Thomas. This guide will take you through each of the exam objectives, helping you to prepare for and pass the examination.

 

Author Comment

by:runnerjp
ID: 22723417
sorry here is the page source


<table width="100%" cellpadding="0" cellspacing="0">
 
<tr>
            <td colspan="3" align="center" valign="middle">
                <div class="style10_c1">
                    <table width="100%" class="loggedin" bgcolor="#e4ebeb">
                        <tr>
                            <td>
                                <div class="c1">
                                    <div align="center"><em>
                                      <script type='text/javascript'>
var date=new Date(); // Gets the full date!
var day=date.getHours(); // Gets the hours!
 
if(day<=11) {
document.write('Good Morning,'); // If it's before 12 PM then display this!
} else if(day<18){
document.write('Good Afternoon,'); // After 12 PM display this!
} else {
document.write('Good Evening,'); // After 6 PM display this!
}
    </script>
 
                                    You are logged in as Admin.Your ip address is 81.104.225.118; this is stored for security reasons.</em>                                        </div>
                                </div>                            </td>
                        </tr>
                  </table>
                </div>            </td>
        </tr>
 
        <tr>
            <td colspan="3" valign="middle"><p align="center"></p>
         </td>
        </tr>
        <tr>
          <td valign="middle"></td>
          <td width="46%" align="center" valign="bottom"><div id="navbar2">
<ul>
 
<li id="ill"><a href="index.php?page=update"><FONT COLOR="white">Basic</FONT></a></li>
 
<li id="basic"> <a href="index.php?page=pbs">PB'S</a></li>
<li id="i1"><a href="link3.html%20"><FONT COLOR="white">button 3</FONT></a></li>
</ul>
</div></td>
          <td valign="middle">&nbsp;</td>
        </tr>
        <tr>
          <td class= width="30%" height="223" valign="middle" bgcolor="#FFFFFF"><p>&nbsp;</p>
          <p>&nbsp;</p></td>
 
          <td class= align="center" valign="top" ><table class="headermenu"  width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>
 
 
 
<form id="FormName" action='' method="post" name="basic">
<table width="440" border="0" align="center" cellpadding="0" cellspacing="2">
<tr><td colspan="3" align="center" valign="middle"> <p align="center"> Select your event and enter your pb here!</p>
  </td>
 
</tr>
<tr>
  <td align="right"><select class="inputedit" id="event" name="event"><option>100m
</option><option>200m
</option><option>400m
</option><option>800m
</option><option>1500m
</option><option>3000m
</option><option>5000m
</option><option>10,000m
</option><option>5k Road
</option><option>10k Road
</option><option>H Marathon
</option><option>Marathon
</option><option>3k S/Chase
</option><option>110m Hurdles
 
</option><option>400m Hurdles
</option><option>High Jump
</option><option>Pole Vault
</option><option>Long Jump
</option><option>Triple Jump
</option><option>Shot
</option><option>Discus
</option><option>Hammer
</option><option>Javelin
</option><option>Decathlon
</option><option>10k Walk
</option><option>20k Walk
</option><option>50k Walk
</option><option>60m (I)
</option><option>60m Hurdles
</option><option>Hept(I) </option></select></td>
 
  <td colspan="2"><input class="inputedit" id="pb" name="pb" type="text" size="25" value="" maxlength="255" /></td>
</tr>
<tr>
  <td width="150"><div align="right">
<label for="dob"></label>
</div></td>
  <td colspan="2">&nbsp;</td>
</tr>
<tr><td width="150"><div align="right">
<label for="first_name"></label>
</div>
</td>
  <td colspan="2">&nbsp;</td>
 
</tr>
<tr>
  <td width="150"><div align="right">
<label for="last_name"></label>
  </div></td>
  <td colspan="2"><p>
        <label for="birthday"></label>
  </p></td>
</tr>
<tr>
  <td width="150" align="right">status</td>
 
  <td colspan="2"></td>
</tr>
<tr>
<td width="150"></td>
<td width="112"><input name="basic" type="submit" class="submit-btn" value="">
<input type="hidden" name="id" value="1"></td>
<td width="170">&nbsp;</td>
</tr>
</table>
</form></td>
  </tr>
</table>
 
 
</td>
 
          <td width="24%" valign="middle" bgcolor="#FFFFFF"></td>
        </tr>
        <tr>
          <td colspan="3" valign="middle"></td>
        </tr>
 
        <tr>
            <td colspan="3"></td>
        </tr>
 
        <tr>
            <td colspan="3"></td>
        </tr>
 
        <tr>
            <td height="143" colspan="3"></td>
  </tr>
    </table>

Open in new window

0
 
LVL 82

Expert Comment

by:hielo
ID: 22723876

<form id="FormName" action='' method="post" name="basic">
<script type="text/javascript">
function addRow(tableID)
{
 
	// Get a reference to the table
	var tableRef = document.getElementById(tableID);
	var refNode = tableRef.rows(tableRef.rows.length-5);
 
	var newRow = tableRef.rows(1).cloneNode(true);
	tableRef.firstChild.insertBefore(newRow,refNode);
return;
 
}
</script>
<table id="theTable" width="440" border="5" align="center" cellpadding="0" cellspacing="2">
	<tr>
		<td colspan="3" align="center" valign="middle"><p align="center"> Select your event and enter your pb here!</p></td> 
	</tr>
	<tr>
		<td align="right">
			<select class="inputedit" id="event" name="event[]"><option>100m
               </option><option>200m
               </option><option>400m
               </option><option>800m
               </option><option>1500m
               </option><option>3000m
               </option><option>5000m
               </option><option>10,000m
               </option><option>5k Road
               </option><option>10k Road
               </option><option>H Marathon
               </option><option>Marathon
               </option><option>3k S/Chase
               </option><option>110m Hurdles
                
               </option><option>400m Hurdles
               </option><option>High Jump
               </option><option>Pole Vault
               </option><option>Long Jump
               </option><option>Triple Jump
               </option><option>Shot
               </option><option>Discus
               </option><option>Hammer
               </option><option>Javelin
               </option><option>Decathlon
               </option><option>10k Walk
               </option><option>20k Walk
               </option><option>50k Walk
               </option><option>60m (I)
               </option><option>60m Hurdles
               </option><option>Hept(I) </option></select>
		</td>
		<td colspan="2"><input class="inputedit" id="pb" name="pb[]" type="text" size="25" value="" maxlength="255" /></td>
	</tr>
	<tr>
		<td width="150"><div align="right"><label for="dob"></label></div></td>
		<td colspan="2">&nbsp;</td>
	</tr>
	<tr>
		<td width="150"><div align="right"><label for="first_name"></label></div></td>
		<td colspan="2">&nbsp;</td>
	</tr>
	<tr>
		<td width="150"><div align="right"><label for="last_name"></label></div></td>
		<td colspan="2"><p><label for="birthday"></label></p></td>
	</tr>
	<tr>
		<td width="150" align="right">status</td> 
		<td colspan="2"><span onclick="addRow('theTable')">+Add</span></td>
	</tr>
	<tr>
		<td width="150"></td>
		<td width="112"><input name="basic" type="submit" class="submit-btn" value="submit"><input type="hidden" name="id" value="1"></td>
		<td width="170">&nbsp;</td>
	</tr>
</table>
</form>

Open in new window

0
 

Author Comment

by:runnerjp
ID: 22723984
ermmm the outputs just the code i sent you with +ADD as the text :S

i want it so if a user wants to add anouther pb they click add and anouther drop down menu appears below the last and so does a text box so they can write there obs :)
0
 
LVL 82

Expert Comment

by:hielo
ID: 22724178
>>ermmm the outputs just the code i sent you with +ADD as the text :S
You did something wrong. If you look closer my last post contains the javascript code that does exactly what you asked when you click the +ADD. Take a closer look at the source code I gave you.
0
 

Author Comment

by:runnerjp
ID: 22724207
I DID.. i copied the source code and im unable to click add.. its just text :S
0
 
LVL 82

Expert Comment

by:hielo
ID: 22724334
I just copied and pasted what I copied exactly as is onto a new document and retested it with no problems
0
 

Author Comment

by:runnerjp
ID: 22725565
this is what i get http://www.runningprofiles.com/test.php   

i copied this code


<form id="FormName" action='' method="post" name="basic">
<script type="text/javascript">
function addRow(tableID)
{
 
	// Get a reference to the table
	var tableRef = document.getElementById(tableID);
	var refNode = tableRef.rows(tableRef.rows.length-5);
 
	var newRow = tableRef.rows(1).cloneNode(true);
	tableRef.firstChild.insertBefore(newRow,refNode);
return;
 
}
</script>
<table id="theTable" width="440" border="5" align="center" cellpadding="0" cellspacing="2">
	<tr>
		<td colspan="3" align="center" valign="middle"><p align="center"> Select your event and enter your pb here!</p></td> 
	</tr>
	<tr>
		<td align="right">
			<select class="inputedit" id="event" name="event[]"><option>100m
               </option><option>200m
               </option><option>400m
               </option><option>800m
               </option><option>1500m
               </option><option>3000m
               </option><option>5000m
               </option><option>10,000m
               </option><option>5k Road
               </option><option>10k Road
               </option><option>H Marathon
               </option><option>Marathon
               </option><option>3k S/Chase
               </option><option>110m Hurdles
                
               </option><option>400m Hurdles
               </option><option>High Jump
               </option><option>Pole Vault
               </option><option>Long Jump
               </option><option>Triple Jump
               </option><option>Shot
               </option><option>Discus
               </option><option>Hammer
               </option><option>Javelin
               </option><option>Decathlon
               </option><option>10k Walk
               </option><option>20k Walk
               </option><option>50k Walk
               </option><option>60m (I)
               </option><option>60m Hurdles
               </option><option>Hept(I) </option></select>
		</td>
		<td colspan="2"><input class="inputedit" id="pb" name="pb[]" type="text" size="25" value="" maxlength="255" /></td>
	</tr>
	<tr>
		<td width="150"><div align="right"><label for="dob"></label></div></td>
		<td colspan="2">&nbsp;</td>
	</tr>
	<tr>
		<td width="150"><div align="right"><label for="first_name"></label></div></td>
		<td colspan="2">&nbsp;</td>
	</tr>
	<tr>
		<td width="150"><div align="right"><label for="last_name"></label></div></td>
		<td colspan="2"><p><label for="birthday"></label></p></td>
	</tr>
	<tr>
		<td width="150" align="right">status</td> 
		<td colspan="2"><span onclick="addRow('theTable')">+Add</span></td>
	</tr>
	<tr>
		<td width="150"></td>
		<td width="112"><input name="basic" type="submit" class="submit-btn" value="submit"><input type="hidden" name="id" value="1"></td>
		<td width="170">&nbsp;</td>
	</tr>
</table>
</form>

Open in new window

0
 
LVL 82

Accepted Solution

by:
hielo earned 500 total points
ID: 22726476
From what I understood, That link works exactly as you requested on IE6. I noticed it doesn't work on FF, but this does:
function addRow(tableID)
{ 
	// Get a reference to the table
	var tableRef = document.getElementById(tableID).getElementsByTagName("TBODY")[0];
	var refNode = tableRef.rows[tableRef.rows.length-5];
	var newRow = tableRef.rows[1].cloneNode(true);
	tableRef.insertBefore(newRow,refNode);
return 1;
 
}

Open in new window

0
 

Author Closing Comment

by:runnerjp
ID: 31506642
thanks thats great i can build upon that now too make it how i want it... thnakyou for giving me the start i needed
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I imagine that there are some, like me, who require a way of getting currency exchange rates for implementation in web project from time to time, so I thought I would share a solution that I have developed for this purpose. It turns out that Yaho…
Introduction This article is intended for those who are new to PHP error handling (https://www.experts-exchange.com/articles/11769/And-by-the-way-I-am-New-to-PHP.html).  It addresses one of the most common problems that plague beginning PHP develop…
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

821 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question