create-actions.js dynamically remove option from dropdown

In sugarCRM 7.2.0 I have a dropdown with legacy items in it. The display values for those items include the text "(legacy)" . I don't want those legacy items to display when creating a new record, they should however display in record view.

In 6.5.15 I would unset those legacy items in the app list strings array during in the pre display on view.edit.php for new records.

In 7.2.0 I am trying to reproduce that functionality in create-actions.js

console.log() is my new best friend and I know I'm getting to the items I want to remove by looping through the app list strings and using javascript match (see hideLegacyValues below).

I just don't know how to unset the options that i want to hide...

It seems that $('[data-name="territory_classification_c"]').options is undefined.
and there are actually no "options" as such in the source code.

Any clues as to the proper way to manipulate dropdown values in code?

Thanks,
FrancescaS

               
   render: function()
   {
      this._super('render');
      this.hideLegacyValues();
   },
                       
   hideLegacyValues: function(){
     // hide legacy items from territory classification
     var territory_list = app.lang.getAppListStrings('territory_classification_list_DD');
     Object.keys(territory_list).forEach(function(key) {
        var check = territory_list[key].match(/legacy/);
        if(territory_list[key].match(/legacy/)){
           //the line below gives an ERROR
           $('[data-name="territory_classification_c"]').options[territory_list[key]].remove();
        }
     });
  • So lately I feel like a kid who has never written a piece of code in his life...

    I figured out that Sugar is using select2 but the generic examples I find on the web don't seem to work in this case... 

    Can anyone give me a push up this steep learning curve?
  • How crucial is it to have it filtered before it gets to the client? Can you do it on the client side instead and just remove when the document is ready? Could  then remove using something like:
    $("#selectListId option[value='ABC']").remove();

  • Yes, but my problem is figuring out what the selectListId is!

    Yeah, I'm that lost....   :(
  • Here is the html for the dropdown:

    <span class="normal index" data-fieldname="territory_classification_c" data-index="">                     <span sfuuid="549" class="edit">

    <div class="select2-container select2 select2-container-active select2-dropdown-open" id="s2id_autogen23" style="width: 100%;">
       <a href="javascript:void(0)" onclick="return false;" class="select2-choice select2-default" tabindex="-1">  
        <span class="select2-chosen">Select...</span>
       <abbr class="select2-search-choice-close"></abbr>  
       <span class="select2-arrow"><b></b></span>
       </a><input class="select2-focusser select2-offscreen" type="text" id="s2id_autogen24" tabindex="0" disabled="">
    </div>

    <input type="hidden" class="select2 select2-offscreen" name="territory_classification_c" tabindex="-1" value="" aria-label="Territory Classification">

    </span>
     </span>
  • This is where the values are hiding

    <div class="select2-drop select2-display-none select2-with-searchbox select2-drop-active" style="left: 13.003473281860352px; width: 698px; top: 587.2986450195313px; bottom: auto; display: block;" id="select2-drop">  
    <div class="select2-search">      
       <input type="text" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" class="select2-input">  
     </div>  
     <ul class="select2-results">
     <li class="select2-results-dept-0 select2-result select2-result-selectable select2-highlighted"><div class="select2-result-label"><span class="select2-match"></span></div></li>
    <li class="select2-results-dept-0 select2-result select2-result-selectable"><div class="select2-result-label"><span class="select2-match"></span>Site</div></li>
    <li class="select2-results-dept-0 select2-result select2-result-selectable"><div class="select2-result-label"><span class="select2-match"></span>WRI_DOM ('legacy')</div></li>
    <li class="select2-results-dept-0 select2-result select2-result-selectable"><div class="select2-result-label"><span class="select2-match"></span>Exception Site</div></li>

    ...lots more list items like the ones above...

    </ul></div>

    I am trying to 
  • territory_list now has only the values I want.
    Now to figure out how to update the AppListStrings.
    There is a getAppListStrings but not a setAppListStrings

           
       hideLegacyValues: function(){
         // hide legacy items from territory classification
         var territory_list = app.lang.getAppListStrings('territory_classification_list_DD');
         console.log(territory_list);
         Object.keys(territory_list).forEach(function(key) {
            var check = territory_list[key].match(/legacy/);
            if(territory_list[key].match(/legacy/)){
               delete territory_list[key];
            }
         });
         console.log(territory_list);
       },
              
  • DID IT!
    Thank you Jason Eggers and Angel Magaña for the inspiration to move forward tonight!

    The dom for dropdowns cannot be easily manipulated because it's hard to know what to reference (see html source above). So Angel suggested manipulating the app list strings instead.

    While there is a getAppListStrings there is no setAppListStrings so I checked out the render function for enum and found that options can be either the dd name or a json encoded key:val list.
    The render function checks, if it's key:val it just uses those, if it's a string it goes to get the AppListStrings for it.

    Once I figured out how to reference a field object (yeah, that took a while) setting the options was a one liner.
     
                   
       hideLegacyValues: function(){
         // hide legacy items from territory classification
         var territory_list = app.lang.getAppListStrings('territory_classification_list_DD');
         Object.keys(territory_list).forEach(function(key) {
            var check = territory_list[key].match(/legacy/);
            if(territory_list[key].match(/legacy/)){
               delete territory_list[key];
            }
         });
         this.model.fields['territory_classification_c'].options = territory_list;
       },
                       


    Thanks again guys for getting me going again.

    It's been a long long day!

    FrancescaS

  • Hi Francesca.
    The same code should work on record.js?

    Thx.
    Antonio.

  • Antonio, I have not tried this in record.js but I suppose it should work.
    Are you having trouble getting it to work?