...

View Full Version : Toggle Form Test Failed - Revised



DataTalk
12-21-2010, 12:12 AM
This toggle form action not working



<script language="JavaScript">
function OnSubmitForm()
{
if(document.pressed == 'SubmitPage1')
{
document.myForm.action ="Page1.php";
}
if(document.pressed == 'SubmitPage2')
{
document.myForm.action ="Page2.php";
}
if(document.pressed == 'SubmitPage3')
{
document.myForm.action ="Page3.php";
}
return true;
}
</script>

</head>
<form name="myForm" method='post'>

<button type='submit' onSubmit='document.pressed=this.value' value='SubmitPage1' >
<button type='submit' onSubmit='document.pressed=this.value' value='SubmitPage2' >
<button type='submit' onSubmit='document.pressed=this.value' value='SubmitPage3' >
</form>

Old Pedant
12-21-2010, 12:39 AM
There's no such thing as document.pressed

There's no such thing as onsubmit for a <button>.

Where are you coming up with these oddly-name but non-existent properties????

And why do you work so hard?


<form name="myForm" method='post'>

<input type="submit" onclick="this.form.action='Page1.php';" value="SubmitPage1" />
<input type="submit" onclick="this.form.action='Page2.php';" value="SubmitPage2" />
<input type="submit" onclick="this.form.action='Page3.php';" value="SubmitPage3" />

</form>

