Menu
SuiteCRM dedicated support by SalesAgility
Welcome, Guest
Username: Password: Remember me

TOPIC: Create Dynamic Field

Create Dynamic Field 1 week 5 days ago #74953

  • Niall.Brookes
  • Niall.Brookes's Avatar
  • Offline
  • Senior Member
  • Posts: 41
  • Karma: 0
Hi

I would like to create a dynamic field in the invoices module.

I would like a drop down that says yes/no (this has already been created) however when yes is selected I would like a text field to appear underneath the drop down box where users are able to enter either text or numbers how do I go about doing this? I have had a look at various different forums but cant seem to figure it out.

Any help would be greatly appreciated.

Thanks.
The administrator has disabled public write access.

Create Dynamic Field 1 week 5 days ago #74957

  • amariussi
  • amariussi's Avatar
  • Offline
  • SuiteCRM Is My Life
  • Posts: 1138
  • Thank you received: 260
  • Karma: 61
If you are familiar with php and javascript you can do it with a custom logic hook.

Find and follow the manual on how to create a logic hook and where to place the files. In your logic hook (in php) you just have to echo the javascript part that will do what you are looking for.
The administrator has disabled public write access.
The following user(s) said Thank You: Niall.Brookes

Create Dynamic Field 1 week 5 days ago #74960

  • Niall.Brookes
  • Niall.Brookes's Avatar
  • Offline
  • Senior Member
  • Posts: 41
  • Karma: 0
Sorry I have only just started working with SuiteCRM and PHP would you be able to offer any additional guidance?

Thanks.
The administrator has disabled public write access.

Create Dynamic Field 1 week 5 days ago #74977

  • amariussi
  • amariussi's Avatar
  • Offline
  • SuiteCRM Is My Life
  • Posts: 1138
  • Thank you received: 260
  • Karma: 61
Do you also need javascript support?

I can try to illustrate a solution in the week-end because I am away at a client's tomorrow.

In the meantime have alook here:
github.com/audoxcl/SugarCRMLogicHooks

There is a sample logic hook that can easily be packaged and installed in SuiteCRM

Your code will be much simpler because you just have to output the javascript with an echo statement.

With respect to the javascript it should be at most 10/15 lines of code.
Here you can find an example:
stackoverflow.com/questions/13925845/jav...de-based-on-dropdown
The administrator has disabled public write access.

Create Dynamic Field 1 week 5 days ago #74994

  • Niall.Brookes
  • Niall.Brookes's Avatar
  • Offline
  • Senior Member
  • Posts: 41
  • Karma: 0
Thank you for your help with this. I have had a look at the documentation that you have provided however it doesn't really make sense to me as i'm new to PHP I don't really understand the code.
The administrator has disabled public write access.

Create Dynamic Field 1 week 3 days ago #75038

  • amariussi
  • amariussi's Avatar
  • Offline
  • SuiteCRM Is My Life
  • Posts: 1138
  • Thank you received: 260
  • Karma: 61
Here are the instructions, but they probably require that you adjust the code to make it suite your installation.

My code works if you create from scratch the following two fields from Admin->Studio>Invoices:
(follow the screenshots exactly):

Create Dropdown field:


then:



Now create Text field:

then:


Once done proceed to modify the layout of the Edit View:


Now you are ready to add some php code:

Look for a file called: custom/modules/AOS_Invoices/views/view.edit.php

if it doesn't already exist then create it and paste the following code inside it:
class AOS_InvoicesViewEdit extends ViewEdit
{
     public function display(){
        parent::display();
        $javascript = <<<'EOT'
<script type="text/javascript">
  window.onload=function(){
    function toggle_extra_field() {
      if(xx_extra_field.value == 0) {
        document.querySelector('div[data-label="LBL_DFLH_EXTRA_FIELD"]').style.display='none';
        document.querySelector('div[field="dflh_extra_field_c"]').style.display='none';
      }
      if(xx_extra_field.value == 1) {
        document.querySelector('div[data-label="LBL_DFLH_EXTRA_FIELD"]').style.display='';
        document.querySelector('div[field="dflh_extra_field_c"]').style.display='';
        var xx_extra_field_sub = document.getElementById('dflh_extra_field_c');
        xx_extra_field_sub.value = '';
      }
    }
    var xx_extra_field = document.getElementById('dflh_bool_show_extra_field_c');
    toggle_extra_field();
    xx_extra_field.addEventListener('change', toggle_extra_field, false);
  }
</script>
EOT;
      echo $javascript;
      exit;
     }
}

