I have seen a few times here in the forums, persons looking to do "extra" things with custom forms. Well, while it is not talked about all that often, there are a bunch of cool things you can do with forms - to make them more user friendly.
Tired of showing questions that do not need to be shown unless another question is answered a certain way (dependent fields) - Possible. Want to calculate values as they are input into the form field - Possible. These are the two that I constantly use. But knowing how to do these - makes it an endless world of possibilities.
Now - let me say this up front - this is in no way meant to hurt any sales of modules in the market. I did a search and the results I got were for modules dealing with the Join and Login forms - not custom forms you have created - such as in a custom module. So, there is no contradiction there.
OK, so I will do my best to explain this. Lets take a dependent field - one field is dependent on the answer of another field.
First off - make your form just as you normally would. Here is a page with a form in a block that asks if you are completing this assessment alone or not.
function getBlockCode_CompletePartnership()
{
/**
* This section just simply pulls in the variables from the url - nothing big here
*/
$ClientID = $_GET['client_id'];
$RecordID = $_GET['record_id'];
/**
* This section is the javascript code that determines what should happen depending on what answer is selected. Anwser No and it will display 2 new fields below the existing field. Answer yes, and nothing happens.
* The javascript function is placed inside a php variable.
*/
$myJavaScript = <<<CODE
<script type="text/javascript">
function checkPartner()
{
var v_partner = document.getElementById("PartnershipAgree").value;
if (v_partner == 'No'){
document.getElementById('PartnerName').style.display = 'table-row';
document.getElementById('PartnershipRelationship').style.display = 'table-row';
} else{
document.getElementById('PartnerName').style.display = 'none';
document.getElementById('PartnershipRelationship').style.display = 'none';
}
}
window.onload = function() {
checkPartner();
document.getElementById("PartnershipAgree").onclick = checkPartner ;
document.getElementById('form_partnership').onclick = checkPartner ;
}
// -->
</script>
CODE;
/**
* The form
*/
$aForm = array(
'form_attrs' => array(
'name' => 'form_partnership',
'method' => 'post',
),
'params' => array (
'db' => array(
'table' => 'cf_clients_partnership',
'key' => 'partnership_id',
'uri' => '',
'uri_title' => '',
'submit_name' => 'submit_form',
),
'csrf' => array(
'disable' => true,
)
),
'inputs' => array(
'header_info' => array(
'type' => 'block_header',
'caption' => _t('_cf_clients_complete_partnership_form_header_infos')
),
'PartnershipAgree' => array(
'type' => 'select',
'name' => 'PartnershipAgree',
'caption' => _t('_cf_complete_partnership_agree'),
'required' => true,
'values' => array(
'' => '',
'Yes' => 'Yes',
'No' => 'No',
),
/**
* This section is part of what the javascript code will be looking for. Creates an attribute for this field.
*/
'attrs' => array(
'id' => 'PartnershipAgree',
),
// checker params
'checker' => array (
'func' => 'length',
'params' => array(2,3),
'error' => _t('_cf_complete_partnership_agree_err'),
),
'db' => array (
'pass' => 'Xss',
),
),
'PartnerName' => array(
'type' => 'text',
'name' => 'PartnerName',
'caption' => _t('_cf_complete_partnership_name'),
/**
* Other section javascript code will be looking for. Creating a Table Row Attribute for this field
*/
'tr_attrs' => array(
'id' => 'PartnerName',
'style' => 'display:none;',
),
'db' => array (
'pass' => 'Xss',
),
),
'PartnershipRelationship' => array(
'type' => 'text',
/**
* Other section javascript code will be looking for. Creating a Table Row Attribute for this field
*/
'tr_attrs' => array(
'id' => 'PartnershipRelationship',
'style' => 'display:none;',
),
'name' => 'PartnershipRelationship',
'caption' => _t('_cf_complete_partner_relationship'),
'db' => array (
'pass' => 'Xss',
),
),
'record_id' => array(
'type' => 'hidden',
'name' => 'record_id',
'value' => $RecordID,
'db' => array (
'pass' => 'Xss',
),
),
'client_id' => array(
'type' => 'text',
'name' => 'client_id',
/**
* This section is part of what the javascript code will be looking for. Creates an attribute for this field.
*/
'attrs' => array(
'readonly' => true,
0),
'value' => $ClientID,
'db' => array (
'pass' => 'Xss',
),
),
'Submit' => array (
'type' => 'submit',
'name' => 'submit_form',
'value' => _t('_Submit'),
'colspan' => true,
),
),
);
$oForm = new BxTemplFormView ($aForm);
$oForm->initChecker();
if ($oForm->isSubmittedAndValid ()) {
$aValsAdd = array (
);
if ($oForm->insert ($aValsAdd))
{
header ('Location: complete_emergency_contact?client_id=' . $ClientID . '&record_id=' . $RecordID);
}
}
/**
* Add the php varialbe that the javascript code is in
*/
return array($sStatusText . $myJavaScript . $oForm->getCode(), array(), array(), false);
}
Now - if you are using a form that ends similar to this:
echo DesignBoxContent(_t('_cf_clients_add_addiction'), $oForm->getCode (), 11);
then make like:
echo DesignBoxContent(_t('_cf_clients_add_addiction'), $myJavaScript . $oForm->getCode (), 11);
