Datagrid within Datagrid - Rows not resizing to fit content

Hi,
I have a datagrid with a custom item renderer that renders another data grid... so one column will render datagrids within the outer datagrid. The problem is that the row does not size to fit the inner datagrid. I can't set the rowHeight on the outer datagrid because the inner datagrids have dynamic data and i don't know how many rows they will have. Also, after the datagrid is rendered, more rows may be added to any number of inner datagrids at a later time... and I need the rows holding them to resize accordingly. Setting variableRowHeight=true on the outer grid doesn't seem to help either.
Any ideas on how to do this?
Thanks!

Hi, Alex, thanks for the info. It turns out, I was wrong. The way it looked made me think it was a row-resizing problem, but it turns out that the rows were resizing fine... it was the outer datagrid itself that was not resizing properly. Apparently it has to do with the combination of variableRowHeight and rowCount. The jira issue may look familiar to you.
http://bugs.adobe.com/jira/browse/SDK-13507
Anyway, I got this from the jira comments and works pretty good...
height="{theGrid.measureHeightOfItems(-1, theGrid.dataProvider.length + 1)}"
I also have to call similar code when the data provider of the inner grids add/remove items.
Thanks!

Similar Messages

Group not resizing correctly when contents are moved programmatically

Hi there,
My apologies in advance if this is a known issue. I searched the forums but I was unable to find a discussion about this topic. The issue we are running into is when we programmatically move the contents of a Group which is in turn enclosed within a Scroller beyond the Scroller's limits the position of the Group within the stage is incorrectly calculated. This will cause mouseEvents in the area beyond the Group's limits to be "ignored" among other problems.
I have created an application to illustrate the problem, we are in 4.1:
<?xml version="1.0" encoding="utf-8"?>
<s:Application
    minWidth="955" minHeight="600"
    xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:s="library://ns.adobe.com/flex/spark"
    xmlns:mx="library://ns.adobe.com/flex/mx">
    <fx:Declarations>
        
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            import mx.controls.Alert;
            private function onGroupClick(event:MouseEvent):void
                Alert.show("It works");
            private function onButtonClick(event:MouseEvent):void
                rect.x += 500;
                rect.y += 500;
        ]]>
    </fx:Script>
    <s:Scroller
        width="100%" height="100%">
        <s:Group id="myGroup"
            width="100%" height="100%"
            click="onGroupClick(event)">
            <s:Rect id="rect"
                x="0" y="0" width="10" height="10"/>
        </s:Group>
    </s:Scroller>
    <s:Button
        label="Move Rectangle"
        click="onButtonClick(event)"/>
</s:Application>
Steps to reproduce:
Click anywhere in the screen - notice that an alert that reads "It works" shows up.
Click on the "Move Rectangle" button enough times for the coordinates of the Rectangle to exceed the limits of the Scroller, hence producing scroll bars.
Scroll all the way to the right and to the bottom.
Click right next to the right bottom corner - notice that no alert is displayed. The reason is the Group has not resized correctly hence we are actually clicking outside the Group. Resizing your browser window for example will cause the Group to resize and events will again "work". FlexSpy will make things pretty apparent as well.
Any pointers regarding where this bug lives in the source code or suggestions on how to fix this would be greatly appreciated, this issue is causing us a lot of pain.
Thanks in advance!!
~ TheMadPenguin

Thanks for logging this in the bugbase: https://bugs.adobe.com/jira/browse/SDK-29112. The latest comments there say:
Reproduced in 4.0.0, 4.1.0
Confirmed fixed in 4.5.0.19764
A workaround for the 4.0.0 and 4.1.0 release would be to put the click handler on the Scroller instead of the viewport.
Note: This bug seems to be fixed, but the fact that the width/height of the Group doesn't change is still consistent (and correct). Group has a concept of size and content size, scrolling is enabled when the content size is larger than the size (with Group.clipAndEnableScrolling set to true which Scroller sets automatically).
See this spec for more details: http://opensource.adobe.com/wiki/display/flexsdk/Spark+Viewport
Hans has a good article here: http://hansmuller-flex.blogspot.com/
Here's a simple example that demonstrates width does not change:
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark">
     <s:Scroller width="100" height="100">
         <s:Group id="viewport">
             <s:Rect width="100%" height="100%">
                 <s:fill><s:SolidColor color="red" /></s:fill>
             </s:Rect>
             <s:Button id="btn" label="out of view" y="150" click="btn.y += 50" />
         </s:Group>
     </s:Scroller>
</s:Application>
You might expect that this example should have a red background behind the Button, but it does not. That is because width/height of 100% on the Rect is 100% of the width/height of the viewport, not the contentWidth/contentHeight.
One way of getting the behavior where the Rect expands across the whole content size would be to bind to contentHeight:
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark">
     <s:Scroller width="100" height="100">
         <s:Group id="viewport">
             <s:Rect width="100%" height="{viewport.contentHeight}">
                 <s:fill><s:SolidColor color="red" /></s:fill>
             </s:Rect>
             <s:Button id="btn" label="out of view" y="150" click="btn.y += 50" />
         </s:Group>
     </s:Scroller>
</s:Application>
Note: You shouldn't specify or change the size of the viewport Group inside of a Scroller. The Scroller component manages the size of the Group in a specific way and if the Group has a size that conflicts with that then you can get into a bad situation that might cause infinite loops. Notice in my example the viewport Group has no size set on it.
Thanks to SDK QE for the info!
-Heidi

DataGrid Not Resizing to Dynamic Content

Hello,
I'm using Flex 3.2. I have an editable DataGrid with no with
and height specified. I do specify rowCount to something like
rowCount="dataProvider.length". Everything looks good when the
datagrid is first rendered with data in it. However, if the data in
it changes after rendering, then the grid doesn't resize
accordingly. Actually the grid may resize, but the border/frame
doesn't.
Example:
I have a special TextArea component that grows (vertically)
as the user types in more lines of text. I use this component as
one of my item editors. If a cell is first rendered with only one
line of text, then the user goes in and types additional lines, the
grid row grow within it's border, but the not the border itself...
causing some undesired scrollbars.
I need a way to tell the datagrid to re-calibrate sizing just
like it does when it's first created. Is there a way to do this? I
tried datagrid.invalidateSize() and related procedures, but nothing
happens. What do you think?
Thanks

"bfargo" <[email protected]> wrote in
message
news:gmcsal$34d$[email protected]..
>I finding this datagrid sizing to be extremely
frustrating as to say, HTML
> tables. I just want it to look good. Anytime I do
anything with dynamic
> content, it doesn't size right, or I end up with a bunch
of ugly
> scrollbars,
> etc. I just want to be able to add some content, and
have the datagrid
> grow
> with it.. at least in height.
> VariableRowHeight is set to true, I try setting rowcount
to my
> dataprovider
> length. Event though the length may be 5, it'll randomly
throw a bunch of
> other rows in there. The behavior is just completely
incoherent (at
> least to
> me). Nobody else has these problems? .
Post code

Iframes and automatic resizing to fit content displayed.

Hi
Is it possible to display an iframe on your page with content inside that resizes and then have the iframe resize with it so you dont have to use scroll bars or make the page size really big.?

If the iframe page is hosted on your domain, yes, there is a jQuery plugin for this.
http://github.com/house9/jquery-iframe-auto-height
If the iframe page is hosted externally, it won't work.
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/

Fit Content Proportionally Broken in CS6?

I have been having a lot of issue with Fit Content Proportionally since upgrading to CS6.
In many of my documents (some new, some pulled in from earlier versions and saved over as CS6), I find that both via the menu and via the keyboard shortcut, the commonly-used and absolutely essential "Fit Content Proportionally" command just simply does not work.
I can create a bunch of square frames, and then fill them all with various-sized and shaped images, and then when I would usually Fit Content Proportionally to make them all scale down inside the boxes, what I get instead is no response at all. The only way to "fix" the problem is to go to the toolbar with the content selected and change either the vertical or horizontal percentage to any number at all. As long as the proportion lock is in place, then that changes both % numbers to the same number, and thus fixing the problem. This is what makes me think it is a bug.
Is there some new fitting setting in CS6 that I need to change?
I have tried saving as IDML and importing back into CS6, but the behavior persists. Interestingly, if I change the fitting via the toolbar % "fix" and then select Fit Content to Frame (not proportionally), then Fit Content Proportionally is broken again, and does nothing at all.
On most of my documents, Fit Content Proportionally works exactly as expected, and exactly as it always has. Of course my biggest "problem" documents contain large numbers of images.
High Res Image:
http://i.imgur.com/kl9jS.jpg

This is a bug or a big enough change in behavior that it should come with a warning alert the first time you use it. I've replicated it across different 8.0.1 installs and (Mac) OSs.
To replicate:
Place graphic. I haven't seen a difference among placed graphic types.
Resize the graphic frame non-proportionally.
Object=>Fitting=>Fit Content to Frame, so that the content is scaled non-proportionally. (Or select the content and scale it non-proportionally.)
Object=>Fitting=>Fit Content Proportionally. Nothing happens. (Or, if you scaled the content without fitting it in the previous step, the content may be centered, and it may be scaled, but the proportions won't be changed.)
I suppose you could make an argument that this is more correct than the old behavior—the command now means "Fit without changing the proportions"—but it's a big change, and I doubt anybody wants it to work this way.
Here's a short script that should more or less give the old behavior:
function fit(item) {
var i, l, graphic;
if (item instanceof Group) {
    for (i = 0, l = item.pageItems.length; i < l; i++) {
      fit(item.pageItems[i].getElements()[0]);
else if (item.hasOwnProperty("imageTypeName")) {
    item.horizontalScale = item.horizontalScale < 0 ? -100 : 100;
    item.verticalScale = item.verticalScale < 0 ? -100 : 100;
    item.fit(FitOptions.PROPORTIONALLY);
else if (item.hasOwnProperty("graphics")) {
    for (i = 0, l = item.graphics.length; i < l; i++) {
      graphic = item.graphics[i];
      graphic.horizontalScale = graphic.horizontalScale < 0 ? -100 : 100;
      graphic.verticalScale = graphic.verticalScale < 0 ? -100 : 100;
      graphic.fit(FitOptions.PROPORTIONALLY);
function main() {
var i, l;
if (!app.documents.length) {
    return;
for (i = 0, l = app.selection.length; i < l; i++) {
    fit(app.selection[i]);
app.doScript(main, ScriptLanguage.JAVASCRIPT, undefined, UndoModes.ENTIRE_SCRIPT, "Really Fit Content Proportionally");
There are certainly some corner cases I've left out. Let me know if you try to use it and it doesn't work right.
Jeff

DataGrid does not display XML data

Hello, and thanks for reading this...
I am having a problem displaying XMLList data in a DataGrid.
The data is coming from a Tree control, which is receiving it
from a database using HTTPService.
The data is a list of "Job Orders" from a MySQL database,
being formatted as XML by a PHP page.
If it would be helpful to see the actual XML, a sample is
here:
http://www.anaheimwib.com/_login/get_all_orders_test2.php
All is going well until I get to the DataGrid, which doesn't
display the data, although I know it is there as I can see it in
debug mode. I've checked the dataField property of the appropriate
DataGrid column, and it appears correct.
Following is a summary of the relevant code.
...An HTTPService named "get_all_job_orders" retrieves
records from a MySQL database via PHP...
...Results are formatted as E4X:
HTTPService resultFormat="e4x"
...An XMLListCollection's source property is set to the
returned E4X XML results:
...The "order" node is what is being used as the top-level of
the XML data.
<mx:XMLListCollection id="jobOrdersReviewXMLList"
source="{get_all_job_orders.lastResult.order}"/>
...The "jobOrdersReviewXMLList" collection is assigned to be
the dataProvider property of a Tree list, using the @name syntax to
display the nodes correctly, and a change event function is defined
to add the records to a DataGrid on a separate Component for
viewing the XML records:
<mx:Tree dataProvider="{jobOrdersReviewXMLList}"
labelField="@name"
change="jobPosForm.addTreePositionsToDG(event)"/>
...Here is the relevant "jobPosForm" code (the Job Positions
Form, a separate Component based on a Form) :
...A variable is declared:
[Bindable]
public var positionsArray:XMLList;
...The variable is initialized on CreationComplete event of
the Form:
positionsArray = new XMLList;
...The Tree's change event function is defined within the
"jobPosForm" Component.
...Clicking on a Tree node fires the Change event.
...This passes an event object to the function.
...This event object contains the XML from the selected Tree
node.
...The Tree node's XML data is passed into the positionsArray
XMLList.
...This array is the dataProvider for the DataGrid, as you
will see in the following block.
public function addTreePositionsToDG(event:Event):void{
this.positionsArray = selectedNode.positions.position;
...A datagrid has its dataProvider is bound to
positionsArray.
...(I will only show one column defined here for brevity.)
...This column has its dataField property set to "POS_TITLE",
a field in the returned XML record:
<mx:DataGrid width="100%" variableRowHeight="true"
height="75%" id="dgPositions"
dataProvider="{positionsArray}" editable="false">
<mx:columns>
<mx:DataGridColumn width="25" headerText="Position Title"
dataField="POS_TITLE"/>
</mx:columns>
</mx:DataGrid>
In debug mode, I can examine the datagrid's dataProvider
property, and see that the correct XML data from the Tree control
is present. However, The datagrid does not display the data in any
of its 6 columns.
Does anyone have any advice?
Thanks for your time.

Hello again,
I came up with a method of populating the DataGrid from the
selected Item of a Tree Control which displays complex XML data and
XML attributes. After the user clicks on a Tree branch, I call this
function:
public function addTreePositionsToDG(event:Event):void{
//Retrieve all "position" nodes from tree.
//Loop thru each Position.
//Add Position data to the positionsArray Array Collection.
//The DataGrid dataprovider is bound to this array, and will
be updated.
positionsArray = new ArrayCollection();
var selectedNode:Object=event.target.selectedItem;//Contains
entire branch.
for each (var position:XML in
selectedNode.positions.position){
var posArray:Array = new Array();
posArray.PK_POSITIONID = position.@PK_POSITIONID;
posArray.FK_ORDERID = position.@FK_ORDERID;
posArray.POS_TITLE = position.@POS_TITLE;
posArray.NUM_YOUTH = position.@NUM_YOUTH;
posArray.AGE_1617 = position.@AGE_1617;
posArray.AGE_1821 = position.@AGE_1821;
posArray.HOURS_WK = position.@HOURS_WK;
posArray.WAGE_RANGE_FROM = position.@WAGE_RANGE_FROM;
posArray.WAGE_RANGE_TO = position.@WAGE_RANGE_TO;
posArray.JOB_DESCR = position.@JOB_DESCR;
posArray.DES_SKILLS = position.@DES_SKILLS;
positionsArray.addItem(posArray);
So, I just had to manually go through the selected Tree node,
copy each XML attribute into a simple Array, then ADD this Array to
an ArrayCollection being used as the DataProvider for the DataGrid.
It's not elegant, but it works and I don't have to use a Label
Function, which was getting way too complicated. I still think that
Flex should have an easier way of doing this. There probably is an
easier way, but the Flex documentation doesn't provide an easy path
to it.
I want to thank you, Tracy, for the all the help. I checked
out the examples you have at www.cflex.net and they are very
helpful. I bookmarked the site and will be using it as a resource
from now on.

When clicking on datagrid row it throws me exception - WPF C#

Whenever I try to double click my datagrid row to edit it, I throws me a few exceptions which doesn't say anything to me. Hovever if
I set the whole datagrid to IsReadOnly to true, I want have the problem, but I need the second and third columns editable.
XAML
<DataGrid x:Name="clientList" HorizontalAlignment="Left" Height="225" Margin="11,126,0,0" VerticalAlignment="Top" Width="349" IsSynchronizedWithCurrentItem="False" AutoGenerateColumns="False" HorizontalGridLinesBrush="#FFB9B9B9" VerticalGridLinesBrush="#FF8B8B8B" GridLinesVisibility="Horizontal" CellStyle="{StaticResource Body_Content_DataGrid_Centering}">
<DataGrid.Resources>
<LinearGradientBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" StartPoint="0,0" EndPoint="0,1" >
<GradientStop Color="#66240000" Offset="0"/>
<GradientStop Color="#CC240000" Offset="0.65"/>
</LinearGradientBrush>
</DataGrid.Resources>
<DataGrid.Columns>
<DataGridTextColumn Width="30" Header="Id" IsReadOnly="True" Binding="{Binding Id}"/>
<DataGridTextColumn Width="100" Header="Company" IsReadOnly="False" Binding="{Binding Company}"/>
<DataGridTextColumn Width="130" Header="Name, Surname" IsReadOnly="False" Binding="{Binding Name}"/>
<DataGridTemplateColumn Header="Actions" CellTemplate="{StaticResource myTemplate}"/>
</DataGrid.Columns>
</DataGrid>
C#
clientList.Items.Add(new DataClients { Id = 1, Company = "My Company", Name = "Jane Roe"});
Exceptions
Exception:Thrown: "'EditItem' is not allowed for this view."(System.InvalidOperationException)
Exception:Thrown: "The string was not recognized as a valid DateTime. There is an unknown word starting at index 0." (System.FormatException)

You need to set the ItemsSource property of the clientList DataGrid to a collection of DataClients objects that supports editing. HashSet<DataClients> does not for example but List<DataClients> and ObservableCollection<DataClients> does.
You could call the ToList() method on the collection that you set as the ItemsSource for the DataGrid to convert it to a List<DataClients>:
clientList.ItemsSource = yourCollection.ToList();
The "The string was not recognized as a valid DateTime" error message should be pretty self-explanatory. You are trying to convert a string which doesn't contain a valid date or time value to a DateTime value somewhere, perhaps in the 'myTemplate'.
There is nothing in the DataClients class that you have posted that will cause this exception to be thrown so it is impossible for anyone to tell.
But please only ask one question per thread and then start a new thread if you have a new question.
Please also remember to mark helpful posts as answer to close your threads.

How to display data in ComboBox when click on DataGrid Row.

Hi!
     I am new to Adobe Flex. I am building one Project that was related to Comapny and Customer. First I created Company Master. Then I create Customer Master successfully and My Backkend is SQLite Database.
     My Problem is I have two files one is CustomerMaster and second one is CustomerForm.
     In CustomerMaster I have a datagrid in that data was displaying thru Array Collection. When ever we doublick on datagrid row it's displayed a CompanyForm. CompanyForm contains TextFiled and ComboBox. TextFiled populating data but Combobox doesnot. It display always prompt message.
      Please help.
Thanks,
Sree Kumar

Hi! Vibhuti Gosavi,
                      First of all thanks for your quick reply. Already I saw that link.
Actually, In CustomerForm successfully store the information into the database. While retrieving the data problem cames. Sample Code:
CustomerMaster:
private function createItem():void
                                        openTab(new Object());
                              public function openTab(customer:Object):void
                                        var children:Array = tn.getChildren();
                                        var length:int = children.length;
                                        for (var i:int = 0; i<length; i++)
                                                  if (children[i].customer.customerId == customer.customerId)
                                                            tn.selectedIndex = i;
                                                            return;
                                        var form:CustomerForm = new CustomerForm();
                                        tn.addChild(form);
                                        form.customer = customer;
                                        form.dao = dao;
                                        form.addEventListener(CustomerEvent.CREATE, customerChangeHandler),
                                                  form.addEventListener(CustomerEvent.UPDATE, customerChangeHandler),
                                                  form.addEventListener(CustomerEvent.DELETE, customerChangeHandler),
                                                  tn.selectedChild = form;
                              private function customerChangeHandler(event:CustomerEvent):void
                                        customerArrayList = dao.findByCustomerAll();
                                        if (event.type == CustomerEvent.DELETE)
                                                  tn.removeChild(event.target as CustomerForm);
                    ]]>
          </fx:Script>
          <mx:Canvas id="container" left="12" right="12" top="12" bottom="12">
                    <mx:Canvas left="0" top="2" right="0" height="33">
                              <mx:Button id="AddCustomer" x="1" width="108" height="32" click="createItem()"
                                                     icon="@Embed('assets/icon_plus.png')" label="Add Customer" toolTip="Add Customer"
                                                     verticalCenter="-1"/>
                    </mx:Canvas>
                    <code:SuperTabNavigator id="tn" x="0" y="39" width="681" height="197"/>
                    <mx:DataGrid id="customerList" x="1" y="262" width="680" height="231"
                                                   dataProvider="{customerArrayList}"
                                                   doubleClick="openTab(customerList.selectedItem)" doubleClickEnabled="true">
                              <mx:columns>
                                        <mx:DataGridColumn dataField="customerId" headerText="Id"/>
                                        <mx:DataGridColumn dataField="customerName" headerText="Name" />
                                        <mx:DataGridColumn dataField="companyName" headerText="companyName" />
                              </mx:columns>
                    </mx:DataGrid>
          </mx:Canvas>
CustomerForm:
public function set customer(customer:Object):void
                                        this._customer = customer;
                              public function get customer():Object
                                        return this._customer;
                              private function saveCustomer():void
                                        if (Validator.validateAll(customerValidators).length>0)
                                                  return;
                                        _customer.customerName = customerName.text;
                                         _customer.companyName = companyName.text;
                                        if (_customer.customerId > 0)
                                                  updateCustomer();
                                        else
                                                  insertCustomer();
                              private function insertCustomer():void
                                        try
                                                  Alert.show(_customer.normalPkts);
                                                  dao.insertCustomer(_customer);
                                                  customerId.text = _customer.customerId;
                                                  dispatchEvent(new CustomerEvent(CustomerEvent.CREATE, _customer, true));
                                                  var alertText:String="Company Created Successfully!";
                                                  Alert.show(alertText,"",4,null,null,ConfirmMessage);
                                        catch (error:SQLError)
                                                  var alertErrorCreate:String="Company not Created...";
                                                  Alert.show(alertErrorCreate+"\n"+error.details,"",4,null,null,ErrorMessage);
                              private function updateCustomer():void
                                        try
                                                  dao.updateCustomer(_customer);
                                                  dispatchEvent(new CustomerEvent(CustomerEvent.UPDATE, _customer, true));
                                                  var alertText:String="Company Updated Successfully!";
                                                  Alert.show(alertText,"",4,null,null,ConfirmMessage);
                                        catch (error:SQLError)
                                                  var alertErrorText:String="Company not Updated...";
                                                  Alert.show(alertErrorText+"\n"+error.details,"",4,null,null,ErrorMessage);
                              private function deleteItem():void
                                        try
                                                  dao.deleteCustomer(_customer);
                                                  dispatchEvent(new CustomerEvent(CustomerEvent.DELETE, _customer, true));
                                        catch (error:SQLError)
                                                  Alert.show(error.details, "Error");
                    ]]>
          </mx:Script>
   <mx:Grid x="10" y="10" width="665" height="130" verticalAlign="middle">
                    <mx:GridRow width="665" height="100%">
                              <mx:GridItem width="85" height="100%">
                                        <mx:Label width="85" text="Customer Id:"/>
                              </mx:GridItem>
                              <mx:GridItem width="115" height="100%">
                                        <mx:TextInput id="customerId" text="{_customer.customerId}" editable="false" width="115"/>
                              </mx:GridItem>
                              <mx:GridItem width="102" height="100%">
                                        <mx:Label width="102" text="Company Name:"/>
                              </mx:GridItem>
                              <mx:GridItem width="100" height="100%">
                                        <mx:ComboBox id="companyName" dataProvider="{companyIdList}" labelField="companyName"
                                                                       prompt="Select..." text="{_customer.companyName}" width="100"/>
                              </mx:GridItem>
                      <mx:GridItem width="230" height="100%" horizontalAlign="center" verticalAlign="middle">
                                        <mx:Button label="Save" click="saveCustomer()"/>
                                        <mx:Button label="Delete" click="deleteItem()"/>
                              </mx:GridItem>
                    </mx:GridRow>
          </mx:Grid>
=====================================================================
I have two ArrayCollections 1) companyIdList (CustomerForm)
                                          2) customerArrayList(CustomerMaster)
please go through the bold text. Please focus on two dataProviders. These dataproviders are binding for One Combo Field.
Thanks,
Sree Kumar
Message was edited by: sreekumar1976

How to add event listener to datagrid ROW

I need to know if it is possible to have the datagrid rows execute a state change.
For example: I have a datagrid populated with various items, when one row is selected I want it to change the state of a part of the canvas it is in.
How is this possible? I can not give the row an id so I would not be able to say "when row is selected change state" because there is no way to tell what row is selected.
Help please. Thanks.

See Flex 4 and MXDataGridItemRenderer.

DataGrid row padding?

Trying to use a DataGrid to display two columns of data.
However, there is a lot of space between the rows making this
rather unattractive. Any thoughts or ideas?
<mx:DataGrid x="10" y="10" borderStyle="none"
sortableColumns="false" selectable="false" showHeaders="false"
fontSize="12" color="#000000" fontWeight="normal" width="392"
height="207">
<mx:dataProvider>
<mx:Object Label="Manufacturer" Value="General
Mills"/>
<mx:Object Label="Category" Value="Cereal breakfast
foods"/>
<mx:Object Label="Description" Value="Toasted whole grain
oat cereal with kid-friendly ring shape"/> 
<mx:Object Label="Quantity" Value="425 g Box"/>
</mx:dataProvider>
<mx:columns>
<mx:DataGridColumn dataField="Label" headerText=""
textAlign="left" width="115"/>
<mx:DataGridColumn dataField="Value" headerText=""
textAlign="left" wordWrap="true"/>
</mx:columns>
</mx:DataGrid>

"Phrankie" <[email protected]> wrote in
message
news:go4tgo$jra$[email protected]..
>
quote:
Originally posted by:
ntsiii
> Did you look for that word ("padding") in the DataGrid
docs? Combine that
> with rowHeight, and I think you will be good to go.
>
> Tracy
>
> Nor have I found a way to lessen the distance between
the text baseline
> and
> the gridline directly below, but I sure would like to!
The datagrid rows
> are
> excessively tall in a number of my projects.
>
> Flex/CSS padding doesn't conform entirely to the normal
HTML/CSS since of
> the
> term. For instance, paddingBottom has a fixed lower
display limit, while
> paddingTop has no limitation.
>
> Additionally, some sort of inheritance causes my CSS
datagrid padding
> styles
> to affect the datagrid rows AND the header ... even when
I add a
> headerStyle
> with its own distinct padding values.
>
> This CSS works as expected, though originally I would
have expected that
> these
> padding values would not affect the header:
>
> DataGrid {
> paddingBottom: 10;
> paddingBottom: 10;
> headerStyleName: "mydataGridHeaderStyle";
> }
>
> /* However the follow declaration does NOT style the
datagrid?s header
> padding
> independently */
>
> .mydataGridHeaderStyle {
> paddingBottom:2; /*no effect */
> }
>
> Given the following declarations the heading responds as
expected ... but
> the
> datagrid rows only honor paddingTop.
>
> DataGrid {
> paddingTop: -4;
> paddingBottom: -5;
> }
>
> Perhaps the datagrid row refuse to honor negative
values, whereas the
> header
> complies.
>
> A little perplexed here.
>
> Suggestions?
That might be another manifestation of this:
http://flexdiary.blogspot.com/2008/06/using-css-typeselector-with.html
HTH;
Amy

Insert String array as label content in datagrid row through radio button C# wpf?

I have written some code for inserting label at runtime having its content set to a string array and then insert that label into a datagrid row . All of this will initiate when certain radiobuttons are checked. code is working perfectly fine. But i need
to improve this code as i am learning C#, wpf and datagrid. I know there can be a certain way to improve this code.
This code will be a nightmare when there are 50 radiobuttons.
can it be improve and how it can be? if u can explain that will be very kind of you
Xaml Code:
<Grid>
<RadioButton x:Name="rb_1" Content="RadioButton" HorizontalAlignment="Left" Margin="351,85,0,0" VerticalAlignment="Top" GroupName="1" />
<RadioButton x:Name="rb_2" Content="RadioButton" HorizontalAlignment="Left" Margin="351,105,0,0" VerticalAlignment="Top" GroupName="1"/>
<RadioButton x:Name="rb_3" Content="RadioButton" HorizontalAlignment="Left" Margin="351,120,0,0" VerticalAlignment="Top" GroupName="1" />
<RadioButton Content="RadioButton" HorizontalAlignment="Left" Margin="351,159,0,0" VerticalAlignment="Top" GroupName="2" />
<RadioButton x:Name="rb_4" Content="RadioButton" HorizontalAlignment="Left" Margin="351,179,0,0" VerticalAlignment="Top" GroupName="2"/>
<RadioButton Content="RadioButton" HorizontalAlignment="Left" Margin="351,199,0,0" VerticalAlignment="Top" GroupName="2" />
<Button Content="Button" HorizontalAlignment="Left" Margin="713,60,0,0" VerticalAlignment="Top" Width="75" Click="Button_Click_2"/>
<DataGrid x:Name="datagrid_" HorizontalAlignment="Left" Margin="549,85,0,0" VerticalAlignment="Top" Height="253" Width="399" />
<RadioButton Content="RadioButton" HorizontalAlignment="Left" Margin="351,226,0,0" VerticalAlignment="Top" GroupName="3" />
<RadioButton x:Name="rb_6" Content="RadioButton" HorizontalAlignment="Left" Margin="351,246,0,0" VerticalAlignment="Top" GroupName="3"/>
<RadioButton Content="RadioButton" HorizontalAlignment="Left" Margin="351,266,0,0" VerticalAlignment="Top" GroupName="3" />
<RadioButton Content="RadioButton" HorizontalAlignment="Left" Margin="351,298,0,0" VerticalAlignment="Top" GroupName="4" />
<RadioButton x:Name="rb_8" Content="RadioButton" HorizontalAlignment="Left" Margin="351,318,0,0" VerticalAlignment="Top" GroupName="4"/>
<RadioButton Content="RadioButton" HorizontalAlignment="Left" Margin="351,338,0,0" VerticalAlignment="Top" GroupName="4" />
</Grid>
Code Behind:
public partial class MainWindow : Window
public MainWindow()
InitializeComponent();
DataTable dt;
DataRow dr;
string[] str = new string[4];
int location = 0;
int count = 0;
private void Window_Loaded(object sender, RoutedEventArgs e)
dt = new DataTable("emp");
DataColumn dc1 = new DataColumn("Factors", typeof(string));
DataColumn dc2 = new DataColumn("Non_Compliant", typeof(string));
dt.Columns.Add(dc1);
dt.Columns.Add(dc2);
datagrid_.ItemsSource = dt.DefaultView;
private void Button_Click_2(object sender, RoutedEventArgs e)
if (count >= 1)
datagrid_.ItemsSource = dt.DefaultView;
dt.Clear();
str[0] = "Load Path1";
str[1] = "Load Path2";
str[2] = "Load Path3";
str[3] = "Load Path4";
int j = 0;
if (rb_2.IsChecked == true)
j = 0;
int k = 0;
dr = dt.NewRow();
Label label = new Label();
label.Height = 28;
label.Width = 100;
label.HorizontalAlignment = HorizontalAlignment.Center;
label.VerticalAlignment = VerticalAlignment.Center;
label.Content = str[j];
dr[k] = label.Content;
dt.Rows.Add(dr);
datagrid_.ItemsSource = dt.DefaultView;
location += 34;
if (rb_4.IsChecked == true)
j = 1;
int k = 0;
dr = dt.NewRow();
Label label = new Label();
label.Height = 28;
label.Width = 100;
label.HorizontalAlignment = HorizontalAlignment.Center;
label.VerticalAlignment = VerticalAlignment.Center;
label.Content = str[j];
dr[k] = label.Content;
dt.Rows.Add(dr);
datagrid_.ItemsSource = dt.DefaultView;
location += 34;
if (rb_6.IsChecked == true)
j = 2;
int k = 0;
dr = dt.NewRow();
Label label = new Label();
label.Height = 28;
label.Width = 100;
label.HorizontalAlignment = HorizontalAlignment.Center;
label.VerticalAlignment = VerticalAlignment.Center;
label.Content = str[j];
dr[k] = label.Content;
dt.Rows.Add(dr);
datagrid_.ItemsSource = dt.DefaultView;
location += 34;
if (rb_8.IsChecked == true)
j = 3;
int k = 0;
dr = dt.NewRow();
Label label = new Label();
label.Height = 28;
label.Width = 100;
label.HorizontalAlignment = HorizontalAlignment.Center;
label.VerticalAlignment = VerticalAlignment.Center;
label.Content = str[j];
dr[k] = label.Content;
dt.Rows.Add(dr);
datagrid_.ItemsSource = dt.DefaultView;
location += 34;
count++;

@Usamakhan1990,
Use usercontrol with label and checkbox is reasonable for a datagrid control if you don't want to have too much code for those radio buttons. So I agree with andy here with that usercontrol.
So is it required that your radiobutton should be outside the datagrid?
Anyway, I think you already know that you can bind data to columns yourself. So please check the following thread:
http://stackoverflow.com/questions/22922533/how-do-i-automagically-bind-a-string-array-to-a-wpf-datagrid
<DataGrid Name="_dataGrid" Grid.Row="0" AutoGenerateColumns="False">
<DataGrid.Columns>
<DataGridTextColumn Header="Column 1" Binding="{Binding [0]}"/>
<DataGridTextColumn Header="Column 2" Binding="{Binding [1]}"/>
</DataGrid.Columns>
</DataGrid>
Or define the columns from code, in case you have dynamic number of columns, for example :
string[][] array = fs.CSVToStringArray();
for (int i = 0; i < array[0].Length; i++)
var col = new DataGridTextColumn();
col.Header = "Column " + i;
col.Binding = new Binding(string.Format("[{0}]", i));
_dataGrid.Columns.Add(col);
this.ExternalData._dataGrid.ItemsSource = array;
And for Radio button part, please see here:
http://stackoverflow.com/questions/397556/how-to-bind-radiobuttons-to-an-enum
Best regards,
Barry
We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
Click
HERE to participate the survey.

Picture can not be resized to fit the screen, so i can only see half of my face when use it as wallpaper!! Suckss!!

picture can not be resized to fit the screen, so i can only see half of my face when use it as wallpaper!! How can I change it？？

There's a bug with the wallpaper. One thing that helps a bit, go to the photos app, find your pic, 'send' it to be wallpaper. You have a bit more control although not all the function you're used to.
No idea when or if Apple will fix it.

Displaying Datagrid Rows Based on User Login Id

Hey Everyone,
So the problem I am having is that I am making a product configurator and when a user logs in I want to display there previous creations in a data grid so they can select edit or reorder them....the problem I am having is for some reason I can't get the designs to show up based on specific users...here is the process i am currently using in Flex 4.5
I create 2 tables in the database (Users and Designs)
     the id for the design is based on the id of the user that created it
In flex I create 2 php services
     -One generated from the users table for creating a new user for the configurator
     -The other one is generated from the Design table and I use the getAllDesigns(); to display the designs in the data grid
All of the login info is validated through php files that are used by an httpservice call
So my idea was to run an if statement to display the designs for specific user, something like this (i know the syntax isn't right this is just to get my idea accross
Var designId = datagrid.row.id;
(allready have userId var)
if(userId != designId)
     row.visible = "false"
I have tried many different approaches but cant get anything to work
Any Ideas would be helpful
Thanks In advance

Your right, i was trying to wrap my head around that idea earlier but decided to go with this option to just see if i could get this to work then work on the server side filtering...
How would I do this in theory,
my thinking is that i query in my php file something like
SELECT * FROM DESIGNS WHERE DESIGNS.ID = USERS.ID;
then take the filtered data and pass it to a xml document
then in flex create an array list out of the xml to insert into the datagrid?
or do you have a better idea?
also will that information even be able to be editable because i am parsing the data through the xml?
Thanks for any input

Photos not resizing into template with mask

When I drag certain photos into the iWeb template, they are not resizing. When I try to change the size of the photo within the mask, the whole mask changes accordingly. I do not want the masked area to change, just the size of the photo so that it fits.
HELP!!

It's difficult (for me at least) to imagine what you are seeing. If you want, you could post some screenshots. I haven't tried this free GrabUp app, and it's not the only way to post screenshots, but it claims to be fast and easy to use:
http://www.grabup.com
...download it, take a sequence of screenshots of the problem and post the URLs from Grabup here.
It may also be useful to know the following:
. pixel size of the image and its file type, e.g. JPG or PNG
. iWeb page style, e.g. Blog, My Albums, Photos
Alternatively, simply resize your photos in iPhoto before dragging them to iWeb.

Panel not resizing for high-resolution monitors

Received this in an email from a person using an HTML5 panel: "What I'm seeing on a high resolution monitor (3840x2160) is that the panel doesn't resize to fit its container."
The container for the panel is appears to have scaled up, but the panel itself is tiny within this container.
The pixel dimensions on which the panel was built (and what's coded into the HTML for the panel) makes the panel the correct size on "normal" monitors, but it doesn't appear to up rez for high-resolution monitors. The user can scale the rest of Photoshop's menus and panels using some interface in the OS, but the panel doesn't scale.
Anyone have any thoughts on this weather or not it's possible to get panels to up-rez for high-resolution monitors?
Thanks.

qsea wrote:
Why is there no scaling for high resolution monitors in Adobe Bridge CC?
Photoshop CC, Illustrator CC and Indesign CC have 200% scaling…
Inconsistency between or among applications in the artificial "suites" should come as no surprise.
The "suite" concept is a fabrication of Adobe marketing and bean-counting types. The engineering teams are totally independent of each other, they are not only in different buildings but in different cities and states of the American Union, even in different countries.
The fact that they have little if any communication among them is highlighted by requests occasionally made in these forums by top Adobe engineers to let the other teams know when there are problems in one application that impact our workflow in another one.

Datagrid within Datagrid - Rows not resizing to fit content

Similar Messages

Maybe you are looking for