Editable form for WordPress plugin options page

Question

For my new plugin Scripts and Tags Manager I want to add the possibility for the users to edit rows and add / remove rows. Each row is a form element that contains a text field for the dynamic remarketing tag variables, a text field for the conversion id and a page to add the tag to. I would like to present it is a editable data grid or as a editable table where the row can be edited when clicked on and then opens in a model window to edit.

Which way is the most 'native' way to go about this? With native I mean the way using as much build in WordPress functions etc for both the php end and most probally the jQuery end (I prefer jQuery)?

NB. I know how to create the code and I'm not looking for advice on how to use options sections etc but more on which jQuery lib or something is well suited and which method to use to implement it like admin only ajax call with jquery with lib x. That would be great...

I made sort of a placeholder html mockup of what I'm wanting and this looks like this:

PS this is the plugin it's for: https://wordpress.org/plugins/omnileads-scripts-and-tags-manager/

Answer 1

An update as I figured out somethings for myself:

dialog.js is not part of the core jQuery UI and thus isn't available via the standard jQuery handle. I have found queuing it difficult and to differ in success over theme's I tried. If it works it looks, to put it nicely, a bit crappy so that requires more work. I settled with jquery and used a regular form for posting new tags. I load the table via ajax calls that are available with the standard jQuery handle. For me this works better for now as it works on most themes and is user friendly enough for me now. Making it nicer is not worth the effort with dialog for me at this point.

I also used the wp_myaction_callback for admin only secure referrer callbacks for admin panel for which I use the WordPress nonce functions to do so.

Gr.