And now there is no need for the JS function OnSubmitForm() [which, by the by, you were never invoking in the code you posted, so of course is wasn't doing anything].

DataTalk
12-21-2010, 12:49 AM
This is actually a work around for a different purpose and I think I found the answer.

If this does not work i will post the total script, Thanks




<script language="JavaScript">
function OnSubmitForm()
{
if(document.pressed == 'Add')
{
document.myform.action ="page1.php";
}
if(document.pressed == 'Edit')
{
document.myform.action ="page2.php";
}
if(document.pressed == 'Delete')
{
document.myform.action ="page2.php";
}
return true;
}
</script>
</head>
<FORM name="myform" onSubmit="return OnSubmitForm();">

<INPUT TYPE="SUBMIT" name="Operation" onClick="document.pressed=this.value" VALUE="Add">
<INPUT TYPE="SUBMIT" name="Operation" onClick="document.pressed=this.value" VALUE="Edit">
<INPUT TYPE="SUBMIT" name="Operation" onClick="document.pressed=this.value" VALUE="Delete">

</FORM>

Old Pedant
12-21-2010, 01:11 AM
<script language="JavaScript">
var pressed = ""; // create a global variable; don't use document.pressed
function OnSubmitForm(form)
{
switch(pressed) {
case "Add":
form.action ="page1.php";
return true;
case "Edit":
form.action ="page2.php";
return true;
case "Delete":
form.action ="page2.php";
return true;
}
alert("No submit pushed? How did we get here?");
return false;
}
</script>
</head>
<body>
<form name="myform" onsubmit="return OnSubmitForm(this);">
...
<input type="image" onclick="pressed='Add';" src="/images/add.jpg">
<input type="image" onclick="pressed='Edit';" src="/images/edit.jpg">
<input type="image" onclick="pressed='Delete';" src="/images/delete.jpg">
</form>


Keep it simple.

DataTalk
12-21-2010, 02:08 AM
Ok! I need to add one more function to this.

Using your script with case Add, Edit, Delete -
How would you bring in the values to be posted to the page.



<head>
<script language="JavaScript">
function Split(sel,first)
{
if (sel.selectedIndex == 0 ) return;
if(sel.value == 'Add') return;
var temp = sel.id.split(",");
sel.form["F"+first].value = temp[0];
sel.form["F"+(first+1)].value = temp[1];
sel.form["F"+(first+2)].value = temp[2];
sel.form["F"+(first+3)].value = temp[3];
}
</script>
<script language="JavaScript">
var pressed = ""; // create a global variable; don't use document.pressed
function OnSubmitForm(form)
{
switch(pressed) {
case "Add":
form.action ="add.php";
return true;
case "Edit":
form.action ="edit.php";
return true;
case "Delete":
form.action ="delete.php";
return true;
}
alert("No submit pushed? How did we get here?");
return false;
}
</script>
</head>
<form method='post' onSubmit="return OnSubmitForm(this);">
<input type='text' id='F1' name='F1' value='' >
<input type='text' id='F2' name='F2' value='' >
<input type='text' id='F3' name='F3' value='' >
<table>
<tr>
<td align='left' width='55' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>id</td>
<td align='left' width='55' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>FirstName</td>
<td align='left' width='55' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>LastName</td>
<td align='center' width='55' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>Add_Edit_Delete</td>
</tr>
<?php

// Execute requested query
$sql = ("SELECT * FROM members ");
$result = mysql_query($sql);
while($row = mysql_fetch_assoc($result)){
$id = $row[id];
$FirstName = $row[firstname];
$LastName = $row[lastname];
echo "<tr>
<td>$id</td>
<td>$FirstName</td>
<td>$LastName</td>
<td>
<input type='image' id='$id,$FirstName,$LastName' onclick='Split(this,1);+pressed=Add;' src='/images/add.jpg'>
<input type='image' id='$id,$FirstName,$LastName' onclick='Split(this,1);+pressed=Edit;' src='/images/edit.jpg'>
<input type='image' id='$id,$FirstName,$LastName' onclick='Split(this,1);+pressed=Delete;' src='/images/delete.jpg'>
</td>
</tr>" ;
}
?>
</table>
</form>

Old Pedant
12-21-2010, 02:33 AM
AHHHHH!!! NOW I *FINALLY* understand the purpose of all your posts.

I have to tell you, I probably wouldn't have done it this way, at all.

I probably would have simply created a separate <form> for *EACH ROW*, using hidden form fields.

It would be tons simpler, in the long run. But I'm not fanatic about it. You want to see my idea or stick with this scheme?

DataTalk
12-21-2010, 02:38 AM
Thanks, Now you see it... I would love to see yours

Alse here is I wrote one that works,but the form creates a new row on each in submit so the report has 3 rows for each record.



<?php
include "includes/start_admin.php";
// You Are Now Connected - Session Started
?>
<script type="text/javascript">
function Split(sel,first)
{
if (sel.selectedIndex == 0 ) return;
var temp = sel.id.split(",");
sel.form1["F"+first].value = temp[0];
sel.form1["F"+(first+1)].value = temp[1];
sel.form1["F"+(first+2)].value = temp[2];
sel.form1["F"+(first+3)].value = temp[3];
}
</script>
<table border='1' width='700' bgcolor='#FBF9FB'>
<tr><td>
<div align='left'>

<table border='1' bordercolor='#c0c0c0' width='700' cellpadding='0' style='border-collapse: collapse; font-size: 8pt; font-family: Arial;' >
<tr>
<td align='left' width='55' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>Field</td>
<td align='left' width='55' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>Type</td>
<td align='left' width='55' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>Null</td>
<td align='left' width='55' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>Key</td>
<td align='left' width='55' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>Default</td>
<td align='left' width='55' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>Extra</td>
<td align='center' width='75' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>Add&nbsp;&nbsp;Edit&nbsp;&nbsp;Del</td>
</tr>
<?php
// get the selected table from database
$q= $_GET["q"];
$mytable = $_GET['q'] ;

// Define alternating row colors
$color1 = "#FFFFFF"; // white
$color2 = "#ECF1F2"; // blue
$row_count = 0;

// Execute requested query
$query = "SHOW COLUMNS FROM $mytable";
$result = mysql_query($query);
while($columns = mysql_fetch_assoc($result)) {
$row_color = ($row_count % 2) ? $color1 : $color2;
echo "<tr>
<td bgcolor='$row_color'><p style='margin-left: 10px; margin-top: 0; margin-bottom: 0'>($row_count) $columns[Field]</td>
<td bgcolor='$row_color'><p style='margin-left: 10px; margin-top: 0; margin-bottom: 0'>$columns[Type]</td>
<td bgcolor='$row_color'><p style='margin-left: 5px; margin-top: 0; margin-bottom: 0'>$columns[Null]</td>
<td bgcolor='$row_color'><p style='margin-left: 5px; margin-top: 0; margin-bottom: 0'>$columns[Key]</td>
<td bgcolor='$row_color'><p style='margin-left: 5px; margin-top: 0; margin-bottom: 0'>$columns[Default]</td>
<td bgcolor='$row_color'><p style='margin-left: 5px; margin-top: 0; margin-bottom: 0'>$columns[Extra]</td>
<td align='center' bgcolor='$row_color'><p style='margin-left: 5px; margin-top: 0; margin-bottom: 0'>
<form method='post' name='$row_count+1' action='sql_field_add.php'>
<input type='hidden' id='F101' name='F101' value='' >
<input type='hidden' id='F102' name='F102' value='' >
<button type='submit' id='$mytable,$columns[Field]' onClick='Split(this,101)' style='margin:0; border:0px solid #FFFFFF; padding: 0; width: 12px; height: 12px'>
<img src='static/icon25/add.jpg' style='border: 0px solid #E6E6FA word-spacing: 0; margin: 0; width: 12; height: 12;'></button></form>

<form method='post' name='$row_count+2' action='sql_field_edit.php'>
<input type='hidden' id='F201' name='F201' value='' >
<input type='hidden' id='F202' name='F202' value='' >
<input type='hidden' id='F203' name='F203' value='' >
<button type='submit' id='$mytable,$columns[Field],$columns[Field]' onClick='Split(this,201)' style='margin:0; border:0px solid #FFFFFF; padding: 0; width: 12px; height: 12px'>
<img src='static/icon25/edit.jpg' style='border: 0px solid #E6E6FA word-spacing: 0; margin: 0; width: 12; height: 12;'></button></form>

<form method='post' name='$row_count+3' action='sql_field_delete.php'>
<input type='hidden' id='F301' name='F301' value='' >
<input type='hidden' id='F302' name='F302' value='' >
<button type='submit' id='$mytable,$columns[Field]' onClick='Split(this,301)' style='margin:0; border:0px solid #FFFFFF; padding: 0; width: 12px; height: 12px'>
<img src='static/icon25/delete.jpg' style='border: 0px solid #E6E6FA word-spacing: 0; margin: 0; width: 12; height: 12;'></button></form>

</td>
</tr>" ;
// count row colors
$row_count++;
}
?>
</table>
&nbsp;&nbsp;<font face="Arial" size="2" color="#0000FF">Table Name <b><?php echo $mytable; ?></b></font>
</form>
</div>
</tr>
</table>

Old Pedant
12-21-2010, 02:39 AM
By the way, that code doesn't make sense on several fronts!

You split the ID and then you use *FOUR* parts from the result. But there are only 3 parts there. In addition, you put stuff into F1, F2, F3, F4...but there's no F4.

Finally, you are posting this page back to itself. So I guess using form fields named F1, F2, F3 is okay. But wouldn't it make more sense for the form fields to be named "id", "FirstName", "LastName"???

DataTalk
12-21-2010, 02:50 AM
By the way, that code doesn't make sense on several fronts!

You split the ID and then you use *FOUR* parts from the result. But there are only 3 parts there. In addition, you put stuff into F1, F2, F3, F4...but there's no F4.

Finally, you are posting this page back to itself. So I guess using form fields named F1, F2, F3 is okay. But wouldn't it make more sense for the form fields to be named "id", "FirstName", "LastName"???

I am using this script to add, edit, delete sql tables and fields. I was using the first posting as simple example because its easy to get confused when to much code is posted.

I just edited the posting, please don't be concerned about the xtra F1 F2 F3 because when this is done I will be adding additional values. I just want to be able to split and post to the proper add, edit, delete forms on one click, using an image instead of the html button. The code does work in all browsers but produces 3 rows for each record. Can I see your idea?

Old Pedant
12-21-2010, 03:02 AM
How's this?



<html>
<head>
<script type="text/javascript">
function formop(inp,op)
{
var form = inp.form;

form.action = op + ".php";

var temp = inp.split(",");
form.id.value = temp[0];
form.FirstName.value = temp[1];
form.LastName.value = temp[2];
}
</script>
<style type="text/css">
th {
color: #FFFF00;
background-color: #4C0902;
margin: 0 2px;
text-align: left;
}
</head>
<form method="post">
<input type="hidden" name="id">
<input type="hidden" name="FirstName">
<input type="hidden" name="LastName">

<table>
<tr>
<th>id</th>
<th>First Name</th>
<th>Last Name</th>
<th style="text-align: center;">Add/Edit/Delete</th>
</tr>
<?php

// Execute requested query
$sql = ("SELECT * FROM members ");
$result = mysql_query($sql);
while($row = mysql_fetch_assoc($result)){
$id = $row[id];
$FirstName = $row[firstname];
$LastName = $row[lastname];
echo "<tr>
<td>$id</td>
<td>$FirstName</td>
<td>$LastName</td>
<td>
<input type='image' id='$id,$FirstName,$LastName' onclick='formop(this,\"add\");' src='/images/add.jpg'>
<input type='image' id='$id,$FirstName,$LastName' onclick='formop(this,\"edit\");' src='/images/edit.jpg'>
<input type='image' id='$id,$FirstName,$LastName' onclick='formop(this,\"delete\");' src='/images/delete.jpg'>
</td>
</tr>" ;
}
?>
</table>
</form>
</body>
</html>

DataTalk
12-21-2010, 03:21 AM
I really appreciate your help and insight.

I will try this, and work it into my sql editor...

The reason I was using F1, F2, F3..... because the values change on each submit

Notice that I am using a SQL_Table report to get the field names for each table
The user can click the image Add, Edit, Delete to open the form I created for editing the table or fields.

For Add - TableName
For Edit - TableName, Field, Field, Type, Default, Key, Null (need field twice)
For Delete - TableName, Field

When the data is posted in the editor, I will simply convert the posted data depending on where it needs to be,

$TableName = $_POST[F1];
$FieldName = $_POST[F2];
and so on.....

DataTalk
12-21-2010, 04:05 AM
Here it is.. I revised the code for the sql editor I am working on, but it is not working...yet!




<?php
include "includes/start_admin.php";
// You Are Now Connected - Session Started
?>
<script type="text/javascript">
function formop(inp,op)
{
var form = inp.form;

form.action = op + ".php";

var temp = inp.split(",");
form.TableName.value = temp[0];
form.FieldName.value = temp[1];
}
</script>
<table border='1' width='700' bgcolor='#FBF9FB'>
<form method="post">
<input type="text" name="TableName">
<input type="text" name="FieldName">
<tr><td>
<div align='left'>

<table border='1' bordercolor='#C0C0C0' width='700' cellpadding='0' style='border-collapse: collapse; font-size: 8pt; font-family: Arial;' >
<tr>
<td align='left' width='55' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>Field</td>
<td align='left' width='55' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>Type</td>
<td align='left' width='55' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>Null</td>
<td align='left' width='55' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>Key</td>
<td align='left' width='55' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>Default</td>
<td align='left' width='55' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>Extra</td>
<td align='center' width='75' style='color: #FFFF00' bgcolor='#4C0902'><p style='margin: 0 2px'>Add&nbsp;&nbsp;Edit&nbsp;&nbsp;Del</td>
</tr>
<?php
// get the selected table from database
$q= $_GET["q"];
$mytable = $_GET['q'] ;

// Define alternating row colors
$color1 = "#FFFFFF"; // white
$color2 = "#ECF1F2"; // blue
$row_count = 0;

// Execute requested query
$query = "SHOW COLUMNS FROM $mytable";
$result = mysql_query($query);
while($columns = mysql_fetch_assoc($result)) {
$row_color = ($row_count % 2) ? $color1 : $color2;
echo "<tr>
<td bgcolor='$row_color'><p style='margin-left: 10px; margin-top: 0; margin-bottom: 0'>($row_count) $columns[Field]</td>
<td bgcolor='$row_color'><p style='margin-left: 10px; margin-top: 0; margin-bottom: 0'>$columns[Type]</td>
<td bgcolor='$row_color'><p style='margin-left: 5px; margin-top: 0; margin-bottom: 0'>$columns[Null]</td>
<td bgcolor='$row_color'><p style='margin-left: 5px; margin-top: 0; margin-bottom: 0'>$columns[Key]</td>
<td bgcolor='$row_color'><p style='margin-left: 5px; margin-top: 0; margin-bottom: 0'>$columns[Default]</td>
<td bgcolor='$row_color'><p style='margin-left: 5px; margin-top: 0; margin-bottom: 0'>$columns[Extra]</td>
<td align='center' bgcolor='$row_color'><p style='margin-left: 5px; margin-top: 0; margin-bottom: 0'>
<input type='image' id='$mytable,$columns[Field]' onclick='formop(this,\"Sql_field_add\");' src='static/icon16/add.jpg'>
<input type='image' id='$mytable,$columns[Field]' onclick='formop(this,\"Sql_field_edit\");' src='static/icon16/edit.jpg'>
<input type='image' id='$mytable,$columns[Field]' onclick='formop(this,\"Sql_field_delete\");' src='static/icon16/delete.jpg'>
</td>
</tr>" ;
// count row colors
$row_count++;
}
?>
</table>
&nbsp;&nbsp;<font face="Arial" size="2" color="#0000FF">Table Name <b><?php echo $mytable; ?></b></font>

</div>
</tr>
</form>
</table>

Old Pedant
12-21-2010, 04:14 AM
Well, I don't use PHP, so I'm not sure how much seeing the PHP code would help, but I'd think that a person would need to see the PHP for at least one of the posted-to pages to help with this.

DataTalk
12-21-2010, 05:00 AM
This test did not work!, The correct form opens, but the value does not post



<html>
</head>
<script type="text/javascript">
function formop(inp,op)
{
var form = inp.form;

form.action = op + ".php";

var temp = inp.split(",");
form.id.value = temp[0];
form.FirstName.value = temp[1];
form.LastName.value = temp[2];
}
</script>
</head>
<body>
<form method="post">
<input type="hidden" name="id">
<input type="hidden" name="FirstName">
<input type="hidden" name="LastName">

<input type='image' id='give,me,data' onclick='formop(this,"add");' src='static/icon16/add.jpg'>
<input type='image' id='give,me,data' onclick='formop(this,"edit");' src='static/icon16/edit.jpg'>
<input type='image' id='give,me,data' onclick='formop(this,"delete");'src='static/icon16/delete.jpg'>
</form>
</body>

DataTalk
12-21-2010, 06:40 AM
This test is not producing any results



<html>
</head>
<script type="text/javascript">
function formop(inp,op)
{
var form = inp.form;

form.action = op + ".php";

var temp = inp.split(",");
form.id.value = temp[1];
form.FirstName.value = temp[2];
form.LastName.value = temp[3];
}
</script>
</head>
<body>
<form method="post">
<input type="hidden" name="id">
<input type="hidden" name="FirstName">
<input type="hidden" name="LastName">

<input type='image' id='show,me,data' onclick='formop(this,"add")'; src='static/icon16/add.jpg'>
<input type='image' id='show,me,data' onclick='formop(this,"edit")'; src='static/icon16/edit.jpg'>
<input type='image' id='show,me,data' onclick='formop(this,"delete")'; src='static/icon16/delete.jpg'>
</form>
</body>




Php test


<?php
// php test the post results
$id = "$_POST[id]";
$firstname = "$_POST[FirstName]";
$lastname = "$_POST[LastName]";
// proof results
echo "<input type='text' name='id' value='$id'>";
echo "<input type='text' name='first' value='$firstname'>";
echo "<input type='text' name='last' value='$lastname'>";

?>

DataTalk
12-21-2010, 07:05 AM
Well, I don't use PHP, so I'm not sure how much seeing the PHP code would help, but I'd think that a person would need to see the PHP for at least one of the posted-to pages to help with this.


Found the error

var temp = inp.split(",");

Should Be
var temp = inp.id.split(",");

Old Pedant
12-21-2010, 08:07 PM
OH DOH DOH DOH on ME! Sheesh! Yes, so obvious. Just careless typing. Good catch!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum