lebun
Posts: 10
|
| Posted: 11/08/2008, 12:32 PM |
|
I have the PHP project with record form (record builder)
I want to modify it to form with dynamic number of textboxes.
My form has 10 textbox fields (default 1st is visible true and other are visible false)
exemple:
if ($form->textbox1->value!="") $form->textbox2->Visible=true;
if ($form->textbox1->value=="") $form->textbox2->Visible=false;
if ($form->textbox1->value!="") $form->textbox3->Visible=true;
if ($form->textbox2->Visible==false) $form->textbox3->Visible=false;
.....
.....
.....
.....
.....
I want to do it witchout click insert button.
Who nows how can I do it.
|
 |
 |
maxhugen
Posts: 272
|
| Posted: 11/08/2008, 5:47 PM |
|
It sounds as though when the user enters something in textbox1, you want textbox2 to become visible, and so on?
If that's correct, then you would probably want to use some client-side javascript to display the textboxes as the user progressively enters data.
_________________
Max
www.gardenloco.com | www.eipdna.com | www.chrisarminson.com |
|
|
|
melvyn
Posts: 333
|
| Posted: 11/08/2008, 6:47 PM |
|
As maxhugent told you, it needs javascript. Search this forums for jquery hide and show. There are some post, see my reply and use it.
http://forums.yessoftware.com/posts.php?post_id=101266&...query+hide+show
http://forums.yessoftware.com/posts.php?post_id=101340&...query+hide+show
Enjoy!
_________________
Melvyn Perez
Puro Codigo
http://purocodigo.com |
|
|
|
lebun
Posts: 10
|
| Posted: 11/09/2008, 2:40 AM |
|
Can You halp me do it step by step.
I have writen to section HEAD
<script language="JavaScript">
function showField2() {
document.forms[0].field2.style.display = '';
}
function hideField2(){
document.forms[0].field2.style.display = 'none';
}
</script>
next in the section body
<input onclick="showField2()" maxlength="25" size="25" name="field1">
<input style="display: none" maxlength="25" size="25" name="field2">
but it doesnt work.
Can I modify the my existing form in PHP page.
My form:
---------------------------------------------------------------------------------------------------------------------
<!-- BEGIN Record transport -->
<form id="transport" name="{HTMLFormName}" action="{Action}" method="post">
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td>
<tr class="Controls">
<td class="th"><label for="transportdeparture">Departure</label></td>
<td><input id="transportdeparture" maxlength="30" size="30" value="{departure}" name="{departure_Name}"></td>
</tr>
<tr class="Controls">
<td class="th"><label for="transportarrival">Arrival</label></td>
<td><input id="transportarrival" maxlength="30" size="30" value="{arrival}" name="{arrival_Name}"></td>
</tr>
<tr class="Controls">
<td class="th"><label for="transportthrough1">Through</label></td>
<td>
<input id="transportthrough1" maxlength="30" size="30" value="{through1}" name="{through1_Name}"><br>
<input id="transportthrough2" maxlength="30" size="30" value="{through2}" name="{through2_Name}"><br>
<input id="transportthrough3" maxlength="30" size="30" value="{through3}" name="{through3_Name}"><br>
<input id="transportthrough4" maxlength="30" size="30" value="{through4}" name="{through4_Name}"><br>
<input id="transportthrough5" maxlength="30" size="30" value="{through5}" name="{through5_Name}"><br>
</tr>
<tr class="Bottom">
<td align="right" colspan="2">
<!-- BEGIN Button Button_Insert -->
<input class="Button" id="transportButton_Insert" type="submit" alt="Add" value="Add" name="{Button_Name}">
<!-- END Button Button_Insert -->
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>
<!-- END Record transport --></p>
----------------------------------------------------------------------------------------------------------------------
Can You help me to modify this form or create the new.
|
|
|
|
jjrjr1
Posts: 942
|
| Posted: 11/09/2008, 7:15 AM |
|
Hi
I am confused as to what you are trying to accomplish. Are wanting to do what Max above suggests?
Little more detail needed
_________________
John Real - More CodeCharge Studio Support at - http://CCSElite.com |
|
|
|
maxhugen
Posts: 272
|
| Posted: 11/09/2008, 2:13 PM |
|
I'm guessing that you're dealing with a transport schedule of some sort? Is it the fields "transportthrough1" to "transportthrough5" you want to progressively show as data is entered? If so, I'd suggest:
1. Create function HideShowFields to set the display of all 5 fields.
2. Bind the On Change event of the fields to function HideShowFields.
3. Run the bind function when the window opens.
function HideShowFields() {
if (document.getElementById("transportthrough1").value)
document.getElementById("transportthrough2").style.display="";
else
document.getElementById("transportthrough2").style.display="none";
if (document.getElementById("transportthrough2").value)
document.getElementById("transportthrough3").style.display="";
else
document.getElementById("transportthrough3").style.display="none";
if (document.getElementById("transportthrough3").value)
document.getElementById("transportthrough4").style.display="";
else
document.getElementById("transportthrough4").style.display="none";
if (document.getElementById("transportthrough4").value)
document.getElementById("transportthrough5").style.display="";
else
document.getElementById("transportthrough5").style.display="none";
}
function bind_events() {
addEventHandler("transportthrough1", "change", HideShowFields);
addEventHandler("transportthrough2", "change", HideShowFields);
addEventHandler("transportthrough3", "change", HideShowFields);
addEventHandler("transportthrough4", "change", HideShowFields);
}
window.onload = bind_events;
The only other thing you should do is set the initial display of fields 2-5 to none, eg:
<input id="transportthrough2" style="display:none" maxlength="30" size="30" value="{through2}" name="{through2_Name}">
HTH
_________________
Max
www.gardenloco.com | www.eipdna.com | www.chrisarminson.com |
|
|
|
lebun
Posts: 10
|
| Posted: 11/09/2008, 3:19 PM |
|
Thanks maxhugen !
It would be ok but this form has the same size.
These fields are hide but form high size is still the same, and after wrote text i must click somewhere out of this textbox to show me the next new textbox.
|
|
|
|
maxhugen
Posts: 272
|
| Posted: 11/09/2008, 4:34 PM |
|
Quote :Thanks maxhugen ! It would be ok but this form has the same size. These fields are hide but form high size is still the same, and after wrote text i must click somewhere out of this textbox to show me the next new textbox.
Yes, I see your point.
Re the form size, you might like to consider setting the fields to disabled, rather than hiding them? This not only keeps the form height constant, but also lets the user see that there are more fields available...
If not, you can 'wrap' the textbox in a <div> element, then hide/show the div instead of the textbox.
Now, as to the 'flow' of entering data... if the user 'tabs' from the texbox, the onchange event will fire. So, in the HideShowFields() function, you could also set focus to the next textbox that you have just made visible (or enabled).
It might help (if possible) to have another texbox after your set of 5, as it would offer users who like to 'click', somewhere to go...
HTH
_________________
Max
www.gardenloco.com | www.eipdna.com | www.chrisarminson.com |
|
|
|
|