if it already exist you should open it and look for a line with:
public function display(){
or
public function display()
{
or
function display(){
or
function display()
{

if you can't find it then, after the lines
class AOS_InvoicesViewEdit extends ViewEdit
{

paste the following code:
public function display(){
        parent::display();
        $javascript = <<<'EOT'
<script type="text/javascript">
  window.onload=function(){
    function toggle_extra_field() {
      if(xx_extra_field.value == 0) {
        document.querySelector('div[data-label="LBL_DFLH_EXTRA_FIELD"]').style.display='none';
        document.querySelector('div[field="dflh_extra_field_c"]').style.display='none';
      }
      if(xx_extra_field.value == 1) {
        document.querySelector('div[data-label="LBL_DFLH_EXTRA_FIELD"]').style.display='';
        document.querySelector('div[field="dflh_extra_field_c"]').style.display='';
        var xx_extra_field_sub = document.getElementById('dflh_extra_field_c');
        xx_extra_field_sub.value = '';
      }
    }
    var xx_extra_field = document.getElementById('dflh_bool_show_extra_field_c');
    toggle_extra_field();
    xx_extra_field.addEventListener('change', toggle_extra_field, false);
  }
</script>
EOT;
      echo $javascript;
      exit;
     }

If yo ahve already created the two fields yu have to adjust the code I provided with the names of the fields you have created. Please try exacty as I instruted you and post back any issues.
Attachments:
Last Edit: 1 week 3 days ago by amariussi.
The administrator has disabled public write access.
The following user(s) said Thank You: pgr

Create Dynamic Field 1 week 2 days ago #75060

  • Niall.Brookes
  • Niall.Brookes's Avatar
  • Offline
  • Senior Member
  • Posts: 41
  • Karma: 0
Hi

Thank you for going above and beyond to help me its greatly appreciated. I have tried following the instructions however the "pop up" field is always displayed. Below is the PHP code I have put in the view.edit.php file.

Under custom/modules/AOS_Invoices/ there was no views folder so i created it and added the view.edit.php file in. I have also run a rebuild and repair however the field did not change.
class AOS_InvoicesViewEdit extends ViewEdit
{
     public function display(){
        parent::display();
        $javascript = <<<'EOT'
<script type="text/javascript">
  window.onload=function(){
    function toggle_extra_field() {
      if(xx_extra_field.value == 0) {
        document.querySelector('div[data-label="LBL_DEFECT_NUMBER"]').style.display='none';
        document.querySelector('div[field="defect_number_c"]').style.display='none';
      }
      if(xx_extra_field.value == 1) {
        document.querySelector('div[data-label="LBL_DEFECT_NUMBER"]').style.display='';
        document.querySelector('div[field="defect_number_c"]').style.display='';
        var xx_extra_field_sub = document.getElementById('defect_number_c');
        xx_extra_field_sub.value = '';
      }
    }
    var xx_extra_field = document.getElementById('defect_number_required_c');
    toggle_extra_field();
    xx_extra_field.addEventListener('change', toggle_extra_field, false);
  }
</script>
EOT;
      echo $javascript;
      exit;
     }
}
Last Edit: 1 week 1 day ago by pgr. Reason: add code tags
The administrator has disabled public write access.

Create Dynamic Field 1 week 2 days ago #75061

  • amariussi
  • amariussi's Avatar
  • Offline
  • SuiteCRM Is My Life
  • Posts: 1138
  • Thank you received: 260
  • Karma: 61
Have you also included the php open and close tags?:
<?php
// your code goes below this line

?>

In any case the code I shared works only if you create the two fields in studio as I instructed you (follow exactly the instructions I provided with the screenshots.

Otherwise you need to share the following screenshots:
. dropdown field
. extra field
. source code (html) of suitecrm when you are in edit view of an invoice. Only the part with the two fields (you can get this rightclicking each of the fields and select inspect, then expand the relevant parts by clicking on "+") Alternatively you can right click anywhere and select "view page source")
Last Edit: 1 week 2 days ago by amariussi.
The administrator has disabled public write access.

Create Dynamic Field 1 week 2 days ago #75069

  • Niall.Brookes
  • Niall.Brookes's Avatar
  • Offline
  • Senior Member
  • Posts: 41
  • Karma: 0
Hi

I did create my own custom fields and try changing the code to what I think would be correct. I am unable to insert images for some reason however below are the field details.

Dropdown
Type - DropDown
Field Name - defect_number_required_c
Display Label - Defect Number Required
System Label - LBL_DEFECT_NUMBER_REQUIRED

Textfield
Type - Textfield
Field name - defect_number_c
Display Label - Defect Number
System Label - LBL_DEFECT_NUMBER

html source code
Dropdown
<select name="defect_number_required_c" id="defect_number_required_c" title="Select yes to show extra field">
<option label="No" value="No" selected="selected">No</option>
<option label="Yes" value="Yes">Yes</option>
</select>

Textfield
<input type="text" name="defect_number_c" id="defect_number_c" size="30" maxlength="255" value="" title="Enter defect number">
The administrator has disabled public write access.

Create Dynamic Field 1 week 2 days ago #75070

  • amariussi
  • amariussi's Avatar
  • Offline
  • SuiteCRM Is My Life
  • Posts: 1138
  • Thank you received: 260
  • Karma: 61
try this:
<?php
class AOS_InvoicesViewEdit extends ViewEdit
{
     public function display(){
        parent::display();
        $javascript = <<<'EOT'
<script type="text/javascript">
  window.onload=function(){
    function toggle_extra_field() {
      if(xx_extra_field.value == 'No') {
        document.querySelector('div[data-label="LBL_DEFECT_NUMBER"]').style.display='none';
        document.querySelector('div[field="defect_number_c"]').style.display='none';
      }
      if(xx_extra_field.value == 'Yes') {
        document.querySelector('div[data-label="LBL_DEFECT_NUMBER"]').style.display='';
        document.querySelector('div[field="defect_number_c"]').style.display='';
        var xx_extra_field_sub = document.getElementById('defect_number_c');
        xx_extra_field_sub.value = '';
      }
    }
    var xx_extra_field = document.getElementById('defect_number_required_c');
    toggle_extra_field();
    xx_extra_field.addEventListener('change', toggle_extra_field, false);
  }
</script>
EOT;
      echo $javascript;
      exit;
     }
}
?>
Last Edit: 1 week 2 days ago by amariussi.
The administrator has disabled public write access.

Create Dynamic Field 1 week 2 days ago #75071

  • Niall.Brookes
  • Niall.Brookes's Avatar
  • Offline
  • Senior Member
  • Posts: 41
  • Karma: 0
I have tried this and the same results. again i have run a rebuild and repair then tested this when it did not work I rebooted the server and again this did not change anything.
The administrator has disabled public write access.

Create Dynamic Field 1 week 2 days ago #75072

  • amariussi
  • amariussi's Avatar
  • Offline
  • SuiteCRM Is My Life
  • Posts: 1138
  • Thank you received: 260
  • Karma: 61
Be careful because I have edited my post. Now my code is slightly different.
The administrator has disabled public write access.

Create Dynamic Field 1 week 1 day ago #75090

  • amariussi
  • amariussi's Avatar
  • Offline
  • SuiteCRM Is My Life
  • Posts: 1138
  • Thank you received: 260
  • Karma: 61
These are the two edits I did soon after posting the code I adapted to your install:

1. I changed:
if(xx_extra_field.value == 0) {

to:
if(xx_extra_field.value == 'No') {


2. I changed:
if(xx_extra_field.value == 1) {

to:
if(xx_extra_field.value == 'Yes') {


You don't need to run Quick Repair and Rebuild. It should work immediately. Maybe you should just clear the browser cache (Ctrl+F5).


If it doesn't work then:

1. Check the browser console when loading the page and when changing the dropdown value.

2. Check php logs

Report any anomalies.

Last thing:
I need to see your code because there must be something that you are not doing right in some way. In my test system it works perfectly.
Please make sure that the file is in the correct position and that it has correct permissions.
As an extra test you can remove all the php code and just place the javascript like this (without even php open/close tags):
<script type="text/javascript">
  window.onload=function(){
    function toggle_extra_field() {
      if(xx_extra_field.value == 'No') {
        document.querySelector('div[data-label="LBL_DEFECT_NUMBER"]').style.display='none';
        document.querySelector('div[field="defect_number_c"]').style.display='none';
      }
      if(xx_extra_field.value == 'Yes') {
        document.querySelector('div[data-label="LBL_DEFECT_NUMBER"]').style.display='';
        document.querySelector('div[field="defect_number_c"]').style.display='';
        var xx_extra_field_sub = document.getElementById('defect_number_c');
        xx_extra_field_sub.value = '';
      }
    }
    var xx_extra_field = document.getElementById('defect_number_required_c');
    toggle_extra_field();
    xx_extra_field.addEventListener('change', toggle_extra_field, false);
  }
</script>
The administrator has disabled public write access.

Create Dynamic Field 1 week 1 day ago #75099

  • Niall.Brookes
  • Niall.Brookes's Avatar
  • Offline
  • Senior Member
  • Posts: 41
  • Karma: 0
So it turns out there was a view.edit.php file in the file location you specified I have tried to modify the file by putting the below code below the function display(){ line however when i run a rebuild and repair and I try to create a new invoice I am unable to access the create invoices area of my crm. Please see below for my php code.

<?php
require_once('include/MVC/View/views/view.edit.php');

class AOS_InvoicesViewEdit extends ViewEdit{
function AOS_InvoicesViewEdit(){
parent::ViewEdit();
}

function display(){
public function display(){
parent::display();
$javascript = <<<'EOT'
<script type="text/javascript">
window.onload=function(){
function toggle_extra_field() {
if(xx_extra_field.value == No) {
document.querySelector('div[data-label="LBL_DEFECT_NUMBER"]').style.display='none';
document.querySelector('div[field="defect_number_c"]').style.display='none';
}
if(xx_extra_field.value == Yes) {
document.querySelector('div[data-label="LBL_DEFECT_NUMBER"]').style.display='';
document.querySelector('div[field="defect_number_c"]').style.display='';
var xx_extra_field_sub = document.getElementById('defect_number_c');
xx_extra_field_sub.value = '';
}
}
var xx_extra_field = document.getElementById('defect_number_required_c');
toggle_extra_field();
xx_extra_field.addEventListener('change', toggle_extra_field, false);
}
</script>
EOT;
echo $javascript;
exit;
}

echo '<script type="text/javascript" src="custom/include/javascript/showhide.js"></script>';
parent::display();
}
}
?>
The administrator has disabled public write access.

Create Dynamic Field 1 week 1 day ago #75108

  • amariussi
  • amariussi's Avatar
  • Offline
  • SuiteCRM Is My Life
  • Posts: 1138
  • Thank you received: 260
  • Karma: 61
Your code has some php bugs that should crash the execution.

Try this instead:
<?php
require_once('include/MVC/View/views/view.edit.php');

class AOS_InvoicesViewEdit extends ViewEdit{
  function AOS_InvoicesViewEdit(){
    parent::ViewEdit();
  }

	public function display(){
    parent::display();
    $javascript = <<<'EOT'
<script type="text/javascript">
  window.onload=function(){
    function toggle_extra_field() {
      if(xx_extra_field.value == No) {
        document.querySelector('div[data-label="LBL_DEFECT_NUMBER"]').style.display='none';
        document.querySelector('div[field="defect_number_c"]').style.display='none';
      }
      if(xx_extra_field.value == Yes) {
        document.querySelector('div[data-label="LBL_DEFECT_NUMBER"]').style.display='';
        document.querySelector('div[field="defect_number_c"]').style.display='';
        var xx_extra_field_sub = document.getElementById('defect_number_c');
        xx_extra_field_sub.value = '';
      }
    }
    var xx_extra_field = document.getElementById('defect_number_required_c');
    toggle_extra_field();
    xx_extra_field.addEventListener('change', toggle_extra_field, false);
  }
</script>
EOT;
    echo $javascript;
    echo '<script type="text/javascript" src="custom/include/javascript/showhide.js"></script>';
  }
}
?>

If this doesn't work it may be for the reason that @pgr explained (the class extension has already been defined.
In such case try this:
<?php
require_once('include/MVC/View/views/view.edit.php');

class My_Custom_AOS_InvoicesViewEdit extends AOS_InvoicesViewEdit {
  function AOS_InvoicesViewEdit(){
    parent::ViewEdit();
  }

	public function display(){
    parent::display();
    $javascript = <<<'EOT'
<script type="text/javascript">
  window.onload=function(){
    function toggle_extra_field() {
      if(xx_extra_field.value == No) {
        document.querySelector('div[data-label="LBL_DEFECT_NUMBER"]').style.display='none';
        document.querySelector('div[field="defect_number_c"]').style.display='none';
      }
      if(xx_extra_field.value == Yes) {
        document.querySelector('div[data-label="LBL_DEFECT_NUMBER"]').style.display='';
        document.querySelector('div[field="defect_number_c"]').style.display='';
        var xx_extra_field_sub = document.getElementById('defect_number_c');
        xx_extra_field_sub.value = '';
      }
    }
    var xx_extra_field = document.getElementById('defect_number_required_c');
    toggle_extra_field();
    xx_extra_field.addEventListener('change', toggle_extra_field, false);
  }
</script>
EOT;
    echo $javascript;
    echo '<script type="text/javascript" src="custom/include/javascript/showhide.js"></script>';
  }
}
?>
The administrator has disabled public write access.
Time to create page: 0.131 seconds
Powered by Kunena Forum