Définition du bouton/des options de sélection dans les options de liste rapide Salesforce

Question

Je souhaite disposer de deux menus, dans lesquels le choix dans le premier menu définit les options du deuxième menu. Cela doit être fait sur une page Visualforce Visualforce qui utilise Angular JS et spécifiquement le module UI-Grid pour cela. Des contrôles similaires utilisent les classes de boutons Angular pour les menus, mais je ne vois pas comment définir dynamiquement les choix à l'aide d'un bouton.

Ma conception actuelle utilise un contrôle de sélection et des options ng.

Dans controller.js j'ai déclaré les variables à utiliser par les menus et une fonction permettant d'échanger les valeurs de tableau pour le second menu. Notez que $ scope.fieldOptions est défini via une requête sur Salesforce pour extraire les valeurs d'option des champs de liste rapide. Ce tableau est utilisé dans l'option UI-Grid filter qui accepte dans un format comme "[{value: '1', label: 'male'}, {valeur: '2', label: 'female'} ...".

$scope.editRows = 'all'; 
 
    $scope.editField = 'Program'; 
 
    $scope.editValue; 
 
    $scope.editOptions = {}; 
 

 

 
$scope.setEditOptions = function(editField) { 
 
    switch (editField) { 
 
    case "Program" : 
 
     $scope.editOptions = $scope.fieldOptions.Program_Enrolled__c; 
 
     break; 
 
    case "Appl. ASSET" : 
 
     $scope.editOptions = $scope.fieldOptions.Applied_for_ASSET__c; 
 
     break; 
 
    case "4 Year Degree" : 
 
     $scope.editOptions = $scope.fieldOptions.Has_Student_Completed_4_Year_Degree__c; 
 
     break; 
 
    } 
 
}

Sur la page Visualforce je les boutons définis dans un groupe avec le bouton commande de sélection juste après.

 <div class="row" style="margin-bottom:10px;"> 
 
      <div class="col-md-12"> 
 
      <div class="btn-group"> 
 
       <div class="btn-group" dropdown="true" dropdown-append-to-body="true"> 
 
       <button class="btn btn-default dropdown-toggle" dropdown-toggle="true" type="button"> 
 
        {{editRows | capitalize}} Rows <span class="caret"></span> 
 
       </button> 
 
       <ul class="dropdown-menu"> 
 
        <li ng-click="editRows = 'all'"><a href="#">All Rows</a></li> 
 
        <li ng-click="editRows = 'visible'"><a href="#">Visible Rows Only</a></li> 
 
        <li ng-click="editRows = 'selected'"><a href="#">Selected Rows Only</a></li> 
 
       </ul> 
 
       </div> 
 
       <div class="btn-group" dropdown="true" dropdown-append-to-body="true"> 
 
       <button class="btn btn-default dropdown-toggle" ng-click="setEditOptions(editField)" 
 
         dropdown-toggle="true" type="button"> 
 
        {{editField | capitalize}} <span class="caret"></span> 
 
       </button> 
 
       <ul class="dropdown-menu"> 
 
        <li ng-click="editField = 'Program'"><a href="#">Program Enrolled</a></li> 
 
        <li ng-click="editField = 'Appl. ASSET'"><a href="#">Applied for ASSET</a></li> 
 
        <li ng-click="editField = '4 Year Degree'"><a href="#">4-year degree?</a></li> 
 
       </ul> 
 
       </div> 
 
      <div> 
 
       <select ng-model="editValue" ng-options="option.label for option.value in selectOptions"> 
 
       </select> 
 
      </div> 
 
       
 
       </div> 
 
    
 
       <button id="split-button" type="button" class="btn btn-default" ng-click="massUpdate()">Modify</button> 
 
      </div> 
 
      </div>

Suis-je sur la bonne voie? S'il existe une méthode plus simple, ou une méthode qui utilise directement un bouton, n'hésitez pas à faire des suggestions. Sinon, est-ce la question de savoir comment j'utilise ng-options?

Answer 1

D'accord, plus facile que je ne le pensais. Deux fautes de frappe. D'abord, j'ai eu le tableau déclaré avec {} au lieu de []. Et je l'ai mal orthographié dans la section ng-options de l'instruction select. Correction de ça et ça marche.

Si quelqu'un connaît des astuces pour obtenir ce fonctionnement avec un bouton, il serait donc correspondre aux autres, ce serait merveilleux. Sinon, je pense que je vais aller avec tous les choix pour la cohérence. Aussi, peut-être regrouper ces options dans un tableau avec les choix du menu principal comme les clés afin que je puisse simplement faire référence sans la déclaration de cas.

$scope.editRows = 'all'; 
 
    $scope.editField = 'Program'; 
 
    $scope.editValue; 
 
    $scope.editOptions = {};