Flex Datagrid с условными ссылками

Question

Мне нужна ваша помощь в следующем.

У меня есть одна таблица данных, в которой в качестве поставщика данных используется массив. Теперь мое требование в этом массиве: у меня есть один statusId как одна переменная или свойство say, которое я отображаю как один из столбцов в сетке данных. теперь у меня есть еще один столбец, где я должен отобразить три ссылки, такие как редактировать, удалять и просматривать, которые будут основаны на statusid. Можете ли вы дать мне некоторую идею или пример

Answer 1

Я не эксперт по Flex, но обычно, когда вы хотите настроить внешний вид столбца в DataGrid, вы используете ItemRenderer, как указано вашим тегом. В средстве визуализации элементов вы можете использовать компоненты Label и установить набор атрибутов, которые делают их похожими на ссылки, а затем включить / отключить их в зависимости от вашего состояния.

Вот пример кода с моей головы со следующими предостережениями:

• Я использую MX DataGrid вместо Spark DataGrid.

• Для удобства я использую встроенное средство визуализации элементов, но лучше выводить ваши средства визуализации элементов в отдельные файлы MXML.

  <mx:DataGrid id="dataGrid" dataProvider="{dataProvider}" ...>
      <mx:columns>
          <mx:DataGridColumn id="status_id_column" dataField="statusId" headerText="Status" />
          <mx:DataGridColumn id="action_column">
              <mx:itemRenderer>
                  <fx:Component>
                      <mx:Label text="View" paddingLeft="10" useHandCursor="true" buttonMode="true" mouseChildren="false" enabled="Your condition goes here" />
                      <mx:Label text="Edit" paddingLeft="10" useHandCursor="true" buttonMode="true" mouseChildren="false" enabled="Your condition goes here" />
                      <mx:Label text="Delete" paddingLeft="10" useHandCursor="true" buttonMode="true" mouseChildren="false" enabled="Your condition goes here" />
                  </fx:Component>
              </mx:itemRenderer>
          </mx:DataGridColumn>
      </mx:columns>
  </mx:DataGrid>
  

Answer 2

Спасибо avik за вашу помощь, это частично правильно, так как для меня есть много условий, которые я не могу поставить это во включенный атрибут. в любом случае я получил решение со своей стороны:)

вот синтаксис.

    <mx:HBox width="100%">
   <mx:DataGrid id="reportDataGrid" dataProvider="{reportDataGridArrayCollection}"
         variableRowHeight="true" editable="false" rowHeight="75"
         width="100%" height="400" allowDragSelection="false"
         draggableColumns="false" textAlign="center">
    <mx:columns>
     <mx:DataGridColumn sortable="false" dataField="reportId" resizable="false" headerText="" width="0.06" editable="false" textAlign="center"/>
          <mx:DataGridColumn resizable="false" headerStyleName="centered" textAlign="left" dataField="reportStatusId" headerWordWrap="true" headerText="Status" width="0.21">
     </mx:DataGridColumn>
     <mx:DataGridColumn resizable="false" headerStyleName="centered" textAlign="left" dataField="lockedByUser" headerWordWrap="true" headerText="Locked (Worked) By" width="0.10"/>

     <mx:DataGridColumn resizable="false" headerStyleName="centered" textAlign="left" dataField="" headerWordWrap="true" headerText="Acion" width="0.20">
      <mx:itemRenderer>
       <fx:Component>
        <mx:HBox textAlign="left" width="100%" creationComplete="init1()" > 
        <fx:Script> 
         <![CDATA[ 

          public function init1():void {
           if(data.reportStatusId==0) {
            viewLnk.visible = true;
            viewLnk.includeInLayout = true;
  // this is my condition which you can ignore....          if((data.entityId==1 || data.entityId==2 || data.entityId==3 || data.entityId==4)            ){
             editLnk.visible = true;
             editLnk.includeInLayout = true;
            }
           }
           if(data.reportStatusId==1 
             ) {
            editLnk.visible = true;
            editLnk.includeInLayout = true;
           }
           if(data.reportStatusId==2) {
            reviewLnk.visible = true;
            reviewLnk.includeInLayout = true;
           }
           if(data.reportStatusId==3) {
            saveXMLLnk.visible = true;
            saveXMLLnk.includeInLayout = true;
           }
          }
         ]]> 
        </fx:Script>
         <mx:LinkButton id="editLnk" visible="false" includeInLayout="false" label="Edit" click="outerDocument.editReport(data.reportId)"/>
         <mx:LinkButton id="viewLnk" visible="false" includeInLayout="false" label="View" click="outerDocument.viewReport(data.reportId)"/>
         <mx:LinkButton id="reviewLnk" visible="false" includeInLayout="false" label="Review" click="outerDocument.reviewReport(data.reportId)"/>
           <mx:LinkButton id="saveXMLLnk" visible="false" includeInLayout="false" label="Save XML" click="outerDocument.saveXMLReport(data.reportId)"/>

        </mx:HBox>
       </fx:Component>
      </mx:itemRenderer>
     </mx:DataGridColumn>
    </mx:columns>
   </mx:DataGrid>
  </mx:HBox>