invoke nested Editor in code?

SteveD

I'm liking the nested Editor function and the example makes sense to me...

Is there a way to properly invoke the nested Editor (for creating a new record) in code?

I can invoke the embedded Editor using its .create() function but it's missing the "Create new entry" header text and "Create" footer button. More importantly, it doesn't seem to dismiss back to the previous Editor instance properly...

I tried triggering the nested "New" button from code (it works properly when clicked) but the .trigger() function doesn't seem to do anything

allan

Probably the easiest method is to make use of the buttons().trigger() method to activate the action that the button would do:

editor.field('users.site').dt().buttons(null, 0).trigger()

Note how the field().dt() method is used to get the DataTables instance that is used for the nested table.

I can invoke the embedded Editor using its .create() function but it's missing the "Create new entry"

That's how the create() method works - if you call it directly you need to also set the header (title()) and buttons (buttons()).

Allan

SteveD

Thanks Allan, that's helpful. I had somehow left out the 'B' value in the dom option so the button itself was missing!

Also, if I go the via-code route, I see the title() and buttons() API options to get my headers/buttons back, but I'm not able to instantiate the (sub) editor so that it's dismissal returns back to the outer editor. It simply dismisses all layers of the editor entirely....

thanks for your help

allan

You need to have the outer Editor shown first. For example, on this page if you select a row and then click "Edit", then in the console run:

editor.field('users.site').dt().buttons(null, 0).trigger()

And finally close that nested Editor, it will take you back to the outer Editor.

Editor's open and close methods have the layering built in, so the layering only operates when the Editor form is already displayed.

Allan

SteveD

thanks Allan. I must not have been clear.

I can get the .trigger() of the button to work properly and the sub-editor opens & closes correctly.

But, if I try to open the sub-editor using its .create() or .edit() then it appears correctly, but when I dismiss it, the super-editor closes as well, rather than just the sub-editor disappearing and leaving the original editor view behind... does that make sense?

I suspect it's the technique used in the call but I'm having trouble finding an explanation, perhaps due to the newness of the sub-editor capability (which is saving my butt, thankfully!)

allan

which is saving my butt, thankfully

Haha! It is my favourite feature at the moment .

You are absolutely right - I'd misunderstood a bit, apologies. With calling the editing methods directly the nesting is not automatic (almost, but not quite). You need to pass in a nest parameter to the form-options object (unfortunately, it looks like I forgot to add the documentation for that - to be corrected!) - so you might do:

siteEditor.create({
  nest: true,
  title: 'Create',
  buttons: [ 'Save' ]
})

Or:

siteEditor.edit( selector, {
  nest: true,
  title: 'Edit',
  buttons: [ 'Save' ]
})

while also takes care of the buttons and title.

Allan

SteveD

ah ha!

thank you sir