Flex Datagrid с условными ссылками - PullRequest
Новая
       22

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

0 голосов
/ 20 сентября 2011

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

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

Ответы [ 2 ]

1 голос
/ 20 сентября 2011

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

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

  • Я использую DataGrid MX вместо 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>
0 голосов
/ 21 сентября 2011

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

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

    <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>
...