I currently have a select dropdown which is expanding outside the modal window. Is it a better design to increase the window height and keep the dropdown inside it ? ( in which case how to do it ?)
or better keep using this current design ?
in your CoffeeScript you can grab the click event of your dropdown, and reset the height of your modal window:
toggleModalHeight = ->
$('#your_drop_down').on 'click', (event) ->
$('#modal_id').css('height','new height here')
$(document).ready toggleModalHeight
#For avoid Turbolinks issues
$(document).on 'page:load', toggleModalHeight
Within the toggleModalHeight function you can even calculate the new height of your modal and set it properly. Hope have helped you.
Related
How to hide Bootstrap 5 modal programmatically in React?
I have tried this:
const myModal = document.getElementById("dis-approve-modal");
myModal.hide();
but it says "hide is not a function".
i'm sure this not the right way to do it -via HTML element properties-
but if you want to do it this way try
myModal.hidden = true;
I have an IG on my page with a custom toolbar button that opens a Modal Dialog page. Because of how the modal dialog is opened, ther eisn't a way for me to capture its closure using native Dialog Close.
The javascript I use in my IG to open Modla Dialog is:
apex.server.process(
'GenerateURL',
{x01: l_url},
{success: function (pData) {
console.log(pData);
// Call Modal Dialog Page
apex.navigation.redirect(pData);
},
dataType: "text"
});
The issue is that after the modal dialog is closed I need to refresh my IG. How can I capture modal dialog closure from the parent page?
Modal dialogs should be opened with apex.navigation.dialog. When one calls apex_util.prepare_url for a modal page, it generates the correct JavaScript code that takes into account the settings for the destination page.
There's an option, p_plain_url, that can be used to get just the URL, but don't enable that in GenerateURL as the rest is important. Another parameter, p_triggering_element, allows you to specify the element for a Dynamic Action (that's not an option with apex_page.get_url, which works similarly).
Let's say GenerateURL looked like this (note that I'm passing document as the triggeringElement):
declare
l_url varchar2(512);
begin
l_url := apex_util.prepare_url(
p_url => 'f?p=' || :APP_ID || ':51:' || :APP_SESSION || ':::::P51_ID:' || apex_application.g_x01,
p_triggering_element => 'document'
);
apex_json.open_object();
apex_json.write('url', l_url);
apex_json.close_object();
end;
Then the JavaScript code could be modified to this:
apex.server.process(
'GenerateURL',
{x01: idForURL},
{success: function (pData) {
var funcBody = pData.url.replace(/^"javascript:/, '').replace(/\"$/,'');
new Function(funcBody).call(window);
}
});
Note that the JavaScript is passing an ID to the process that generates the URL, not the whole URL. This makes the use of the process somewhat limited which helps prevent users from abusing it. You could even add a check that verifies the user is able to view the ID value passed in.
With that in place, you can add a Dynamic Action listening for the Dialog Closed event on the document (JavaScript Expression = document). Note that the event will not fire if the dialog is closed via the close or cancel buttons.
I want to set modal dialog title dynamically based on an interactive element.
ex) In page 50, I've made an Interactive Grid and set the link on "Title" column, when user click on title column, a modal dialog appears.
I want to set the title of that modal dialog to title column's content.
But modal dialog's title doesn't change dynamically.
In this case, how can I apply the titles dynamically?
I've seen many solution related to this question, but I can't solve my problem.
Let's say, your model page number is 51. Here are step by step approach [TESTED] to dynamically change title of model page:
Create a hidden item in your model page, let's say the hidden item name is P51_Title.
In Interactive report -> title column link -> click on link builder box -> set values -> add Hidden item as P51_TITLE under Name and value as '#Title#' Column (#ColumnName#).
In model page 51 static region header (title property), add hidden item value as &P51_TITLE. (dot is mandatory to add at last. This is substitution string with & and dot(.) before and after of item name respectively)
save both the pages and run. when you will click on title column link, the link will be redirecting to the model page and title data will be passed through URL to hidden item in the session, so model page header will automatically change based on title data from report.
I made such dialogcreate js function.
It moves popup page Title to modal dialog title.
So, dynamic calculated title &P51_TITLE. would be applied automatically.
$(document).on("dialogcreate", ".ui-dialog--apex", function(e) {
var lDialog = $(this);
lDialog.find('iframe').on('load',function () {
lDialog.children(".ui-dialog-content")
.dialog("option", "title", $(this.contentDocument).find('title').html());
});
});
I am very disappointed that something like this (or any other solution) do not work in apex modal pages by default!
How can i properly use scroll function inside Instagram popup.
I used js function to scroll , which didnt worked
window.scrollBy(0,800);
via Imacros
EVENT TYPE=KEYPRESS SELECTOR="HTML>BODY" KEY=34
As well before scroll event used to click between users to make popup active and then used scroll, before it worked but for now it's not.
Is there any proper way to scroll inside popup?
I think the following command may be helpful:
EVENT TYPE=KEYPRESS SELECTOR="div.j6cq2" KEY=34
This works for me in 2019... Don't change anything!
FList = driver.find_element_by_css_selector('div[role=\'dialog\'] ul')
numberOfFollowersInList = len(FList.find_elements_by_css_selector('li'))
FList.click()
actionChain = webdriver.ActionChains(driver)
time.sleep(random.randint(2,4))
while (numberOfFollowersInList < max):
actionChain.key_down(Keys.SPACE).key_up(Keys.SPACE).perform()
numberOfFollowersInList = len(FList.find_elements_by_css_selector('li'))
time.sleep(0.4)
print(numberOfFollowersInList)
actionChain.key_down(Keys.SPACE).key_up(Keys.SPACE).perform()
time.sleep(1)
I have a shiny dashboard app with 3 tabs and a notification menu. I am trying to track user activity on the dashboard and wish to log each of their clicks on the dashboard.
The code in server.R for the tabset panel is as below:
output$tabs1=renderUI(
tabsetPanel(type="tab",
tabPanel(id="OverallTab","Overall Activity"),
tabPanel(id="Tab1","Tab 1 details"),
tabPanel(id="Tab2","Tab 2 details"))
Part of my notification code is as below:
output$notiMenu <- renderMenu({
all_nots <- apply(u_notd, 1, function(row) {
notificationItem(text = row[["notification"]], icon("users"))
})
dropdownMenu(type = "notifications", .list = all_nots)
})
I am trying to use shinyjs to write to a dataframe if a user clicks on either of the tabs or notification menu as below:
tab1_clicled=""
tab2_clicked=""
noti_clicked=""
shinyjs::onclick("notiMenu",print("Notification clicked"),noti_clicked="YES")
shinyjs::onclick("Tab1",print("Tab1 clicked"),tab1_clicled="YES")
shinyjs::onclick("Tab2", print("Tab2 clicked"),tab2_clicled="YES")
df=as.data.frame(tab1_clicked,tab2_clicked,noti_clicked)
I face 2 issues here,
1) the on click option doesn't appear to work for the tab panels, using the shinyjs reference(here), I see that there is only a mention of using on click for the tabset panel and not for each tab panel?
2) I'm unable to modify the value of tab1_clicked inside the onclick function. It throws an error saying: Unhandled error in observer: unused argument (tab1_clicled = "YES")
Appreciate any help.
I just quickly skimmed your code and I can see two errors. The first parameter of onclick is the ID of the element. In your case, you want the ID of the actual tab button, but unfortunately the way tabs work in shiny, "Tab1" is actually the ID of the container of the tab panel but it's not the id of the tab button itself. Look at the HTML of a shiny app and you'll see that. Tabs are a bit weird and annoying and it's really difficult to deal with the tab buttons themselves in shiny.
Secondly, The second argument of onclick is the expression, but you're trying to run two expressions print("Tab1 clicked") and tab1_clicled="YES". You need to wrap these in {} so that it's considered one expression, like this:
onclick(id, {print("Tab1 clicked"); tab1_clicled="YES"}
But unfortunately getting the id of the tab button is difficult so I don't think onclick will be useful for that