editor.dependent does not appear to trigger at editor open

editor.dependent does not appear to trigger at editor open

LimpEmuLimpEmu Posts: 63Questions: 17Answers: 1
edited June 2019 in Editor

To simplify things, I have two fields on my form, one is a check box field, the other a text field that should be filled out if one of the check boxes is checked. The check box field is called moptrtmt, the text field that is by default disabled is moptrtmtdesc.

editorM.dependent( 'moptrtmt', function ( val,data ) {
  if (editorM.field('moppgrm').val() == "1") {
    var isUnkChecked = (val.indexOf("999") >= 0);
    dealWithUnk(isUnkChecked,'moptrtmt');
    if (val.indexOf("998") >= 0) {
      editorM.field('moptrtmtdesc').enable();
      return {messages: {'moptrtmtdesc':"Enter a description for Other drug used in medication assisted treatment program."}}
    }
    else {
      editorM.field('moptrtmtdesc').val(""); editorM.field('moptrtmtdesc').disable();
      return {messages: {'moptrtmtdesc':""}}
    }
  }
  else return {}
});

[...]

editorM.dependent( "moptrtmtdesc", function ( val,data ) {
  editorM.field("errmoptrtmt").val("0");
  var thismsg = "Enter a description for Other drug used in medication assisted treatment program.";
  var catdummy=["buprenorphine","suboxone","subutex","methadone"];
  for (var i=0; i<catdummy.length; i++) {
    if (val.toLowerCase().indexOf(trimStr(catdummy[i])) >= 0) {
      var thismsg="<span style='color:#b11f1f;'>Your description includes <b>" + catdummy[i] + "</b> which is one of the choices provided. Please correct your response.</span>";
      editorM.field("errmoptrtmt").val("1");
      i=catdummy.length;
    }
  }
  return {
    messages: {"moptrtmtdesc": thismsg},
  };
});

The database can be populated in more than one way, e.g., through upload of a CSV file. In other words, it is possible that errors are introduced through these other ways of populating the DB.

For this particular item, I am checking whether the user provides a description for the category Other that matches one of the categories. If this situation is encountered while the user fills out a form, the message associated with the description field informs the user about the error.

Now when I first load a form that has this error, the message associated with the description field is always the default message. Using the debugger, I can see that at open, the editor goes through the logic for the field moptrtmt four times, then it runs the logic for moptrtmtdesc. At this point, I can see the first tab of the form. When I type

$(':input[id="DTE_Field_moptrtmtdesc"]')[0].disabled

in the console.log, the description field is enabled. The debugger is not done though, and goes four more times through the logic for moptrtmt, but never goes again through the logic for moptrtmtdesc, therefore, when the form loads, the default message shows, rather than the error message that I want displayed.

Where is my mistake?

Any help is much appreciated. Thank you!

This question has accepted answers - jump to:

Answers

  • allanallan Posts: 61,435Questions: 1Answers: 10,049 Site admin

    Hi,

    Could you give me a link to your page showing the issue so I can check it out please?

    Thanks,
    Allan

  • LimpEmuLimpEmu Posts: 63Questions: 17Answers: 1

    I need a little time to put this together, might be a few days since I have a few deadlines to deal with. Thank you!

  • LimpEmuLimpEmu Posts: 63Questions: 17Answers: 1

    I re-wrote the editor.dependent sections for all fields that required an additional description. One of the problems was that I would modify the field message for a description field when the parent field was updated, i.e., it was part of the editor.dependent actions of the parent field. This led to the problems I experienced. So instead of multiple editor.dependent sections for different fields that all updated the description field message, I now trigger an update of the editor.dependent section associated with the description field which solved my problem (see code snippet below).

    The one drawback of this solution is that it does make the editor a tiny bit sluggish when it loads a record, the reason being that this form that I built - based on client specs - includes a large number of check boxes some of them with 15 per field. Now, when the editor loads a record, it will make the dependent field call below for each check box on the form, so for a field that has 15 check boxes, it will call the logic below 15 times. So, it would be nice if I could tell editor when it loads a form to only trigger the update of the field message for the description field when it hits the last check box of the parent field. Does this make sense, or is my description too convoluted? Is this possible?

    Thank you for your help and support, it's much appreciated!

    editorM.dependent( 'moptrtmt', function ( val,data ) {
      if (editorM.field('moppgrm').val() == "1") {
        var isUnkChecked = (val.indexOf("999") >= 0);
        dealWithUnk(isUnkChecked,'moptrtmt');
        if (val.indexOf("998") >= 0) {
           editorM.field('moptrtmtdesc').enable();
        }
        else {
           editorM.field('moptrtmtdesc').val(""); editorM.field('moptrtmtdesc').disable();
        }
      }
      editorM.field('moptrtmtdesc').input().trigger('change');
      return {}
    });
    editorM.dependent( "moptrtmtdesc", function ( val,data ) {
      editorM.field("errmoptrtmt").val("0");
      var screener=editorM.field("moptrtmt").val().indexOf("998");
      var fldmsg = "";
      if (screener >= 0) {
        var fldmsg="Enter a description for Other drug used in medication assisted treatment program.";
        var catdummy=["Buprenorphine","Suboxone","Subutex","Methadone","Unknown","Not Applicable"];
        for (var i=0; i<catdummy.length; i++) {
          var thisval=catdummy[i];
          if (thisval.substring(thisval.length-1) == 's') var thisval=thisval.substring(0,thisval.length-2);
          if (val.toLowerCase().indexOf(trimStr(thisval.toLowerCase())) >= 0) {
            var fldmsg="<span style='color:#b11f1f;'>Your description includes <b>" + catdummy[i] + "</b> which is one of the choices provided. Please correct your response.</span>";
            editorM.field("errmoptrtmt").val("1");
            i=catdummy.length;
          }
        }
      }
      return {
        messages: {"moptrtmtdesc": fldmsg},
      };
    });
    
  • allanallan Posts: 61,435Questions: 1Answers: 10,049 Site admin
    Answer ✓

    So, it would be nice if I could tell editor when it loads a form to only trigger the update of the field message for the description field when it hits the last check box of the parent field.

    What you probably need to do is listen for the initEdit event which is triggered once the Editor form is ready for editing. Then add your dependent methods in there. undependent() can then be used to remove the dependent events for the next time around the loop (i.e. call undependent() in initEdit before then using dependent(), to remove any previous listeners).

    Allan

  • LimpEmuLimpEmu Posts: 63Questions: 17Answers: 1

    Thank you, Allan, I will try that for sure!

  • LimpEmuLimpEmu Posts: 63Questions: 17Answers: 1

    Unfortunately, I cannot get undependent to work per https://editor.datatables.net/reference/api/undependent().

    To remove the event handler for the mtrtmt field, I added in the initEdit section:

    editorM.undependent('mtrtmt') 
    

    This results in an error:

    Uncaught TypeError: editorM.undependent is not a function
    
  • colincolin Posts: 15,112Questions: 1Answers: 2,583
    Answer ✓

    Hi @LimpEmu ,

    undependent() was added recently - if you're not using the most recent release, 1.9.0, I'd suggest upgrading,

    Cheers,

    Colin

  • LimpEmuLimpEmu Posts: 63Questions: 17Answers: 1

    I thought I was, but I wasn't :/
    Fixed my reference to the editor version I was using for testing, and it worked just fine.
    Maybe my form is just too big as the load time is similar as before. It's all good, so happy with editor, it's a gem!

This discussion has been closed.