2sxc: During Edit.TagToolbar customization when moving edit button to a different group and adding a custom button everything breaks and whole page becomes unclickable.

I’m submitting a … [x] bug report => search github for a similar issue before submitting

…about [x] edit experience / UI [x] admin experience UI

Current behavior I was trying to make tagtoolbar first menu group contain 2 buttons: default edit button for certain entity object and custom button. However even though they work perfectly when used separately if I use both and click edit button - everything breaks. And I mean console has this error: ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: '3/9/edit' Error: Cannot match any routes. URL Segment: '3/9/edit' and also whole page becomes unclickable so I have to reload the page to make anything work.

Here is the code I used: @Edit.TagToolbar(entityObj, toolbar: new[] { "-edit", "+group=mainGroup", "+edit&group=mainGroup", "+custom&icon=icon-sxc-cancel&group=mainGroup&color=red?call=customJsFunction&param1=" + entityObj.EntityId + "&param2=" + entityObj.Title })

Expected behavior After applying code sample from above edit button should work.

Instructions to Reproduce the Problem

  1. create some entity type and add at least one entity object there.
  2. edit your cshtml file by adding to any div tag you like this code: @Edit.TagToolbar(entityObj, toolbar: new[] { "-edit", "+group=mainGroup", "+edit&group=mainGroup", "+custom&icon=icon-sxc-cancel&group=mainGroup&color=red?call=customJsFunction&param1=" + entityObj.EntityId + "&param2=" + entityObj.Title })
  3. either add variable entityObj before this code and assign to it your entity object or edit variable name to pass there your entity object
  4. save code changes and open the page in browser
  5. click edit button and see error message in dev tools console and see the page that became not interactable (clicking anything doesn’t work)

Why change the behavior? Because broken edit button for entity is crutial. It’s basic CRUD functionality for module that is must have.

Your environment Windows 10 Visual Studio 2019

  • 2sxc version(s): 11.22.1
  • Browser: Chrome 94.0.4606.81
  • DNN: 9.10.00
  • Language: English

Anything you would like to add

About this issue

  • Original URL
  • State: closed
  • Created 3 years ago
  • Comments: 15 (7 by maintainers)

Commits related to this issue

Most upvoted comments

So here’s the cause:

the toolbar parameter can be different things - the old APIs gave it a complex tree-style object to configure the toolbar, and the new v10 API gives it an array of strings.

It appears than under certain circumstances, the Razor compiler will treat the new[] { "-item-history", "+item-history", "-edit", "+group=mainGroup", "+edit&group=mainGroup", "+custom&icon=icon-sxc-cancel&group=mainGroup&color=red?call=customJsFunction&id=" + itemObject.EntityId + "&name=" + itemObject.Name } as an object[] instead of a string[], in which case ATM it assumes it’s the old API, and doesn’t process the parameters.

I’ve updated the code to better detect this. as a workaround you can spend some time ensuring it’s an IEnumerable<string> instead of an IEnumerable<object> and you could already fix this now, but a real fix will be in the next release.

I can reproduce. Still working on the cause, but it appears that…

  1. The Edit.Toolbar(...) doesn’t add the details for the item in the toolbar (server-side)
  2. The dialog then opens, but since it errors, it will not properly initialize, so the click-to-close fails

…working on it