Topic: [HELP] Need to do a slight modification on Custom Profile Field on Registration

[Adi Sunardy]

Dear All,

Please help me with my problem.

I use SMF 2.0 Beta 4 Post in this forum

I want to modify the Custom Field at the time of registration.

What I want to do is to add conditional fields, so for example like this:

1. I add a "List Field" (with name: Position) with value:

• TEACHER
       
• STUDENT

This field will be set as required, so must be selected.

2. Before the Field List is selected, there will be no field to be filled.
3. When user choose TEACHER, a text field (Teacher Registration Number) will be appeared underneath the field Position.
4. When user choose STUDENT, a text field (Student Registration Number) will be appeared underneath the field Position.

Well,  I understand that to make the above procedure, we can use javascript. But, unfortunately i am very dumb on Javascript

Anyone can help? Thank in advance...

PS: Sorry for my poor english...

[Adi Sunardy]

Anyone can help please.....

[Adi Sunardy]

No one?

[greyknight17]

Can't think of a quick way to do this right now, but how about if you just create two questions instead? For example:

Field 1 - Are you a Teacher or Student?
Field 2 - Please enter your registration number.

That second field should apply to either teacher or student so it should work out this way as well.

[Adi Sunardy]

Unfortunately, it will be more than just a registration Number field need to be filled based on user's position. It will be more than 3 field each...

My previous question is just an example to make it easier to understand, and also easier to me to explain my question as i have a language barrier

Thanks anyway...

Still waiting your respond or the others to solve my problem...

[Adi Sunardy]

Still waiting for any kind of help...

*starting to desperate...

[DannyE]

