• 1

Read this first!

We do not monitor these forums. The forum is provided to exchange information and experience with other users ONLY. Forum responses are not guaranteed.

However, please submit a ticket if you have an active subscription and wish to receive support. Our ticketing system is the only way of getting in touch with RSJoomla! and receiving the official RSJoomla! Customer Support.

For more information, the Support Policy is located here.

Thank you!

TOPIC: Split a text box into multiple text boxes

Split a text box into multiple text boxes 14 years 6 months ago #8963

Hello,

Is there an automated way to split a text box into two or more textboxes?

I need to split my phone number field into three separate fields (one for area code, one for first three number, one for last four). I know I can have a separate form for each, but I'm wondering if there is a way to "link" these together so they get submitted as a single value.

Thanks,
The administrator has disabled public write access.

Re:Split a text box into multiple text boxes 13 years 11 months ago #10614

Hello,

I need same thing 3 textboxes for phone field.
Please help in this regard.
The administrator has disabled public write access.

Re:Split a text box into multiple text boxes 13 years 10 months ago #10693

  • lroberts
  • lroberts's Avatar
  • OFFLINE
  • Fresh Boarder
  • Posts: 5
skalka.lukasz wrote:
Hello,

Is there an automated way to split a text box into two or more textboxes?

I need to split my phone number field into three separate fields (one for area code, one for first three number, one for last four). I know I can have a separate form for each, but I'm wondering if there is a way to "link" these together so they get submitted as a single value.

Thanks,

This is actually possible. Here's what you do:

1. Create THREE (3) different fields. Name it Phone1 Phone2 or Phone3, something similar. I like to make my fields sizes: 3, 3, 4. You know... for the sake of it being a phone number.

2. Go into the FORM LAYOUT tab, automatically generate the layout however you want it, and then UN-CHECK AUTO GENERATE LAYOUT.

3. Find the codes that look like this:
Inline

<tr>
<td>{Phone1:caption} (*)</td>
<td>{Phone1:body}<div class="clr"/>{Phone1:validation}</td>
<td>{Phone1:description}</td>
</tr>
<tr>
<td>{Phone2:caption} (*)</td>
<td>{Phone2:body}<div class="clr"/>{Phone2:validation}</td>
<td>{Phone2:description}</td>
</tr>
<tr>
<td>{Phone3:caption} (*)</td>
<td>{Phone3:body}<div class="clr"/>{Phone3:validation}</td>
<td>{Phone3:description}</td>
</tr>


CHANGE IT TO:

<tr>
<td>{Phone1:caption} (*)</td>
<td>{Phone1:body}-{Phone2:body}-{Phone3:body}<div class="clr"/>{Phone1:validation}{Phone2:validation}{Phone3:validation}</td>
<td>{Phone1:description}</td>
</tr>
2 Lines

{Phone1:caption} (*)<br/>
{Phone1:body}<br/>
{Phone1:validation}
{Phone1:description}<br/>
{Phone2:caption} (*)<br/>
{Phone2:body}<br/>
{Phone2:validation}
{Phone2:description}<br/>
{Phone3:caption} (*)<br/>
{Phone3:body}<br/>
{Phone3:validation}
{Phone3:description}<br/>


CHANGE IT TO:

{Phone1:caption} (*)<br/>
{Phone1:body}-{Phone2:body}-{Phone3:body}<br/>
{Phone1:validation}{Phone2:validation}{Phone3:validation}
{Phone1:description}{Phone2:description}{Phone3:description}<br/>

2 Columns Inline

<div class="componentheading">{global:formtitle}</div>
<table border="0">
<tr>
<td valign="top">
<table border="0">
<tr>
<td>{Phone1:caption} (*)</td>
<td>{Phone1:body}<br/>
{Phone1:validation}</td>
<td>{Phone1:description}</td>
</tr>
<tr>
<td>{Phone3:caption} (*)</td>
<td>{Phone3:body}<br/>
{Phone3:validation}</td>
<td>{Phone3:description}</td>
</tr>
</table>

