Solved

Button in first row of html table does not work

Posted on 2014-04-11
2
1,022 Views
Last Modified: 2014-04-17
Hi all.

I have a php page (see below). Each row of data has a button, if the status is Open then the button is showed otherwise the button is not shown. When the button is clicked it goes to another file (ProcessToDoAction.php). Something weird is happening, the button on the first row of data does not work, meaning it does not go to the file ProcessToDoAction.php but rather it goes to the form's action (LookupResultsConvertJobType.php). And again this only happens on the first row of data, if I click the button on the second row it goes to the correct file (ProcessToDoAction.php).

Any idea why this is happening?

Thank you in advance.

  <head>
  <title>MyPage</title>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <link rel="stylesheet" href="style.css" type="text/css" />
  <link href="iphone-icon1.png" rel="apple-touch-icon">
  </head>
<body>
      				
<div class="wrapper">
    <div id="logo"></div>
    <form class="form4" action="LookupResultsConvertJobType.php" method="post">
<div class="formtitle4">Lookup Form</div>
  </head>
<body>
  <div class="input3">
                       <div class="inputtext">Job Type:</div>
               <div class="inputcontent" >
                    <?php  foreach($data as $row){ echo '<input type="text" name="jobtype" id="jobtype" value="' . html_escape($row['jobtypedescription']) . '">'; } ?>           
               </div>
               <?php if ($row['Type'] == 1 AND	$row['Status'] <> 'Completed') {
               echo '<input class="button5"  type="submit" value="Convert to D"/><p></p>'; }
               		 
               		 elseif ($row['Type'] == 2 AND	$row['Status'] <> 'Completed') {  // Job type is 2
	               		 echo '<input class="button5"  type="submit" value="Convert Back To S"/><p></p>';
               		 }  ?>              
           
          </div>
           
		  <div class="input3">
            
                <table cellpadding="0" cellspacing="0"  class="db-table" align = "center">
                <tr>
                <th>To Do</th>
                <th>Status</th>
                <th>Date</th>
                <th>Action</th>
                </tr>
                               
                <?php  foreach($data1 as $row){ 
                    echo '<tr>';
                    echo '<td>' . html_escape($row['ToDo']) . '</td>';
                    echo '<td>' . html_escape($row['Status']) . '</td>';
                    echo '<td>' . html_escape($row['ToDoStatusDate']) . '</td>';
                     if ($row['Status'] == 'Open') 
					{
						echo "<td>
						<form action='ProcessToDoAction.php' method='post'>        					
						<input type='text' id='DataEntryID' name='DataEntryID' value='" . html_escape($row['DataEntryID']) . "'/>
						<input type='text' id='todoid' name='todoid' value='" . html_escape($row['ToDoID']) . "'/>
						<input class='button8'  type='submit'  value='Complete'/>
						</form>				
						</td>";
					}

				   else
				   {
					   echo "<td>                 
					   	<input type='hidden' name='todoid' value='" . html_escape($row['ToDoID']) . "'/>      
					   	</td>";   
				  }
                    echo '</tr>';
                   
                } ?>                 
               </table>

			<div class="buttons" align = center>

				<input class="button1"  type="submit" formaction="BacktoLookup.php" value="Search" /> 
				<input class="button1"  type="submit" formaction="Menu.php" value="Menu" /> 
				<input class="button1"  type="submit" formaction="Shortage.php" formmethod="post" value="Shortage" /> 		
			</div>   
</form>
</div>
</body>
</html>

Open in new window

0
Comment
Question by:Sim1980
2 Comments
 
LVL 42

Assisted Solution

by:Rob Jurd, EE MVE
Rob Jurd, EE MVE earned 250 total points
ID: 39995986
This is to do with nested forms, forms within forms.  You can't do that, which is why you're getting it working once and not after that because the browser has submitted that form but even this could give you unexpected results across browsers (and versions thereof).  

You'll need to rethink your design.

Having said that, I don't think it's going to be too hard but I would need to know more info on both ProcessToDoAction and LookupResultsConvertJobType but I suspect you may be able to call the ProcessToDoAction using ajax (and hence removing those form tags in the rows).  Then you can submit the main form LookupResultsConvertJobType once all rows have been "modified"
0
 
