last day (17 days later) » 

7:07 PM
2
A: GridView is above the drop down list. However, i want it the other way around. Drop down list is programatically added

ConnorsFanYou can add your series of DropDownLists in a Table above the GridView, and define a class style to ensure that all columns have the same width: <form id="form1" runat="server"> <asp:Panel runat="server" Width="3000"> <asp:Table ID="tblLists" runat="server" CssClass="fixedColWidth" ...>

 
Awesome This is great!. Makes it easier to set html panels. Thanks. Also another question How would i be able to make the size of the drop down the size of each columns below. like make it the same width as the column
 
The panel allows you to add the DropDownLists in the same order as the columns of the GridView. I was about to tell you how to match the column width but, with AutoGeneratedColumn="true" (by default), that is more difficult (since each column adapts its width to its content). You could set AutoGenerateColumns="false" and add a BoundField in the Columns list of the GridView for each field that you want to see. You could then control the width of each column.
I updated my answer to show the solution with AutoGenerateColumns="false". By the way, your original code must show an extra DropDownList, since you loop from 0 to the cell count. I modified that in my code example.
 
I am getting an error listed below: {"A field or property with the name 'ID' was not found on the selected data source."} Not sure what is needed to do here.
 
In my code example, I showed columns for fields ID and Name. These probably don't correspond to your data. The DataField properties must match the field names of your data source. You can set a breakpoint on the line GridView1.DataSource = DtSet.Tables(0) and see what the column names are for DtSet.Tables(0).
 
Yeah so the fields wont always have the same name. they can arrive with different column names. What i need to do is no matter what each dropdown should have the same width as the column that it is looping with. not sure how to to that.
 
7:07 PM
It would be quite complicated to do if each column is free to adapt to its content (it would involve Javascript code, I think). A simpler solution is to force all columns to have the same fixed width. I don't know if it would be acceptable for you. If so, I can modify my answer.
 
I believe that would be perfectly fine. to give the columns a fixed with. Thank you so much for the help
I tried to do what you just recommended but however its not changing the column size. <style> .fixedColWidth td { width: 150px; } </style> <asp:Panel ID="pnl1" runat="server" /> &nbsp;<asp:GridView ID="GridView1" runat="server" CssClass="fixedColWidth" CellPadding="4" ForeColor="#333333" GridLines="None" Height="273px" Width="450px">
 
You should remove Width="450px". That property forces the GridView to adjust the columns to fit that total width.
 
yeah that was silly of me. sometimes we all have those duhh moments. Thanks @ConnorsFan. You have been big help. Would love it if you would help in my next issues that i face. Thanks
 
Good! You're not the first to forget that Width (it took me some time to notice it). Looking forward to helping you again in the future, or to getting help from you!
 
Facing another issue the dropdown items are not the same width as the grid view column width.I have them both on 150 px
Facing another issue the dropdown items are not the same width as the grid view column width.I have them both on 150 px......... Cut this got it. I made the grid view 141 px and the drop down 150. i think the arrow button takes some width away.
 
7:07 PM
If you set CellPadding="0" CellSpacing="0" for the GridView, the widths will probably match using the same values. If you prefer to have some spacing/padding in the grid, you can adjust the list widths like you did.
 
I did that. But lets say if i have more than 7 columns then the page puts the drop downs in another row. however, i want the page to keep going to the right.
 
At this point, it could be better to replace the Panel by a Table with a single row. You could add cells and put a DropDownList in each cell. It would prevent wrapping, and you could apply to it the same CellPadding, CellSpacing, and the same class style as to the GridView.The two elements being of the same type, they could be matched more naturally.
An alternative would be to insert your DropDownLists inside the header cells of the GridView. :-)
 
so remove <asp:Panel ID="pnl1" runat="server" /> and replace it with <table>?
 
I haven't tested the updated answer but it should be close to work... :-)
 
i tested it its saying that a drop down list item cant be placed in the table being the parent :/
 
7:07 PM
Oops, I had forgotten one word in code. I updated the answer.
 
getting an error saying Line 21: <asp:Table ID="tblLists" runat="server" CssClass="fixedColWidth" ...> Description: An error occurred during the parsing of a resource required to service this request. Please review the following specific parse error details and modify your source file appropriately. Parser Error Message: The server tag is not well formed. thanks a lot for all this help
 
Just to be sure: the ... in the Table declaration are to be replaced with actual properties (e.g. CellPadding, CellSpacing, BackColor) or to be removed.
 
yeah i did that realized tht there were three dots and now its not showing up the drop downs at all. i have the same code as you provided.
 