</td>
<td valign="top">
<table border="0">
<tr>
<td>{Phone2:caption} (*)</td>
<td>{Phone2:body}<br/>
{Phone2:validation}</td>
<td>{Phone2:description}</td>
</tr>
</table>

</td>
</tr>
</table>

CHANGE IT TO

<div class="componentheading">{global:formtitle}</div>
<table border="0">
<tr>
<td valign="top">
<table border="0">
<tr>
<td>{Phone1:caption} (*)</td>
<td>{Phone1:body}{Phone2:body}{Phone3:body}<br/>
{Phone1:validation}{Phone2:validation}{Phone3:validation}</td>
<td>{Phone1:description}{Phone2:description}{Phone3:description}</td>
</tr>
<tr>

</tr>
</table>

</td>
<td valign="top">
<table border="0">
<tr>

</tr>
</table>

</td>
</tr>
</table>

TO MAKE IT EASIER, REPLACE THE PHONE1 CODE WITH THE FOLLOWING:
<tr>
<td>{Phone1:caption} (*)</td>
<td>{Phone1:body}{Phone2:body}{Phone3:body}<br/>
{Phone1:validation}{Phone2:validation}{Phone3:validation}</td>
<td>{Phone1:description}{Phone2:description}{Phone3:description}</td>
</tr>
DON'T FORGET TO DELETE THE PHONE2 AND PHONE3 FIELDS COMPLETELY AFTER YOU'VE REPLACED THE CODE!

2 Columns 2 Lines

<div class="componentheading">{global:formtitle}</div>
<table border="0">
<tr>
<td valign="top">
<div>
{Phone1:caption} (*)<br/>
{Phone1:body}<br/>
{Phone1:validation}
{Phone1:description}<br/>
{Phone3:caption} (*)<br/>
{Phone3:body}<br/>
{Phone3:validation}
{Phone3:description}<br/>
</div>
</td>
<td valign="top">
<div>
{Phone2:caption} (*)<br/>
{Phone2:body}<br/>
{Phone2:validation}
{Phone2:description}<br/>
</div>
</td>
</tr>
</table>

CHANGE IT TO:

<div class="componentheading">{global:formtitle}</div>
<table border="0">
<tr>
<td valign="top">
<div>
{Phone1:caption} (*)<br/>
{Phone1:body}{Phone2:body}{Phone3:body}<br/>
{Phone1:validation}{Phone2:validation}{Phone3:validation}
{Phone1:description}{Phone2:description}{Phone3:description}<br/>
</div>
</td>
<td valign="top">
<div>

</div>
</td>
</tr>
</table>

TO MAKE IT EASIER, REPLACE THE PHONE1 CODE WITH THE FOLLOWING:
{Phone1:caption} (*)<br/>
{Phone1:body}{Phone2:body}{Phone3:body}<br/>
{Phone1:validation}{Phone2:validation}{Phone3:validation}
{Phone1:description}{Phone2:description}{Phone3:description}<br/>
DON'T FORGET TO DELETE THE PHONE2 AND PHONE3 FIELDS COMPLETELY AFTER YOU'VE REPLACED THE CODE!

And there ya' go! :)
Hope that helps!

P.S.
It's not exactly "automatic" but I'd be more than happy to help you. Just make your complete form, give me three phone fields (make sure it says Phone in there so I know what I'm editing). I'll go ahead and edit the code for you and e-mail it back to you so you only have to copy/paste if you'd like :)
Last Edit: 13 years 10 months ago by lroberts. Reason: Adding to post.
The administrator has disabled public write access.
  • 1

Read this first!

We do not monitor these forums. The forum is provided to exchange information and experience with other users ONLY. Forum responses are not guaranteed.

However, please submit a ticket if you have an active subscription and wish to receive support. Our ticketing system is the only way of getting in touch with RSJoomla! and receiving the official RSJoomla! Customer Support.

For more information, the Support Policy is located here.

Thank you!