How can I pass a value when creating a new tab panel with CSJS - html

I want to create a new tabbed panel for the Dojo tab container using CSJS like:
dijit.byId('#{id:djTabContainer1}').createTab({ tabTitle: Math.random()});
The default tab panel has an panel that will use the iframe tag and I want to pass in the above call the src html attribute to the panel.
Question : I can specify a url to load in the iframe. Is there a way to pass this?
It seems like the createTab only does certain tab related parameters like action and tabTitle.
Howard

The syntax is somewhat obscure here. Starting with the code in the ExtLib demo app:
XPagesExt.nsf/Core_DynamicTabs.xsp
Change the script in button4 to:
dijit.byId('#{id:djTabContainer1}')
.createTab({
"newName":'Tab'+Math.random(),
"newHref":'/XPagesExt.nsf/page5.xsp'})
to match the syntax you're requesting.
And, in the tab that's referenced by defaultTabContent, change the title and href to use those passed URL parameters:
<xe:djTabPane xp:key="doc" id="djTabPane2"
title="${javascript:/*load-time-compute*/param.newName}"
href="${javascript:/*load-time-compute*/param.newHref}"
It will create the tab and will attempt to load the href contents. I'm not seeing it as an iframe though - it's just a container div.

Related

How to share anchor links with angular components on angular 14?

I have a component menu which contains a few anchor tags. Each tag brings the user to that respective page section. I am trying to share the same anchor tag among the other components.
For example, I have two more HTML components called homepage.component.html and details.component.html. For each I call the menu.component.html by its selector. Both homepage and details html components have an id for the section I wanna scroll to. Here's how it looks like:
menu.component.html
Go to content
for both homepage.component.html and details.component.html
<div class="home-content" id="content"> Here comes more code </div>
It should work just like in a non-dynamic html project, however, when the anchor tag is clicked, the url redirects to '' (which is the first/default page) and then it shows the content for the first page, instead of the current componenet I am on.
I have tried creating a function where I get the current url and using the router.navigate, I pass the parameters indicating the fragment:
menu.component.ts
currentRoute: string
scrollToItem(){
this.currentRoute = this.router.url
this.router.navigate([this.currentRoute], {fragment: 'content'})
}
menu.component.html
<a (click)="scrollToItem()">Go to content</a>
However, this function adds the id #content to the url each time the anchor tag is clicked, redirecting the user to my 404 page.
I wanted to know if there is a way to use an anchor tag on the menu.componenet.html, while all the items that have "content" as their ids in different components are going to be displayed. Hopefully I made my question clear. If there is still questions about how the error occurs I can create and shate a stackblitz project. Thanks in advance :)

Change the src of an iFrame using select tag (without javascript)

Currently, what I have looks something like the following...
option 1
option 2
<iframe name="frame"></iframe>
However, I'd like to use the selected option of a <select> tag to change the source of my frame instead.
Is this possible to do without using javacript?
Put the select element inside a form, set the target of the form to the frame, add a submit button, and then submit it.
Then you’ll need to map the URLs generated (the form’s action with a query string containing the name and value of the select element) to your PDFs on the server.

Adding html target attribute to APEX tree link

I use a tree for navigation in an Oracle APEX app, and use the "Link Column" setting for navigation.
Although, I would like to use the <a> tag attributes (target="_blank", for instance). The Link column only sets the href attribute to the link.
I would like to use another column in my table to set it as the target or other tags.
The link attributes on a tree don't support the target attribute. If you want the link to open a new window/tab you can change the link to run javascript to open the target. Set Target Type = URL, and set the URL to:
javascript:window.open("...link to page...","_blank")
e.g. if your query has a column called LINK_URL:
javascript:window.open("&LINK_URL.","_blank")

Using a tag in a dynamic url

I'm struggling to get the contact ref to work from different pages.
Basically for every product a different detail reference is provided (see 4867820 below).
I would like to create a button which links to the #contact id for every page on the website.
Basically if I put a link on the button including the reference, this works perfectly.
http://www.mywebsite/product/4867820#contact
However I am wondering if I can create something similar where the button links to the contact id on the same page without using the reference number.
http://www.mywebsite/product/this page#contact
So basically my question is how do I link to only #contact on this page without the reference numbers, so I can create 1 button on the page template.
Regards,
Assuming it will always point to the same page as the button:
a) If you are able to use anchor tags instead of buttons (and CSS-style them to look like buttons), you can simply point the anchor's href attribute to the section name.
It works like a relative link, just appending the href to current URL. Like so:
Contact Here
Or b) if you have to use only a <button> or <input> element specifically, you will need to use javascript to set the location in onclick handler of the button. For details on that see: Javascript inline onclick goto local anchor

href = "#report-item" but not shown on url - how it works

I want to know how in this web site, when I hover the mouse over report ad of the page, it show the link as ....com/***/***#report-item, but when I click on it, it shows me a pop-up. but still the original URL is not changing to ....com/***/***#report-item?
I checked the source of the page, and it shows the link code as:
<span><i class='ico-report'></i>Report Ad</span>.
That is because they prevent the browser from doing what it is meant to do (default event).
Here is the JavaScript code for that:
event.preventDefault();
You can include that inside the element, something like
Link
And inside the function, add that code. It would prevent the default function; that is to change the URL.
Maybe they're using jQuery for that because I can't see any sort of onclick="" inside the element. So what they might be doing would be this:
Generate Report
and the jQuery code would be as:
$('a.report').click(function () {
event.preventDefault(); // prevent the default function of the hyperlink
/* show the pop up */
});
This way, the website is preventing the default function and is using that link to do some other function.
Here is a fiddle for that: http://jsfiddle.net/afzaal_ahmad_zeeshan/3zPd6/
To get the Elements Attribute
To get the element's attribute in JavaScript you use the following code
document.getElementById("hyperlinkId").href;
This would get you the href of the hyperlink. And you can reference it in your call.