Ok Another question

[Matthew Herren]

Ok on my form i would like to add a radio, or check box option to make two more fields available if selected.

say i have "Add 2[] 3[]  More Vehicles" and a user selects check box 2[X] and 2 fields drop down so they can fill out the info for 2 vehicles, and if three was selected they could fill out three fields, instead of one field.

 

could that be done with the if statement and echo or print?

[.josh]

I think you are saying you want to dynamically add form elements? Cannot do this with php.  You need to do it with javascript.

[halwaraj]

I agree with crayon.

 

What you can do is have all the form elements in the php. Hide the once you want to showup later using display:none as the style.

 

When the user clicks on one of the options, just change the style from display:none to display:block

 

 

[pdent1]

well you could do it to reload page when check of box 2 or 3 and then $cars= $_GET["Cars"] and reload with if $cars= "2"{ Show box 2  and end after box two  if $cars= "3" put that move cars=2 and then after box2 add a box 3 and end if at box 3. only way it can be done in php that i know of. I use this to move my shoutbox around my website between all 4 corners

[Matthew Herren]

well you could do it to reload page when check of box 2 or 3 and then $cars= $_GET["Cars"] and reload with if $cars= "2"{ Show box 2  and end after box two  if $cars= "3" put that move cars=2 and then after box2 add a box 3 and end if at box 3. only way it can be done in php that i know of. I use this to move my shoutbox around my website between all 4 corners

How could i set it to reload once an option is checked?

[.josh]

well, not exactly...in order to have it reload when the checkbox was checked, you would need js for that anyways.  What you are saying would be a link with a var attached to it.  That's not quite the same thing.  In addition to that, he will then have problems with previously filled out form field info being lost.  If you want to strictly do this with php, you could have some kind of "add another" button as a form submit button, so that when you press it, all of the current form info gets passed to the server.  Then check for the specific form submit button, echo out new elements based on that, meanwhile echoing out the previously posted info back into the original form fields. 

 

[pdent1]

well ya you could still pass it as a link and use ?name=$name&address=$address and use at header $name= $_GET on form names, like name address so it passes then set name and address value= $name,$address most likely the inputs will be blank when the page is first loaded 

[halwaraj]

well you could do it to reload page when check of box 2 or 3 and then $cars= $_GET["Cars"] and reload with if $cars= "2"{ Show box 2  and end after box two  if $cars= "3" put that move cars=2 and then after box2 add a box 3 and end if at box 3. only way it can be done in php that i know of. I use this to move my shoutbox around my website between all 4 corners

 

 

 

HAHAHAHA. . . People are forgetting that the above technique involves submitting the page.

This is not the right way. Reasons

- - Submiting a page and waiting for next page lot of time (min 30secs). Ridiculous. You want me to wait for 30 seconds just to see other two boxes???

- - What if I click on first radio(30 seconds), then second(30 seconds) and change my mind again and click first one again(30 seconds). So a total of close to or more than a minute just to make a choice???? :confused:

- - Maintaining the old data would be a problem  need to maintain it somehow

- -  This would increase server load and bandwidth usage as you are submitting the form a number of times  :o :o

 

Use javascript. Preferebly Jquery. Get following benefits:

- - instant display (dont have to download everytime. Need to show and hide the respective elements.)

- - What if I click on first radio(< 1 second), then second(< 1 second) and change my mind again and click first one again(< 1 second). So d total time taken here is practically the time taken to click ;D

- -No extra load as it is the clients machine that executes the javascript.

- - bandwidth usage reduced.

 

 

Praveen

[Matthew Herren]

would this work??

<div class="form">
<ul>
<form name="auto1" method="post" action="submit.php" onsubmit="return Validate();">
<li><H2>Vehicle Information</H2></li>
<li><div id='auto1_errorloc' class='error_strings'></li>
<li>Vehicle 1</li>
<li>
<label for="make">Make</label>
<input type="text" name="make" maxlength="20">
</li>
<label for="model">Model</label>
<input type="text" name="model" maxlength="20">
</li>
<label for="color">Color</label>
<input type="text" name="color" maxlength="10">
</li>
<label for="plate">Plate #</label>
<input type="text" name="plate" maxlength="7">
</li>
<li>
    <button type="button" value="Add 1" name="1">
    <button type="button" value="Add 2" name="2">
<?PHP
$button_name = "name"

  if ($button name=="1") echo "
<li>Vehicle 2</li>
<li>
<label for="make">Make</label>
<input type="text" name="make" maxlength="20">
</li>
<label for="model">Model</label>
<input type="text" name="model" maxlength="20">
</li>
<label for="color">Color</label>
<input type="text" name="color" maxlength="10">
</li>
<label for="plate">Plate #</label>
<input type="text" name="plate" maxlength="7">
</li>";

  if ($button name=="2") echo "
<li>Vehicle 2</li>
<li>
<label for="make2">Make</label>
<input type="text" name="make" maxlength="20">
</li>
<label for="model2">Model</label>
<input type="text" name="model" maxlength="20">
</li>
<label for="color2">Color</label>
<input type="text" name="color" maxlength="10">
</li>
<label for="plate2">Plate #</label>
<input type="text" name="plate" maxlength="7">
</li>
<li>Vehicle 3</li>
<li>
<label for="make3">Make</label>
<input type="text" name="make" maxlength="20">
</li>
<label for="model3">Model</label>
<input type="text" name="model" maxlength="20">
</li>
<label for="color3">Color</label>
<input type="text" name="color" maxlength="10">
</li>
<label for="plate3">Plate #</label>
<input type="text" name="plate" maxlength="7">
</li>
";

else ???

?>

<li>
    <button type="reset" value="Reset">Reset</button>
    <button type="submit" value="Submit">Step 2</button>
</li>
</ul>
</form>

[pdent1]

*THIS IS AFTER $_GET

$carz=$_GET("Cars")

 

If ($carz=="cars2"){ $carz1 = checked }

If ($carz=="cars3"){ $carz2 = checked }

 

<input type="radio" name="cars" value="cars2" <? echo $carz1 ?> <? onclick="window.location='http://www.yourpage.com/page?Cars=2';" />

<input type="radio" name="cars" value="cars3" <? echo $carz2 ?> onclick="window.location='http://www.yourpage.com/page?Cars=3';" />

 

 

no because your buttons have already been processed when pageloads..Give me one sec to edit your script with this script and add all the form values and I'll test it and post here when I finished

[pdent1]

 

 

 

HAHAHAHA. . . People are forgetting that the above technique involves submitting the page.

This is not the right way. Reasons

- - Submiting a page and waiting for next page lot of time (min 30secs). Ridiculous. You want me to wait for 30 seconds just to see other two boxes???

- - What if I click on first radio(30 seconds), then second(30 seconds) and change my mind again and click first one again(30 seconds). So a total of close to or more than a minute just to make a choice???? :confused:

- - Maintaining the old data would be a problem  need to maintain it somehow

- -  This would increase server load and bandwidth usage as you are submitting the form a number of times  :o :o

 

Use javascript. Preferebly Jquery. Get following benefits:

- - instant display (dont have to download everytime. Need to show and hide the respective elements.)

- - What if I click on first radio(< 1 second), then second(< 1 second) and change my mind again and click first one again(< 1 second). So d total time taken here is practically the time taken to click ;D

- -No extra load as it is the clients machine that executes the javascript.

- - bandwidth usage reduced.

 

 

Praveen

well then you should get a faster connection code for this is short  well then you do it in javascript  EH I'll just do it in javascript and stop whining.

[mikesta707]

HAHAHAHA. . . People are forgetting that the above technique involves submitting the page.

This is not the right way. Reasons

- - Submiting a page and waiting for next page lot of time (min 30secs). Ridiculous. You want me to wait for 30 seconds just to see other two boxes???

- - What if I click on first radio(30 seconds), then second(30 seconds) and change my mind again and click first one again(30 seconds). So a total of close to or more than a minute just to make a choice???? :confused:

- - Maintaining the old data would be a problem  need to maintain it somehow

- -  This would increase server load and bandwidth usage as you are submitting the form a number of times  :o :o

 

Use javascript. Preferebly Jquery. Get following benefits:

- - instant display (dont have to download everytime. Need to show and hide the respective elements.)

- - What if I click on first radio(< 1 second), then second(< 1 second) and change my mind again and click first one again(< 1 second). So d total time taken here is practically the time taken to click ;D

- -No extra load as it is the clients machine that executes the javascript.

- - bandwidth usage reduced.

 

 

Praveen

 

While I do agree javascript is the best way (No real need to use Jquery for something as simple as this, but you can if you want) Your statements are rather ludicrous. 30 seconds per page load, especially if its a rather simple form, as quite a stretch, especially if the server isn't terrible, and the user has a high speed connection. I would say its more around 5-10 seconds, 15 at most with a high speed connection. Maintaining the old data is not really a problem at all, if you followed what CV said, but bandwidth may become a problem if your websites servers a large audience.

 

And there are also problems with javascript, mainly that a user may have javascript disabled.

 

However, I do agree that the pros of javascript far outweight the cons. Its much faster, cleaner, and easier to maintain

[pdent1]

<head>
<script type="text/JavaScript">

<!--
function show(id)
{
     if (document.getElementById(id).style.display == 'none')
     {
          document.getElementById(id).style.display = '';
     }
}
//-->

<!--
function hide(id)
{
          document.getElementById(id).style.display = 'none';

}

</script>
</head>
</head>
<div class="form">
<ul>
<form name="auto1" method="post" action="submit.php" onsubmit="return Validate();">




<li><H2>Vehicle Information</H2></li>
<li><div id='auto1_errorloc' class='error_strings'></li>
<li>Vehicle 1</li>
<li>
<label for="make">Make</label>
<input type="text" name="make" maxlength="20">
</li>
<label for="model">Model</label>
<input type="text" name="model" maxlength="20">
</li>
<label for="color">Color</label>
<input type="text" name="color" maxlength="10">
</li>
<label for="plate">Plate #</label>
<input type="text" name="plate" maxlength="7">
</li>
<li>

        <font style="FONT-SIZE: 10pt; FONT-FAMILY: 'Arial Narrow'">2 Cars</font>
        <input type="radio" name="cars" value="cars2" onfocus="show('car2Tbl');return true;" id="cars2"  />
        <font style="FONT-SIZE: 10pt; FONT-FAMILY: 'Arial Narrow'">3 Cars</font>
        <input type="radio" name="cars" value="cars3" onfocus="show('car2Tbl');show('car3Tbl');return true;" id="cars3" />


<?PHP



<li>Vehicle 2</li>
<li>
<label for="make">Make</label>
<input type="text" name="make" maxlength="20">
</li>
<label for="model">Model</label>
<input type="text" name="model" maxlength="20">
</li>
<label for="color">Color</label>
<input type="text" name="color" maxlength="10">
</li>
<label for="plate">Plate #</label>
<input type="text" name="plate" maxlength="7">
</li>";

  <table id="car2Tbl" style="display:none;" cols=1 cellpadding=2>
<li>Vehicle 2</li>
<li>
<label for="make2">Make</label>
<input type="text" name="make" maxlength="20">
</li>
<label for="model2">Model</label>
<input type="text" name="model" maxlength="20">
</li>
<label for="color2">Color</label>
<input type="text" name="color" maxlength="10">
</li>
<label for="plate2">Plate #</label>
<input type="text" name="plate" maxlength="7">
</li>
  </table>

  <table id="car3Tbl" style="display:none;" cols=1 cellpadding=2>
<li>Vehicle 3</li>
<li>
<label for="make3">Make</label>
<input type="text" name="make" maxlength="20">
</li>
<label for="model3">Model</label>
<input type="text" name="model" maxlength="20">
</li>
<label for="color3">Color</label>
<input type="text" name="color" maxlength="10">
</li>
<label for="plate3">Plate #</label>
<input type="text" name="plate" maxlength="7">
</li>
</table>
";

else ???

?>

<li>
    <button type="reset" value="Reset">Reset</button>
    <button type="submit" value="Submit">Step 2</button>
</li>
</ul>
</form>

 

Tell me if this works for you Also if you want me to do it in php just so you can see and learn from it I'll be glad to do that. Error increases brain mass

[Matthew Herren]

Parse error: syntax error, unexpected '<' in /home/content/d/h/e/dherren/html/formdata/auto/try.php on line 89

 

how would it be don in php if you don't mind. yeah i learn better through my mistakes.

[.josh]

Okay it's been a long time since "people might have javascript disabled" to be an issue to actually consider.  Simply throwing a "you must have js enabled for full functionality" inside a noscript tag is more than sufficient these days.  The only "disabling javascript" issuea that should be considered these days is to not do things like validate user input with js (which you'd be surprised how many sites actually do this...), make sure your backend can do what it needs to do for data that would not come in if it happens to be disabled, etc... in short, if you are trying to come up with a strictly php solution to this "feature" solely because "people might have javascript disabled," it's really not worth it.

[pdent1]

matt counting to line 89 let me get there and i'll fix it.

[pdent1]

<head>

<script type="text/JavaScript">


function show(id)
{
     if (document.getElementById(id).style.display == 'none')
     {
          document.getElementById(id).style.display = '';
     }
}


function hide(id)
{
          document.getElementById(id).style.display = 'none';

}

</script>
</head>

<body>
<table cellspacing=1 cols=3 border=0>
    <tbody>
    <tr valign=top align=left>
      <td width=202><font style="FONT-SIZE: 10pt; FONT-FAMILY: 'Arial Narrow'"><b>


<div class="form">
<ul>
<form name="auto1" method="post" action="submit.php" onsubmit="return Validate();">




<li><H2>Vehicle Information</H2></li>
<li><div id='auto1_errorloc' class='error_strings'></li>
<li>Vehicle 1</li>
<li>
<label for="make">Make</label>
<input type="text" name="make" maxlength="20">
</li>
<label for="model">Model</label>
<input type="text" name="model" maxlength="20">
</li>
<label for="color">Color</label>
<input type="text" name="color" maxlength="10">
</li>
<label for="plate">Plate #</label>
<input type="text" name="plate" maxlength="7">
</li>
<li>
</b></font></td>
      <td width=21> </td>
      <td width=481> <font style="FONT-SIZE: 10pt; FONT-FAMILY: 'Arial Narrow'">
        Cars2</font>
        <input type="radio" name="cars" value="cars2" onfocus="hide('cars3');show('cars2');return true;" id="cars2"  />
        <font style="FONT-SIZE: 10pt; FONT-FAMILY: 'Arial Narrow'">Cars3</font>
        <input type="radio" name="cars" value="cars3" onfocus="show('cars2');show('cars3');return true;" id="cars3" />
      </td>
    </tr>
    </tbody>
  </table>
  <br>
  <table id="cars2" style="display:none;" cols=1 cellpadding=2>
    <tbody>
    <tr valign=top align=left>
     
    <td width=699><li>Vehicle 2</li>
<li>
<label for="make2">Make</label>
<input type="text" name="make" maxlength="20">
</li>
<label for="model2">Model</label>
<input type="text" name="model" maxlength="20">
</li>
<label for="color2">Color</label>
<input type="text" name="color" maxlength="10">
</li>
<label for="plate2">Plate #</label>
<input type="text" name="plate" maxlength="7">
</li>
        </font> </p>
      </td>
    </tr>
    </tbody>
  </table>
  <table id="cars3" style="display:none;" cols=1 cellpadding=2>
    <tbody>
    <tr valign=top align=left>
      <td width=698>
       
      <li>Vehicle 3</li>
<li>
<label for="make3">Make</label>
<input type="text" name="make" maxlength="20">
</li>
<label for="model3">Model</label>
<input type="text" name="model" maxlength="20">
</li>
<label for="color3">Color</label>
<input type="text" name="color" maxlength="10">
</li>
<label for="plate3">Plate #</label>
<input type="text" name="plate" maxlength="7">
</li>
   </font> </p>
      </td>
    </tr>
    </tbody>
  </table>

<li>
    <button type="reset" value="Reset">Reset</button>
    <button type="submit" value="Submit">Step 2</button>
</li>
</ul>
</form>
</body>

 

working needs sprucing but hey its what you asked for didn't test submitting with it and all that last error i left in the <?PHP  and it can be ran as a .html .php since there is no php

[pdent1]

if you are happy and it works click solved at bottom left  If not I can adjust it to make you happy

[Matthew Herren]

sorry i had a b-day party to attend

well i'm getting a error in my submit page now so let me figure it out.

[Matthew Herren]

well it didn't echo anything when checked

[pdent1]

what do you mean echo anything. There is no php in that code so nothing is echoed. Worked fine with me? Tell me what it does for you and what your need I might have changed your submit so check it out I don't know your submit page so I don't know how the 3 tables are submitted.

[Matthew Herren]

well i'm working on that part can't seem to get the connection right.