Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

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

Posted on 2008-10-15
12
Medium Priority
?
209 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 

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 2000 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

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

This article discusses four methods for overlaying images in a container on a web page
3 proven steps to speed up Magento powered sites. The article focus is on optimizing time to first byte (TTFB), full page caching and configuring server for optimal performance.
The viewer will learn how to dynamically set the form action using jQuery.
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.
Suggested Courses

636 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