The answer is to add custom PHP code and Javascript.
So it requires a PHP developer with Javascript knowledge.
To make your Javascript more productive take a look at JQuery (http://www.jquery.org [nofollow])
for manipulating the DOM

But as said.. it requires  developer skills
There is no "click here-and copy-paste this" solution.

[fwitt]

have done a concept test on some code that should give the right behaviour

Code: [Select]

<?
echo '
<script language="JavaScript" type="text/javascript"><!-- // --><![CDATA[
    function onselectteacher()
    {
      document.forms["form1"].role[1].checked=false;
      document.forms["form1"].teacher.style.visibility="visible";
      document.forms["form1"].student.style.visibility="hidden";
    };
    function onselectstudent()
    {
      document.forms["form1"].role[0].checked=false;
      document.forms["form1"].student.style.visibility="visible";
      document.forms["form1"].teacher.style.visibility="hidden";
    };
// ]]></script>
<FORM action="http://example.com/prog/adduser" method="post" name="form1" id="form1">
    <P>
    <INPUT type="checkbox" name="role" value="Teacher" onclick="onselectteacher()"> Teacher<BR>
    <INPUT type="checkbox" name="role" value="Student" onclick="onselectstudent()"> Student<BR>
    <INPUT type="text" name="teacher" value="teacher" hidden>
    <INPUT type="text" name="student" value="student" hidden>
    <INPUT type="submit" value="Send">
    </P>
 </FORM>
';
?>

looks like the javascript would need to be added to register.template.php (when edited to match your custom fields.

the <input>'s seem to be stored in the database so either they would need to be edited there or profile.php would need to be edited before they are created.

think i will have to set up a test site to get the code working properly as i dont have any running smf 2.0 beta4 atm.

[fwitt]

havent set up a test site to test this yet but I believe this may work...

in register.template.php

find

Code: [Select]

// Are there any custom fields?
if (!empty($context['custom_fields']))
{
foreach ($context['custom_fields'] as $field)
{
echo '
<tr valign="top">
<td width="40%"><b>', $field['name'], ': </b><div class="smalltext">', $field['desc'], '</div></td>
<td>', $field['input_html'], '</td>
</tr>';
}
}

and replace it with

Code: [Select]

// Are there any custom fields?
if (!empty($context['custom_fields']))
{
foreach ($context['custom_fields'] as $field)
{
                  if ($field['name'] == 'Role' && substr_count($field['input_html'],'eacher') > 0)
                  $field['input_html'] = rtrim($field['input_html'], '/>') . ' onclick="onselectteacher()"/>';
                  if ($field['name'] == 'Role' && substr_count($field['input_html'],'tudent') > 0)
                  $field['input_html'] = rtrim($field['input_html'], '/>') . ' onclick="onselectstudent()"/>';
echo '
<tr valign="top">
<td width="40%"><b>', $field['name'], ': </b><div class="smalltext">', $field['desc'], '</div></td>
<td>', $field['input_html'], '</td>
</tr>';
}
}

then find

Code: [Select]

echo '
// ]]></script>';

// Any errors?

and replace it with

Code: [Select]

echo '
      document.forms["creator"].ifstudentchecked.style.visibility="hidden";
      document.forms["creator"].ifteacherchecked.style.visibility="hidden";
    function onselectteacher()
    {
      document.forms["creator"].role[1].checked=false;
      document.forms["creator"].ifteacherchecked.style.visibility="visible";
      document.forms["creator"].ifstudentchecked.style.visibility="hidden";
    };
    function onselectstudent()
    {
      document.forms["creator"].role[0].checked=false;
      document.forms["creator"].ifstudentchecked.style.visibility="visible";
      document.forms["creator"].ifteacherchecked.style.visibility="hidden";
    };

// ]]></script>';

// Any errors?

where the string 'ifstudentchecked' should be replaced by the name of the field you wish to appear when student is checked.
and 'ifteacherchecked' similarly for teacher being checked'

for multiple fields repeat the three lines you need to edit the field for on the next line to where they are with the different field value.

This script should work if teacher and student are the value for checkboxes named role AND Teacher is above Student (I hard coded their positions).

I havent got a SMF 2 test site running atm so I haven't tested this code, so test its behaviour before relying on it (preferably not on your live site) and remember to back up before changing anything in case you need to undo the changes.

-edit- changed javascript where i had left testing code in -/edit-

[Adi Sunardy]

Really appreciate all of your respond guys...i will try it in my Testing Server soon, if it works...i will post it here...

Thanks again!

[fwitt]

changed a couple of things in the code where i had forgotten to edit before posting.

the thing I'm not sure about is how smf names the custom fields. The names need to match in the javascript and the form.

right worked out the names thing, just installed a test forum but the code doesn't work as planned run out of time today but going to see if i have time tomorrow to play spot whats causing it.

[Adi Sunardy]

I've tested the code above, but no lucky don't we have to hack Register.php instead register.template.php? Just wondering......

[fwitt]

I've developed the code a bit more on a test site i have set up but haven't got it working yet. not sure how much time I'm gonna have as we've got builders in our house atm (today they've switched off the heating and its -2 Celcius outside).

but I'll try and post updates so anyone else who wants to can play spot the error.

[Adi Sunardy]

Any luck fwitt ?

[Adi Sunardy]

Keep trying...keep googling..still no luck!

[Adi Sunardy]

Move this post to first page, hopefully somebody will see it and help...

[fwitt]

currently have on the test site for the second bit first bit is still the same as earlier post.

Code: [Select]

echo '
      document.forms.creator.customfield[ifstuden].style.visibility="hidden";
      document.forms["creator"].customfield[ifteache].style.visibility="hidden";
    function onselectteacher()
    {
      alert(teacher);
      document.forms["creator"].customfield[student].checked=false;
      document.forms["creator"].customfield[ifteache].style.visibility="visible";
      document.forms["creator"].customfield[ifstuden].style.visibility="hidden";
    };
    function onselectstudent()
    {
      alert(student);
      document.forms["creator"].customfield[teacher].checked=false;
      document.forms["creator"].customfield[ifstuden].style.visibility="visible";
      document.forms["creator"].customfield[ifteache].style.visibility="hidden";
    };

// ]]></script>';


[fwitt]

found stupid mistake number 1.

the javascript needs to be within the <head> section not the <body> section

[fwitt]

in register.template.php

find

Code: [Select]

// Are there any custom fields?
if (!empty($context['custom_fields']))
{
foreach ($context['custom_fields'] as $field)
{
echo '
<tr valign="top">
<td width="40%"><b>', $field['name'], ': </b><div class="smalltext">', $field['desc'], '</div></td>
<td>', $field['input_html'], '</td>
</tr>';
}
}

and replace it with

Code: [Select]

// Are there any custom fields?
if (!empty($context['custom_fields']))
{
foreach ($context['custom_fields'] as $field)
{
                  if ($field['name'] == 'Role' && substr_count($field['input_html'],'eacher') > 0)
                  $field['input_html'] = rtrim($field['input_html'], '/>') . ' onclick="onselectteacher()"/>';
                  if ($field['name'] == 'Role' && substr_count($field['input_html'],'tudent') > 0)
                  $field['input_html'] = rtrim($field['input_html'], '/>') . ' onclick="onselectstudent()"/>';
echo '
<tr valign="top">
<td width="40%"><b>', $field['name'], ': </b><div class="smalltext">', $field['desc'], '</div></td>
<td>', $field['input_html'], '</td>
</tr>';
}
}

now in index.template.php find

Code: [Select]

echo '
</head>
<body>';

and replace it with

Code: [Select]

        if ($_GET['action'] == 'register')
        {
          echo'
          <script language="JavaScript" type="text/javascript"><!-- // --><![CDATA[
alert(\'smile\');
                document.creator.customfield[ifstuden].style.visibility="hidden";
                document.creator.customfield[ifteache].style.visibility="hidden";
                function onselectteacher()
                {
                  alert(\'teacher\');
                  document.creator.customfield[student].checked=false;
                  document.creator.customfield[ifteache].style.visibility="visible";
                  document.creator.customfield[ifstuden].style.visibility="hidden";
                };
                function onselectstudent()
                {
                  alert(\'student\');
                  document.creator.customfield[teacher].checked=false;
                  document.creator.customfield[ifstuden].style.visibility="visible";
                  document.creator.customfield[ifteache].style.visibility="hidden";
                };
// ]]></script>';
}
echo '
</head>
<body>';

The three alerts in this code are for debugging purposes and now flag at the points I intend the code to run. Now just need to work out what else is different from the concept code i did that worked on a simple form.

[fwitt]

Just for completeness this is the standalone simple form that I am using to test for desired behaviour

Code: [Select]

<?
echo '
<script language="JavaScript" type="text/javascript"><!-- // --><![CDATA[
onpageload();
function onpageload()
{
  alert(\'smile\');
  document.creator.ifstudentchecked.style.visibility="hidden";
  document.creator.ifteacherchecked.style.visibility="hidden";
}
    function onselectteacher()
    {
      alert(\'teacher\');
      document.creator.student.checked=false;
      document.creator.ifteacherchecked.style.visibility="visible";
      document.creator.ifstudentchecked.style.visibility="hidden";
    };
    function onselectstudent()
    {
      alert(\'student\');
      document.creator.teacher.checked=false;
      document.creator.ifstudentchecked.style.visibility="visible";
      document.creator.ifteacherchecked.style.visibility="hidden";
    };
// ]]></script>
<FORM action="http://example.com/" method="post" name="creator">
    <P>
    <INPUT type="checkbox" name="teacher" value="Teacher" onclick="onselectteacher()"> Teacher<BR>
    <INPUT type="checkbox" name="student" value="Student" onclick="onselectstudent()"> Student<BR>
    <INPUT type="text" name="ifteacherchecked" value="teacher">
    <INPUT type="text" name="ifstudentchecked" value="student">
    <INPUT type="submit" value="Send">
    </P>
 </FORM>
';

?>

I've just realized that this thread is more suited to the SMF coding discussion board than the support board it is currently in.