Answered
Routing extension using back button in lieu of link
The tutorial for SDK online extension has a Back link using <a href="#default">Back</a>. A nicer user experience would be to use a q2-btn. (I see this in our OLB Q2, which seems to be submitting the form, I assume, to default route.)
Couple of questions:
- Curious why q2-btn does not have an href attribute that we can set to #default to behave like a link? Perhaps it is a lot to build out, or am I missing it?
- Would you confirm that this is accomplished via a q2-btn with javascript onclick to submit form to default route?
Many thanks!
166 Views
1
Answer
one year ago
one year ago
Tags
Hey Bina, great questions!
Tecton tries to make their custom components behave as close to the native element they are "replacing" to help reduce the learning curve, and speed up development when using our components.
We included a link in the demo to show an alternative way of navigating within your extension for the tutorial.
The
hrefattribute is not supported on a native HTML<button>element, so we don't expose that as an attribute in our<q2-btn>. You are free to attach a click handler to a<q2-btn>that callssubmitForm('default')Hope that helps!
— Justin Poirier one year agoAh! Been living in
asp-action=""world for a while did not realize the button does not have href! Good point.Thank you for the easy submitForm javascript, I was attempting
window.location.href=without luck.If I may inquire though, why does athe anchor tag
— Bina Reed one year agohref="#default"work? Natively, would point to tag with id of default?I am curious on how this linking w/ "#default" is wokring as well. I have never done development inside of an iframe before so I kind of just assumed it was something we can get away with when developing in such a way.
— Dan Horton one year agoGood questions!
— Justin Poirier one year agoEvery HTML file you return to from
extension.pyis wrapped in an HTML file from the SDK that provides a couple different things. This is wheresubmitForm()lives, allowing you to access it from your files without instantiating it yourself.Along with
submitForm(), some other things live there. One of those things is a selector that grabs all anchor elements, parses the text after the hash symbol, and attaches a click handler that will callsubmitForm(hashValue)whenever that anchor element is clicked. If there's no hash symbol, it will behave as links normally do.That response just answered like three more of my questions. Glad to know that it is available and even happier to know that it is abstracted away so I don't have to worry about it if I decide I want that functionality :)
Thanks Justin. Enjoy your Labor Day weekend.
— Dan Horton one year ago