Dynamic text boxes
Moderator: General Moderators
Dynamic text boxes
Hi everyone, I'm new member to the forum, this website has been so useful in the past on solving my PHP problems and helping me understand more about php coding in general.
I am currently working on upgrading my companies website with PHP and MySQL, and I hit a stumbling block maybe because I'm not to good at PHP theory, or the flow of data...?
Here's my problem...
I have a form where field techs can close out service calls, Time in, time out, work done, who the tech is....ect...
Currently I have 20 fields for parts..... Part1 / Part1QTY....and so on to Part10 / Part10QTY....
the form emails, and it also feeds data into MySQL... so everything is working fine...
What I would like to do, is stream line it...so there is only 2 fields...part_number and qty....and when techs needs to enter more parts then click on a button that creates 2 new sets of text boxes for input....
thus allowing me to have them enter more the just 10 parts and qty's.
I thought about, maybe having a secondary form on my HTML page, with different sets of submit buttons, and they can enter 1 part at a time... but I could not get the secondary form Submit button to not clear the data in the primary form...so that didn't work for me.!
I'm am basically stuck here... there maybe one or two other issues I have...but those are not so critical.
Any thoughts on this or recommendations on how I should approach the problem would be greatly appreciated.
I do have a great deal of MS Access experience but this PHP is a totally different monster. For those who know access, it's very easy to add a new record in a subform and just keep adding records...which is sort of what I'm trying to do here....
Thanks again.... Eddie.
I am currently working on upgrading my companies website with PHP and MySQL, and I hit a stumbling block maybe because I'm not to good at PHP theory, or the flow of data...?
Here's my problem...
I have a form where field techs can close out service calls, Time in, time out, work done, who the tech is....ect...
Currently I have 20 fields for parts..... Part1 / Part1QTY....and so on to Part10 / Part10QTY....
the form emails, and it also feeds data into MySQL... so everything is working fine...
What I would like to do, is stream line it...so there is only 2 fields...part_number and qty....and when techs needs to enter more parts then click on a button that creates 2 new sets of text boxes for input....
thus allowing me to have them enter more the just 10 parts and qty's.
I thought about, maybe having a secondary form on my HTML page, with different sets of submit buttons, and they can enter 1 part at a time... but I could not get the secondary form Submit button to not clear the data in the primary form...so that didn't work for me.!
I'm am basically stuck here... there maybe one or two other issues I have...but those are not so critical.
Any thoughts on this or recommendations on how I should approach the problem would be greatly appreciated.
I do have a great deal of MS Access experience but this PHP is a totally different monster. For those who know access, it's very easy to add a new record in a subform and just keep adding records...which is sort of what I'm trying to do here....
Thanks again.... Eddie.
Hello,
Welcome to the forums!
This could be solved in several ways. What immediately springs to mind is using javascript to create more form fields. Or having the form fields already there, hidden by css (which when a "more" link is clicked will unhide a few more form fields).
Alternatively, you could have the "more" as your submit button.. submit the X number they entered, and redirect back to the original form.
Welcome to the forums!
This could be solved in several ways. What immediately springs to mind is using javascript to create more form fields. Or having the form fields already there, hidden by css (which when a "more" link is clicked will unhide a few more form fields).
Alternatively, you could have the "more" as your submit button.. submit the X number they entered, and redirect back to the original form.
Set Search Time - A google chrome extension. When you search only results from the past year (or set time period) are displayed. Helps tremendously when using new technologies to avoid outdated results.
Hi Scottayy, thanks for the reply, someone on a different forum had sent me a sample code of Java doing exactly what you mentioned.... which creates more fields for data entry .....now my question is and I haven't tried it because I just got back to the office....If I run a php script to insert those values into MySQL...will in insert only the first row or all the newly created rows as well... ?scottayy wrote:Hello,
Welcome to the forums!
This could be solved in several ways. What immediately springs to mind is using javascript to create more form fields. Or having the form fields already there, hidden by css (which when a "more" link is clicked will unhide a few more form fields).
Alternatively, you could have the "more" as your submit button.. submit the X number they entered, and redirect back to the original form.
I'm going to try out what he had sent me... and I'll post back my progress.
Thanks for your quick reply and suggestions.
Hi there,
Any chance you could post up the solution to these forums also as I've been searching the internet for a couple of weeks looking for something like that.
I need some sort of code to dynamically create new text fields, similar to at this web site: http://www.quirksmode.org/dom/domform.html except using javascript.
Any chance you could post up the solution to these forums also as I've been searching the internet for a couple of weeks looking for something like that.
I need some sort of code to dynamically create new text fields, similar to at this web site: http://www.quirksmode.org/dom/domform.html except using javascript.
Another approach you might want to consider is Ajax. Using Ajax, you could have a single part/qty data entry with two buttons, "Submit, Add Another" and "Submit, Done" or something like that. Then, without refreshing the current document, your Javascript could submit the data for one part, clear the data in the controls and be ready for the next one (or, if the other button is pressed, go on to whatever is next in your process). It's a smooth operation and if you already know Javascript, is easy to code.
- CoderGoblin
- DevNet Resident
- Posts: 1425
- Joined: Tue Mar 16, 2004 10:03 am
- Location: Aachen, Germany
This is where I throw my 2 cents in.. First thing is to do it using standard PHP and submit form. Simply keep track of how many rows there are and possibly increment. Then look at possibilities such as AJAX to enhance the solution so that users don't have to keep pressing submit and loading the entire page again - but keep the original methodology working alongside (the use of hiding a submit button using the <noscript> html tag is useful here).
Yup, that's good advice.CoderGoblin wrote:This is where I throw my 2 cents in.. First thing is to do it using standard PHP and submit form. Simply keep track of how many rows there are and possibly increment. Then look at possibilities such as AJAX to enhance the solution so that users don't have to keep pressing submit and loading the entire page again - but keep the original methodology working alongside (the use of hiding a submit button using the <noscript> html tag is useful here).
feyd | Please use
db_connect.php
feyd | Please use
Code: Select all
,Code: Select all
and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]
Hi mcccy005 I've been working with another programmer from another forum, and we finished (98% him) with my goals for the short term ...works great...here is the code...and much thanks to Chris from [url]http://www.dhtmlgoodies.com/forum/viewtopic.php?p=9487#9487[/url]
feel free to write back and ask questions...
main.phpCode: Select all
<?php include("include/db_connect.php"); ?>
<?php
if (isset($_POST['part']))
{
//Count parts in array
$total_parts=(count($_POST["part"]));
// loop to define insert data (remember that the array keys start from 0)
$data_insert='';
foreach($_POST["part"] as $key=>$val){
$data_insert.='("'.$val.'","'.$_POST["qty"][$key].'"),';
}
//remove last comma
$data_insert=substr($data_insert,0,-1);
print "$data_insert";
$sql="INSERT INTO tbl_service_calls_parts (part_number,qty) VALUES ".$data_insert."";
if (!mysql_query($sql))
{
die('Error: ' . mysql_error());
}
mysql_close($con);
?>
<?php
} else { // if form hasn't been submitted
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Dynamic fields</title>
<script language="javascript">
var counter=1;
function addRow() {
counter=counter+1;
//Alert(counter);
var tbody = document.getElementById("table1").getElementsByTagName("tbody")[0];
var row = document.createElement("TR");
//Number
var cell1 = document.createElement("TD");
var cell1 = document.createElement("TD");
//cell1.setAttribute("class","list_side");
//cell1.setAttribute("className","list_side");
cell1.innerHTML = " "+counter+"";
//Part
var cell2 = document.createElement("TD");
var inp2 = document.createElement("INPUT");
inp2.setAttribute("type","text");
inp2.setAttribute("name","part["+counter+"]");
cell2.appendChild(inp2);
//Quantity
var cell3 = document.createElement("TD");
var inp3 = document.createElement("INPUT");
inp3.setAttribute("type","text");
inp3.setAttribute("name","qty["+counter+"]");
inp3.setAttribute("value","");
inp3.setAttribute("size","6");
cell3.appendChild(inp3);
row.appendChild(cell1);
row.appendChild(cell2);
row.appendChild(cell3);
tbody.appendChild(row);
//alert(row.innerHTML);
}
</script>
</head>
<body>
<form name="form1" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<p> </p>
<table width='200' align='center' id='table1'>
<tr>
<td> </td>
<td class='list_data' colspan='2'><input name="button" type='button' onClick='addRow();' value='New Part'></td>
</tr>
<tr>
<td> </td>
<td class='list_title'>Part Number</td>
<td class='list_title'>Qty</td>
</tr>
<tr>
<td class='list_side'>1</td>
<td><input type='text' name='part[]' size='20'></td>
<td><input type='text' name='qty[]' size='6'></td>
</tr>
</table>
<p>
<label>
<div align="center">
<input type="submit" name="Submit" value="Submit">
</div>
</label>
</p>
</form>
<?php
}
?>
</body>
</html>Code: Select all
<?php
$db_host = 'localhost';
$db_user = 'root';
$db_pass = '';
$db_name = 'web_db';
$con = mysql_connect($db_host,$db_user,$db_pass)
or die("Could not connect to host $db_host");
//** remove mark to test connection print "conntect to $db_host";
$db_select = mysql_select_db($db_name)
or die("Could not connect to database $db_name");
//** remove mark to test connection print "conntect to $db_name";
?>Code: Select all
CREATE TABLE `tbl_service_calls_parts` (
`call_id` int(11) default NULL,
`part_number` varchar(12) default NULL,
`qty` int(11) default NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
mcccy005 wrote:Hi there,
Any chance you could post up the solution to these forums also as I've been searching the internet for a couple of weeks looking for something like that.
I need some sort of code to dynamically create new text fields, similar to at this web site: http://www.quirksmode.org/dom/domform.html except using javascript.
feyd | Please use
Code: Select all
,Code: Select all
and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]