fill html with fdf data in javascript

Question

I want to fill an html document using a fdf data string.

I have an regex that parses FDF Data (Form Data from a PDF)

\/T\(([^)]*)\)\/V[(\/<]([^>)]*)

Debuggex Demo Result Demo

I want to use this fdf Data to populate my html document by matching the id.

let regexp = "\/T\(([^)]*)\)\/V[(\/<]([^>)]*)";
let fdfdata = "'><</T(Talent_FW_1)/V(0)>><</T(Talent_FW_10)/V(4)>><</T(Talent_FW_11)/V(4)>><</T(Talent_FW_12)/V(0)>><</T(Talent_FW_13)/V(3)>><</T(Talent_FW_14)/V(5)>><</T(Talent_FW_15)/V(4)>><</T(Talent_FW_16)/V(2)>><</T(Talent_FW_17)/V(7)>><</T(Talent_FW_18)/V(0)>><</T(Talent_FW_19)/V(0)>>'";

let fdfarray = [...fdfdata.matchAll(regexp)];

console.log(fdfarray[0]);
// is undefine


for (i = 0; i < fdfarray.length; i++) { 

document.getElementById("array[i][0]").innerTEXT =  array[i][1];
}

<p id="Talent_FW_14">this should be the Value Five<p>
<p id="Talent_FW_15">this should be the Value Fours<p>

Source for the code

it seems the regex is not working as I expect and the array stays empty.

Answer 1

Your regex as stated is a string, not a regex. You also need to add the g (global) flag to the regex to fill an array using .matchAll(). Here is the fixed regex:

let regexp = /\/T\(([^)]*)\)\/V[(\/<]([^>)]*)/g;
let fdfdata = "'><</T(Talent_FW_1)/V(0)>><</T(Talent_FW_10)/V(4)>><</T(Talent_FW_11)/V(4)>><</T(Talent_FW_12)/V(0)>><</T(Talent_FW_13)/V(3)>><</T(Talent_FW_14)/V(5)>><</T(Talent_FW_15)/V(4)>><</T(Talent_FW_16)/V(2)>><</T(Talent_FW_17)/V(7)>><</T(Talent_FW_18)/V(0)>><</T(Talent_FW_19)/V(0)>>'";
let fdfarray = [...fdfdata.matchAll(regexp)];

console.log(JSON.stringify(fdfarray, null, ' '));

returns:

[
  [
    "/T(Talent_FW_1)/V(0",
    "Talent_FW_1",
    "0"
  ],
  [
    "/T(Talent_FW_10)/V(4",
    "Talent_FW_10",
    "4"
  ],
...snip...
  [
    "/T(Talent_FW_19)/V(0",
    "Talent_FW_19",
    "0"
  ]
]