I'm trying to get all the columns and their headers to align:
But everything seems to have a mind of its own and I get this:
The code I am using is pretty simple:
<DataTable
:value="someValue"
responsiveLayout="scroll"
:scrollable="true"
scrollDirection="both"
class="p-datatable-lg"
scrollHeight="500px"
>
<Column field="field1" header="Service"/>
</DataTable>
I've tried a host of things, namely setting the width of a column like so:
style="min-width:200px"
The current solution is to simple remove scrollDirection="both" which results in this:
We want to prevent that word wrapping because it is hard to read.
But that also results in misaligned columns. Has anyone faced this issue and how did you resolve it?
Thank you!
Related
I have created a data table with vuetify and tried to group it with a field called "unit" like below:
<v-data-table
:loading="loading"
:headers="headers"
:items="modifiedChapters"
item-key="id"
class="elevation-1"
disable-sort
group-by="unit"
:page.sync="chaptersInput.pageNo"
:items-per-page="chaptersInput.limit"
:server-items-length="totalCount"
#update:options="onUpdatePagination"
>
The output of the code is a bit weird. It is grouping the item more than once with the same name. I have added a photo below for better understanding. Here you see that both the units "Introduction" and "Unit One" are grouped more than once. How can I solve the issue?
It seems this is cause by disable-sort. You can try it by opening Grouping example in Code Pen - if you add disable-sort it will break...
There is already an issue in Vuetify repo but it is hard to say whether it is a bug or intended behavior as nobody of maintainers commented on it...
Workaround is to not use disable-sort and instead set sortable: false on each header definition (tested)
Other workaround would be to pre-sort your data yourself by the same column you are passing into group-by as the group-by logic apparently (and logically) expects the rows are sorted by the grouping column. But this is of course less practical if you want to allow user to switch grouping by using show-group-by prop (also tested)
I have a UI5 table, but would like to have an input element that span multiply rows under the other text. Something like the table below.
<table>
<tr><td>v1</td><td> v2</td><td> v3</td></tr><br>
<tr><td >input text </td></tr>
</table>
Unfortunately, you'll have to find another approach. The sap.m.Table type does not currently support this, as there are no span type of properties on the sap.m.Column type.
Ok. Learned that it is not possible at the moment.
So I'm just going to use a textarea at the end of the line. I think it may look okay.
Did you mean row span like here or column span like here
For rowspan there is existing sap.m.Column attribute mergeDuplicates you may want to check.
I want to get 'Rank' value from MASSOCCECE table, since past 2 days I have been searching a lot to get this value but failed I tried 'ProductDatBean', 'RelatedProductDataBean' but couldn't figure out how to get the value of 'rank'.
I have four products as cross-sell of a product and I want to sort them on the basis of 'rank'.
It would be a great help if anyone could tell me how to get this value besides using customized bean.
EDIT: For more clarity, adding my code
<wcbase:useBean id="g_mA" classname="com.ibm.commerce.catalog.beans.ProductDataBean" >
<c:set target="${g_mA}" property="productID" value="${catentry_ID}" />
</wcbase:useBean>
<c:set var="g_associatedProducts" value="${g_mA.productCrossSells}" scope="request"/>
<c:forEach var="associatedProducts" items="${g_associatedProducts}" varStatus="status">
${associatedProducts.rank}
</c:forEach>
Got the value, thanks everyone for responses.
I was doing the right thing (${associatedProducts.rank}) for getting this value but I was misguided a little , They were items that were associated and I was informed that they were Products, so getting blank while implementing this logic for Item. Used ItemBean now everything is working fine.
When running a report in preview I get the following error The definition of the report is invalid , the tablix 'Tablix11' contains an invalid TablixMember. The sort Expressions element is not allowed if Group is omitted.
I have never come across this error before and cant understand what is causing it.
The error can be replicated by creating a simple Tablix and looking at the underlying XML.
When you create a Tablix with a group, the underlying RDL XML will include something like this:
<TablixRowHierarchy>
<TablixMembers>
<TablixMember />
<TablixMember>
<Group Name="Group1">
<GroupExpressions>
<GroupExpression>=Fields!val.Value</GroupExpression>
</GroupExpressions>
</Group>
<SortExpressions>
<SortExpression>
<Value>=Fields!val.Value</Value>
</SortExpression>
</SortExpressions>
<TablixMembers>
<TablixMember>
<Group Name="Details3" />
</TablixMember>
</TablixMembers>
</TablixMember>
</TablixMembers>
</TablixRowHierarchy>
If you remove the entire Group element, this will give the same error you're seeing:
If you also remove the SortExpressions element this will allow the report to render without error.
However - it's impossible for me to say how your RDL file got in this state in the first place. Given that hacking XML to get things running is seldom a good idea, my recommendation would be to start the tablix from scratch instead of hacking things to a working state - you might just be introducing more problems.
But at least hopefully now you can see why the error might be occurring.
I found that the Tablix header had a textbox property containing interactive sort. This text box is in the header, and not part of the detail. When I deleted the field from the detail of the tablix, the interactive sort remained on the textbox in the header.
Changing it on the header by right clicking on the header textbox of the tablix, then selecting textbox properties, then selecting "interactive sorting", and then correcting the "sort by" value to the correct field name did the trick.
I have the following code to generate a pdf from data:
<p:barchart is3D="true" legend="false" orientation="horizontal" width="520">
<p:series key="Gráfico">
<ui:repeat var="ocr" value="#{myBean.value}" >
<p:data key="#{ocr[0]}" value="#{ocr[1]}" />
</ui:repeat>
</p:series>
</p:barchart>
The problem is that the key from p:data gets aligned to the right (for some odd reason). I tried placing the code between divs with text-align, but it didn't worked.
I want the alignment to be on the left.
If someone has an answer, or at least an idea for me to try, I'd really appreciate.
Thanks in advance.
Is the value you're assigning an int or other numeric value? Trying casting it to a String instead.