I am very new to React to JS and also this is my first question to the community so please help me.
I want to create a table which will display the data from a JSON file (it should display some 50 rows per page), also I need the capability to modify the data in the same table and later update the contents of the JSON accordingly.
I need to have the following types of cells in the table: Normal uneditable text box, editable text box, Select Lists (showing data from another JSON file), Number fields, calendar, etc..
I know it might feel like a stupid question to many of you but please help me understand how to approach this problem.
(I am not asking for working code, please help me on how to get started with it.)
Thank you.
Tons of libraries on github can do what you need.
For example:
https://react-bootstrap-table.github.io/react-bootstrap-table2/
https://github.com/tannerlinsley/react-table
https://material-ui.com/demos/tables/
There are many many others, which one should be used is based on your detail requirement and then find the best fit.
For table :
1. Create a component
2. Store the json value in state.
3. construct table. In tbody use state.map and return rows.
For uneditable text-box make it read-only.
Related
Can someone help me to decide when i should use The Table component over the Data Table with "Editable" option selected?.
I know the logic approach could be to consider the amount of information the table will present in the coach and Choose Data Table for large chunks of data, however, with the capabilities of the normal Table (Pre-load, Lazy load) is not clear when to use one over the other.
Thank you
If you use the Data Table control with "Editable" selected, you're actually using the exact same code-base as the Table control.
So the real question is: "When should I use Editable vs. Read-Only?"
My answer to that question is:
If you have a small dataset, always use Editable. This will greatly simplify things.
If you have a large dataset, but you need to allow inline editing, use Editable.
If you have a large dataset, and you do not need to allow inline editing, I would still recommend using Editable mode unless performance becomes an issue. The reason I say that is Read-Only mode treats every control in your table as output text and ignores some configurations that you might have considered important when building your table. Additionally, it makes it complicated to use modal displays inside of your table.
So to summarize, you should really only use Read-Only mode as a last resort. Even then, there are other approaches for improving table performance, including the Server-Side loading option.
For more information, please visit this link.
Hope that helps,
Gordon
we want to realize the following:
Generate PDF with Template,which means set value in AcroFields
Create a big details table (structure of table is also in template). In this progress, the details will occupy more than one page.
If the detail table is on multi pages, the header of the table should be also on top of the new page.
We found some examples on following website:
http://kuujinbo.info/cs/itext_template1.aspx
http://kuujinbo.info/cs/itext_template2.aspx
But the details the founction is omitted there.
Add content; the code for _do_form_fields(), _get_transaction_details(), and _transaction_summary() are omitted, since they only return strings to add to ColumnText. ColumnText is smart; each call to Go() renders as much text that will fit on the current page and returns a status code that tells you: (1) how much text (to write) is remaining, and/or (2) how much space is still available on the page. On each iteration you add text to the current page, call ColumnText.HasMoreText() to inspect the status, and then Document.NewPage() if necessary.
Is there anyone who had same situation before? We are appreciated that you could offer some tips or suggestions.
Thank you.
best regards,
Cheng Gong
You are already making a mistake in the first step of your requirements.
You say "Generate PDF with Template,which means set value in AcroFields."
The first part is OK: you want to generate a PDF with a template. However, this doesn't mean setting values in AcroFields. That's only one option. It's the option you take if you consider PDF being the digital equivalent of paper. The form is static: every coordinate is fixed. You just fill out data at the appropriate places. If the data doesn't fit the designated areas, you're out of luck. I already referred to chapter 6 of my book in a comment. You can also see how AcroForms work in a longer tutorial: https://www.youtube.com/watch?v=6YwDME0Fl1c (This tutorial is almost completely dedicated to creating a report from a data set.)
Another way to create PDF from a template is by using the XML Forms Architecture. In this case (if you have a pure XFA form), your PDF is a container for XML. You can then inject XML data into this form and the form will adapt itself depending on the data. A one-page form can easily grow into a 20-page document when filled out. This is explained in this video: https://www.youtube.com/watch?v=h0wzj84tnmw (Note that the video dates from 2012. The product I present has been finished and the results are much better now.)
Alternatives to this approach could be to create a template in HTML. I often refer to this solution as a poor man's XFA solution. This solution requires XML Worker. You can see an example in this video: https://www.youtube.com/watch?v=clWoDrEEl50
This is a general answer. I couldn't be more specific because your question isn't clear. You first need to make your mind up regarding the approach. Right now, you talk about AcroFields and at the same time about ColumnText. In the long tutorial, this is described as the hard way. See also the corresponding online samples. It is very confusing why you're asking a very difficult question before asking the simple questions. Unless of course, you already have the answer to those simple questions. If so, please share these answers.
I am struggling myself thinking about which component to use in my new app.
The first screen I am using Collection View with big images. Once the user touches one cell, it goes to the second screen ... and here is the problem.
I have three columns, similar to a dictionary with first language, second and third. The user will be able to choose which column he wants to search, and according to his criteria it will show the result that matches. I am not sure how to implement this, which component gives the best experience to the user. Any idea is more than welcome. Thank you in advance. Alex
If your data is several rows each with 3 columns, I would recommend customizing a UITableView. I followed this tutorial when I was trying to set up something similar.
The Table View will also give you efficiency if you have a lot of data, and you can build the custom table cells in the interface builder so that makes life a little easier.
-Ken
I'm not sure if I'm using the correct terminology to describe my questions so I created a few mock ups to try to show what I am trying to do.
I have an existing table listing order detail information that looks something like this:
I have some additional attributes I want to add columns for, but I would like it to appear on a separate line as part of the same row sort of like this:
The reason I want to add these columns but have them appear on the second line of each row is that I want to display more data in each row but I don't want to make the row/page wider.
I did some googling for this problem, but I'm not even sure what the standard name for this type of display is so I wasn't able to come up with anything. The closest I found was [this code project link](http://www.codeproject.com/KB/webforms/MasterDetail.aspx
) which is close to, but not the same thing I am trying to do.
Not sure what to call it either (multiline gridview?) but it should be possible. I would suggest looking at making a grid with a template column and a formview inside the template. In the rowdatabound event of the grid you write code to bind your form to the row's data. I have used this technique before on nested grids, it should work with other controls as well. Might be simpler ways to do it too, not something I have had a need to work out before.
EDIT:
I just saw a similar question where someone provided a link to this article. Not quite what we were talking about here, but very similar. Thought I would include it here as well for future reference. To bad it was written 5 months after this question was asked...
One update:
I tried using the SummaryRow on the datagrid for its basic functionalities and it is working. Now, I need to embed the text in the summary fields. E.g. If one of my summaryfields returns me the count then it should be able to display 'TOTAL (count)'
Is it possible with the summaryrow?
Also, I need to have the data to be formatted when it is displayed. e.g. %age, like 50%, 0.1%, etc.
Is this also possible?
Hi,
One quick question. I have an AdvancedDataGrid. I need to add a summaryrow to the grid which will contain SUM/AVERAGE of the respective columns in the ADG. Can anyone point me to some tutorial or any reference where I can learn how to create a summaryrow?
Thanks!
The advancedDataGrids introduction from adobe contained a demo, but it doesn't seem to be on the web anymore. Have you tried looking at the SummaryField reference? I haven't used summary fields in a while, but it seemed pretty straightforward.
http://livedocs.adobe.com/flex/3/langref/mx/collections/SummaryField.html
This is actually a formatting example, but it contains all the code to create a summary row:
http://www.adobe.com/cfusion/communityengine/index.cfm?event=showdetails&productId=2&postId=11472
Actually, the simplest and easiest approach I found was having another ADG placed below the existing ADG. The new ADG will act like a summary row and hence will have only one row. After initializing the content ADG, we can render the cells of the summary ADG the way we want. Moreover, we can sync the horizontal scroll of the new summary ADG with the content ADG. so, in all it will actually be seen as the ADG with the summary row
Even though its actually not a summary row and one needs a lot of customizations, it does make sense to use this. :)