LVL 33

Accepted Solution

by:
Slick812 earned 250 total points
ID: 39996403
Hello Sim1980, You may have better HTML if you take OUT all of the -
<form action='ProcessToDoAction.php' method='post'>

from the -
<form class="form4" action="LookupResultsConvertJobType.php" method="post">

so the browser can work with a single form at a time, ,

also your HTML is very messed up you have TWO -
</head>
<body>

which can get the browser to be inconsistent.

Also you have this DIV - <div class="input3">  start INSIDE a <form> , BUT it ends with </div>  OUTSIDE that form as -
</form>
</div>

making the browser display inconsistent, , you might try something like -
  <head>
  <title>MyPage</title>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <link rel="stylesheet" href="style.css" type="text/css" />
  <link href="iphone-icon1.png" rel="apple-touch-icon">
  </head>
<body>
      				
<div class="wrapper">
    <div id="logo"></div>
    <form class="form4" action="LookupResultsConvertJobType.php" method="post">
<div class="formtitle4">Lookup Form</div>
  <div class="input3">
   <div class="inputtext">Job Type:</div>
    <div class="inputcontent" >
<?php  foreach($data as $row){ echo '<input type="text" name="jobtype" id="jobtype" value="' . html_escape($row['jobtypedescription']) . '">'; } ?>           
    </div>
<?php if ($row['Type'] == 1 AND	$row['Status'] <> 'Completed') {
  echo '<input class="button5"  type="submit" value="Convert to D"/><p></p>'; }
  elseif ($row['Type'] == 2 AND	$row['Status'] <> 'Completed') {  // Job type is 2
    echo '<input class="button5"  type="submit" value="Convert Back To S"/><p></p>';
    }  ?>              
  </div>
   
  <div class="buttons" align = center>
  <input class="button1"  type="submit" formaction="BacktoLookup.php" value="Search" /> 
  <input class="button1"  type="submit" formaction="Menu.php" value="Menu" /> 
  <input class="button1"  type="submit" formaction="Shortage.php" formmethod="post" value="Shortage" /> 		
  </div>   
</form>


<div class="input3">
     <table cellpadding="0" cellspacing="0"  class="db-table" align = "center">
<tr>
<th>To Do</th><th>Status</th><th>Date</th><th>Action</th>
</tr>
<?php  foreach($data1 as $row){ 
  echo '<tr>';
  echo '<td>' . html_escape($row['ToDo']) . '</td>';
  echo '<td>' . html_escape($row['Status']) . '</td>';
  echo '<td>' . html_escape($row['ToDoStatusDate']) . '</td>';
  if ($row['Status'] == 'Open') {
    echo "<td>
    <form action='ProcessToDoAction.php' method='post'>        					
    <input type='text' id='DataEntryID' name='DataEntryID' value='" . html_escape($row['DataEntryID']) . "'/>
    <input type='text' id='todoid' name='todoid' value='" . html_escape($row['ToDoID']) . "'/>
    <input class='button8'  type='submit'  value='Complete'/>
    </form>				
    </td>";
  } else {
  echo "<td>                 
  <input type='hidden' name='todoid' value='" . html_escape($row['ToDoID']) . "'/>      
  </td>";   
  }
  echo '</tr>';
} ?>                 
    </table>
</div>

Open in new window

notice that I removed ALL of the <div class="input3"> OUTSIDE of the -
<form class="form4" action="LookupResultsConvertJobType.php" method="post">
    <form> code
0

Featured Post

Gigs: Get Your Project Delivered by an Expert

Select from freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely and get projects done right.

Question has a verified solution.

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

Someone recently asked me about how to display a progress indicator on a page while an iframe is loading. And I remember when I first came across this myself. It was a bit tricky to get my head around, but really, it's very simple. The most impor…
This is a PowerShell web interface I use to manage some task as a network administrator. Clicking an action button on the left frame will display a form in the middle frame to input some data in textboxes, process this data in PowerShell and display…
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…

815 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

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now