I just tested the code and it works. You can put a breakpoint in Page_Load and follow the code execution to see if the controls are created and added to the TableRow.
 
got it. the code is reading my column count with this GridView1.Rows(0).Cells.Count - 1 not GridView1.Columns.Count - 1. The dropdowns are still not the same size as the grid view columns. :/
 
7:07 PM
You can set CellPadding and CellSpacing to zero everywhere (Table and GridView), and increase the width of the DropDownLists (in code) to match the cell width (or one or two pixels less). You are now in a position to play with these parameters to get the best possible match. If needed, you can create an additional class style to be applied to the Table in place of fixedColWidth. It would give you even more freedom when trying to match widths.
 
Yeah i made cell padding and spacing to zero everywhere but the dropdowns after the 5th dropdown just dont seem to take the pixel amount for some reason. i have the grid view at steady 150px and the drop down had to shrink to 105 only. But yet still it goes weird and doesn't match the gridview column size. :/.
 
Does it look like the browser width forces the cells to shrink? If so, you could put the Table and the GridView inside a Panel with a huge width (e.g. 3000 pixels) to see if it makes a difference. And, thinking about it, the code to create the DropDownLists could be moved inside the PreRender event handler of the page (when the GridView columns are sure to exist).
 
not sure how to do this. any links or suggestions or answers i can use?
 
I will update. I am juste a little busy now (at work, :-) ).
 
hey not a worry anytime is fine. Thank you!
 
7:07 PM
Updated. The Panel width can be reduced, once everything works.
 
just updated my code and still the same :/ the drop down list is all over the place with its width meaning its not the same width as the grid view columns. Added a picture in the question above of the issue i am facing.
Hey someone just gave me a suggestion which stated that instead of having a table i can just have another gridview with the same width. How would i be able to edit the code that you posted in order to do this. Thank you so much
 
Another GridView is just another table (the GridView is rendered as a table). My recommendation, made in an earlier comment: insert your DropDownLists in the header row of the GridView. That way, they will belong to the columns.
 
wouldn't be ableto do that thats what is required a drop down above the grid view to be the same column size but not as a header column. :/ is there another source i can use to solve this issue? Been on this for days :(.
 
Make sure that fixedColWidth is used for both the Table and the GridView, and that they both have the same CellPadding and CellSpacing. Then set a large cell width in fixedColWidth (e.g. 300px), and a larger Panel width (e.g. 10000px, more than enough to accomodate all columns of the specified width). If it aligns properly, you can decrease the width in the class style until you reach an acceptable layout.
 
Yeah i did that but its not changing my grid view size. this is the code i currently have <style> .fixedColWidth td { width: 300px; } </style> <asp:Panel runat="server" Width="10000px"/> <asp:Table ID="tblLists" runat="server" CssClass="fixedColWidth" CellPadding="0" CellSpacing="0"> <asp:TableRow ID="trLists" runat="server"></asp:TableRow> </asp:Table> &nbsp;<asp:GridView ID="GridView1" runat="server" CssClass="fixedColWidth" CellPadding="0" CellSpacing="0"></asp:GridView>
 
7:07 PM
The problem is probably with the Panel. You close it in the opening tag, so the Table and the GridView are not in it. Check the markup in the answer. Also, I don't know how many columns you have but the Panel must be wider than the total width of all the columns (colCount * 300px).
 
omg should i go in the corner and cry now? lol. thank you so much this works. all i had to do was not close the panel tag above the table. set the width to 150 for the gridview and set the ddlist width to 151.
I am not sure what will be the exact number of columns it could be 20, or 40. number is not decided.
 
You may need to adjust the Panel width in the PreRender event (of the GridView or of the page) to make sure that it is wide enough to accomodate the full table and grid.
 
I have a question regarding. lets say the drop down is basically associated with a column. What i want to do it lets say dropdown 3 is column 3 from the grid view. How would i associate that drop down with column number 3 from the grid view? Like how would i loop through the given code?
 
You can add custom attributes to controls. You could add a ColumnIndex or a FieldName attribute to each DropDownList.
 
how would i be able to do that? and thank you for opening the chat window
 
8:01 PM
You can add an attribute with ctl.Attributes["ColIndex"] = colIndex.ToString(), and retrieve it with int colIndex = int.Parse(ctl.Attributes["ColIndex"]);.
 
8:22 PM
okay lets say i have row 1 as manhattan, and row 2 as brooklyn
how would i call the gridview to show me that value as a text?
 

  last day (17 days later) »