0

Ours is an Angular application. In our application user has the option to upload a word document. The word documents content are visible on the UI. Apart from this, on the right section we have few text fields. The user copies the data from the uploaded word document and pastes it in the text field. After this the user saves the page.

We want a functionality in our application where after any user opens the application and loads this particular page, he should see a reference on UI between the data in the text fields and the place in the document from where the data was copied.

Currently i tried using the syncfusion library, which has the bookmark functionality. However user does not want an additional button and page to create bookmarks.

User wants the bookmarks to be auto created when we copies the data. I could not find a way to call the bookmark component directly without the UI.

Is this possible to achieve with syncfusion ? If not syncfusion is there any way i can develop this solution ? Any direction will be of great help.

Ashish Kathait
  • 226
  • 6
  • 15
  • Depending on how you want to display the reference, you might go with something as simple as parsing the pasted data for the phrases that match input fields' content and maybe color them differently, or even split the data in chunks based on those matches and asign different css style altogeher, like having the matching data in new and differently formated divs. – Misha Mashina Mar 01 '22 at 17:02
  • @MishaMashina : do you have a sample or url where i can capture the copy and paste event together and save it to DB ? So that i can retrieve the mapping back when the page is loaded back. – Ashish Kathait Mar 02 '22 at 04:04
  • Here's what I had in mind in my previous comment: https://stackblitz.com/edit/angular-ivy-22xrwv As for your question, in my example you could retrieve your input field values form the db in onInit, then set it to `partsArray`. Also, in `replace()` metod you can send `partsArray` values to db. Howevr, that would mean calling backend on each character typed in input fields, so saving to DB would be better handled via some button, like 'save changes', that the user would push once satisfied with selections. – Misha Mashina Mar 02 '22 at 09:18
  • @MishaMashina : the uploaded document is a word document. the problem is not more of saving to DB. however what i am not clear on is how do i create the link between copied text from word and pasted data in text field. I need this link to be created so that when i retrieve the data i can maybe add highlight code as displayed by you. so basically how do i create the partsArray when user copies the data from the word document opened in the application. – Ashish Kathait Mar 02 '22 at 10:30
  • How many input fields is your app displaying? Is the number fixed or dynamic? OR do you mean that the new text field should appear only when the user copies part of the text? – Misha Mashina Mar 02 '22 at 10:50
  • @MishaMashina the text field are not dynamic they are static. The fields already appear on UI, only the data is entered by the user. – Ashish Kathait Mar 02 '22 at 14:20

0 Answers0