Conditional custom fields with this plugin.

[yingsheng658]

Hi onozaty,

Our Redmine system have two custom fields as below,


We need to make only "#[Image release]" and "#[Travel]" items can be selected in 2nd level when
#[routine task] be selected in 1st level,should we apply this plugin?
If it does work,would you like to give me a favor?thanks in advanced.

[onozaty]

Hi @yingsheng658

The following script is helpful.

• https://github.com/onozaty/redmine-view-customize-scripts/blob/master/link_custom_field.js

It is structured so that two custom fields work together.

[yingsheng658]

Hi @onozaty ,

I just tried to add another two custom fields as you mentioned,
1st level with A,B,C,2nd level with A-1,A-2,A-3,B-1,B-2,C-1, and apply this plugin directly.
It's fine,only A-1,A,2 and A-3 can be selected when item A is selected in 1st level.
But when I changed custom field list as above,modified custom field ID,and then apply this script,it did work anymore.
I am not good at JAVA script,could you give me a favor,would like to know if we should define option value,means that "#[Routine task]","#[Image release]" and "#[Travel]" should be defined in the script or not,thanks in advanced.

[onozaty]

Hi @yingsheng658

Please refer to the code below. I am changing the isTarget method.

$(function() {

  var parentFieldId = 'issue_custom_field_values_1';  // Please change here
  var childFieldId = 'issue_custom_field_values_2';  // Please change here

  var isTarget = function(child, parent) {
    if (parent.text() != '#[Routine task]') {
      return true;
    }

    var childText = child.text();
    return childText == '#[Image release]' || childText == '#[Travel]';
  }

  var narrowChildField = function() {

    var parentSelected = $('#' + parentFieldId + ' > option:selected');

    $('#' + childFieldId + ' > option').each(function() {

      var child = $(this);

      if (isTarget(child, parentSelected)) {
        child.show();
        child.prop('disabled', false);
      } else {
        child.hide();
        child.prop('disabled', true);
      }
    });
  }

  narrowChildField();

  $('#all_attributes').change(function(e) {
    if (e.target.id == parentFieldId) {
      narrowChildField();
    }
  });

  var _replaceIssueFormWith = replaceIssueFormWith;
  replaceIssueFormWith = function(html){

    _replaceIssueFormWith(html);

    narrowChildField();
  };
});

[yingsheng658]

Hi @onozaty,

If I would like to make #[Image release] and #[Travel] cannot be selected if the option is not #[Routine task] in 1st level,how do I modify the script?

[onozaty]

Hi @yingsheng658

Please refer to the code below. I am changing the isTarget method.

$(function() {

  var parentFieldId = 'issue_custom_field_values_7';
  var childFieldId = 'issue_custom_field_values_8';

  var isTarget = function(child, parent) {
    var childText = child.text();
    var isRoutineTaskChild = (childText == '#[Image release]' || childText == '#[Travel]');

    if (parent.text() == '#[Routine task]') {
      return isRoutineTaskChild;
    } else {
      return !isRoutineTaskChild;
    }
  }

  var narrowChildField = function() {

    var parentSelected = $('#' + parentFieldId + ' > option:selected');

    $('#' + childFieldId + ' > option').each(function() {

      var child = $(this);

      if (isTarget(child, parentSelected)) {
        child.show();
        child.prop('disabled', false);
      } else {
        child.hide();
        child.prop('disabled', true);
      }
    });
  }

  narrowChildField();

  $('#all_attributes').change(function(e) {
    if (e.target.id == parentFieldId) {
      narrowChildField();
    }
  });

  var _replaceIssueFormWith = replaceIssueFormWith;
  replaceIssueFormWith = function(html){

    _replaceIssueFormWith(html);

    narrowChildField();
  };
});

[yingsheng658]

Hi @onozaty,

Sorry for my reply late,I just tried the script as you mentioned and it works normally,thanks for your kindly support.

[yingsheng658]

Hi @onozaty,

Sorry for my another question,I just add code as $('#' + childFieldId).val('') in order to clear 2nd level
value each time when I switch 1st level value,but that will cause I need to update 2nd level when every
update,could you have any suggestion?thanks in advanced.

[onozaty]

Hi @yingsheng658

Please tell us more about what you want to do.

Just to clear the value of the second level each time you change the first level?
In that case, clearing with the narrowChildField method is fine.

[yingsheng658]

Hi @onozaty,

Sorry for my mistake,I would like to clear the value of 2nd level based on the condition as below,
1.New an issue.
2.Change the 1st level value,means that if I did not change the 1st level value,2nd level value should not
be cleared.

[onozaty]

Hi @yingsheng658

Thank you for the information.
With this condition, it seems that there is no problem just by clearing with narrowChildField.

In what situation will the problem occur?

[yingsheng658]

Hi @onozaty

My problem is that I need to select 2nd level item every time when I edit the issue,need your help to confirm this problem.

[onozaty]

Hi @yingsheng658

Thank you for the explanation.
I understand.
Please move $('#' + childFieldId).val('');.

$(function() {

  var parentFieldId = 'issue_custom_field_values_7';
  var childFieldId = 'issue_custom_field_values_8';

  var isTarget = function(child, parent) {
    var childText = child.text();
    var isRoutineTaskChild = (childText == '#[Image release]' || childText == '#[Travel]');

    if (parent.text() == '#[Routine task]') {
      return isRoutineTaskChild;
    } else {
      return !isRoutineTaskChild;
    }
  }

  var narrowChildField = function() {

    var parentSelected = $('#' + parentFieldId + ' > option:selected');

    $('#' + childFieldId + ' > option').each(function() {

      var child = $(this);

      if (isTarget(child, parentSelected)) {
        child.show();
        child.prop('disabled', false);
      } else {
        child.hide();
        child.prop('disabled', true);
      }
    });
  }

  narrowChildField();

  $('#all_attributes').change(function(e) {
    if (e.target.id == parentFieldId) {
      $('#' + childFieldId).val(''); // moved here
      narrowChildField();
    }
  });

  var _replaceIssueFormWith = replaceIssueFormWith;
  replaceIssueFormWith = function(html){

    _replaceIssueFormWith(html);

    narrowChildField();
  };
});

[yingsheng658]

Hi @onozaty ,

I just tried to modify the script as you mentioned,and it's fine,thanks for your support.