My goal
Here is the documentation I'm trying to follow.
// Display a dialog box with a title, message, input field, and "Yes" and "No" buttons. The
// user can also close the dialog by clicking the close button in its title bar.
var ui = SpreadsheetApp.getUi();
var response = ui.prompt('Getting to know you', 'May I know your name?', ui.ButtonSet.YES_NO);
// Process the user's response.
if (response.getSelectedButton() == ui.Button.YES) {
Logger.log('The user\'s name is %s.', response.getResponseText());
} else if (response.getSelectedButton() == ui.Button.NO) {
Logger.log('The user didn\'t want to provide a name.');
} else {
Logger.log('The user clicked the close button in the dialog\'s title bar.');
}
What I expect to happen and what happens instead
I expect the UI to display a dialog box with a title, message, input field, and "Yes" and "No" buttons. The user can also close the dialog by clicking the close button in its title bar.
But instead, nothing happens.
Steps to reproduce.
Open a Google Sheet.
Open Script Editor: Tools > Script editor
Paste above code into script editor.
Close script editor.
Navigate to Google Sheet.
But as I mentioned, nothing actually happened.
How do I trigger the UI instance to initiate? What am I doing wrong?
Run this function:
function runIt() {
var ui = SpreadsheetApp.getUi();
var response = ui.prompt('Getting to know you', 'May I know your name?', ui.ButtonSet.YES_NO);
if (response.getSelectedButton() == ui.Button.YES) {
Logger.log('The user\'s name is %s.', response.getResponseText());
} else if (response.getSelectedButton() == ui.Button.NO) {
Logger.log('The user didn\'t want to provide a name.');
} else {
Logger.log('The user clicked the close button in the dialog\'s title bar.');
}
}
After getting the function to run go look at the spreadsheet.
Related
I would like the pressed state of the trumbowyg toolbar buttons (bold/italic etc) to be read out by NVDA screen reader. I have implemented the aria-pressed solution, which works fine for VoiceOver; it reads out select/deselect when the buttons have been selected and deselected, however not for NVDA:
function addValuesToTextEditorButtons() {
const toggleButton = element => {
// Check to see if the button is pressed
var pressed = (element.getAttribute("aria-pressed") === "true");
// Change aria-pressed to the opposite state
element.setAttribute("aria-pressed", !pressed);
}
const handleBtnKeyDown = event => {
// Prevent the default action to stop scrolling when space is pressed
event.preventDefault();
toggleButton(event.target);
}
var buttons = $('.trumbowyg-button-pane .trumbowyg-button-group button[type="button"]');
buttons.each(function (index, element) {
let title = element.title.split(' ')[0]
element.value = title
element.setAttribute('aria-label', title)
element.setAttribute('aria-pressed', false)
element.setAttribute('role', 'button')
element.addEventListener('click', event => {
handleBtnKeyDown(event)
})
element.removeAttribute('tabindex')
});
}
First off, verify that the element you're setting aria-pressed on is a real button (or role='button'). It looks like that's true from your code snippet but would be the first thing to verify. ARIA attributes are only valid on certain elements. (See https://www.w3.org/TR/html53/dom.html#allowed-aria-roles-states-and-properties)
Some screen readers might still announce the value of the attribute even if it's not valid so sometimes that explains why one SR works (such as VO) whereas another does not (NVDA).
I've used aria-pressed successfully with all screen readers without a problem. For NVDA, it will announce the element as a "toggle button" and will say "pressed" or "not pressed" depending on the value.
I would like to port an existing fully functional Chrome extension to Firefox, everything seems to work except the confirm() function behavior.
When the user clicks a specific button in the popup.html page, he is asked to confirm the action.
Chrome successfully prompts the dialog, I then get a Boolean back as soon as "ok" or "cancel" button is clicked, code related to the boolean returned is executed.
Firefox behavior feels buggy on the other hand. The confirm dialog prompts too but the extension popup is instantly dismissed, preventing further code in the click event handler to execute.
manifest.json : …, "default_popup": "popup.html", …
popup.html :
…
<script src="js/popup.js"></script>
</body>
popup.js :
removeButton.addEventListener('click', function () {
// Firefox: calling confirm() closes the popup.html page ...
// ... terminating event handler code
if (confirm("Please confirm you wish to remove this item.")) {
// …
}
});
Is there something to do about it or should I stop using confirm() and find a workaround ?
EDIT - Workaround solution
As a workaround, I set a 3 seconds countdown when the button is clicked and change its caption every second. Before time is up, if the user click again, the final action gets cancelled, otherwise final action is performed.
let log = document.querySelector('p')
,resetInterval = null
;
document.getElementById('resetbtn').addEventListener('click', function(e) {
if (!resetInterval) {
// Create a countdown and delete data when time is up.
e.target.content = e.target.innerHTML;
resetInterval = setInterval( function() {
var counter = +(e.target.innerHTML.trim().match(/\d+/)||[4])[0];
if (counter == 1) {
// Sending command to bacground page
// chrome.runtime.sendMessage({command:'remove'}, function (){
e.target.innerHTML = e.target.content;
resetInterval && clearInterval(resetInterval);
resetInterval = null;
log.innerHTML = 'Perform action…';
// });
} else e.target.innerHTML = 'Reset in '+(counter-1)+'s';
}, 1000);
log.innerHTML = '';
} else {
resetInterval && clearInterval(resetInterval);
e.target.innerHTML = e.target.content;
resetInterval = null;
log.innerHTML = 'Action aborted';
}
});
<button type="button" id="resetbtn">Reset</button>
<p></p>
Popout windows are designed to be dismissed when you move focus to another window. You can’t use dialogs (new windows) from the popout as they’re moving focus and thus dismissing the popout.
Here is my situation:
I have a very long multi-page survey built by webforms in drupal.
The questions are not required but we don't want the users to skip all the questions too easy by just clicking Next Page button.
So this is what we need:
When the user try to click on "Next Page" button with any empty fields on the page, error or warning messages will show up, "Are you sure you want to skip this question?", as well as a skip button next to it. When the user click on the skip button, the message disappears and they click on the next page button to proceed the survey.
Here are my thoughts on this:
I used webform validation module to create an Not Empty validation and apply it to the fields.
in webform_validation_validators.inc:
case 'skip_if_empty':
foreach ($items as $key => $val) {
if (count($val) == 0) {
drupal_set_message(t('This field is empty.'), 'warning');
// do something, not sure about it here
}
}
Another thought:
I used the Dismiss module to display an X button next to the error message.
Can I add some functions to the X button to bypass the validation when it is clicked?
And here is the script for the Dismiss module, :
(function ($) {
Drupal.behaviors.dismiss = {
attach: function (context) {
$('.messages').each(function () {
var flag = $(this).children().hasClass('dismiss');
if (!flag) {
$(this).prepend('' + Drupal.t('Close this message.') + '');
}
});
$('.dismiss').click(function () {
$(this).parent().hide('fast');
// some functions to bypass validation to the field?
});
}
}
})(jQuery);
I don't know what to do to after the //. Or is there any other ideas that will work?
AS per the you requirement mention
Take this example
You have created webform having field like
Firstname with required field
Lastname with required field
Then Next button button
When user click next button then error show because you have make the fields are required
When your showing "Dismiss button" next to each field.
Whenr user click "Dismiss button" that time you have to remove "required" attribute of field using jquery or drupal ajax
After that when user click next button then user not get any kind of required field validation error.
I am using static FBML but I am having trouble debugging a form validation problem. I get the dialog which to me seems like it should return false, but the form submits anyway. I am using Firebug and I see a brief message in Red that I have no chance to read. I appreciate the help :-)
var txt ='Enter Zipcode';
//...
function setError(){
var obj=document.getElementById('mapsearch');
obj.setValue(txt);
obj.setStyle('color', '#FF0000');
}
function valform(){
var obj=document.getElementById('mapsearch');
var val = obj.getValue();
if(val!='' && !isNaN(val) && val.length>2 ){
return true;
} else {
setError();
(new Dialog()).showMessage('Zip Required', 'Please enter your zip code.');
return false;
}
}
//...
Try the "Persist" button if the Firebug/javascript error message in Firebug disappears too quickly. This way all messages are kept between page loads until you click "Clear".
Using the event click with live function leads to strange behavior when using Firefox*.
With live in Firefox, click is triggered when right-clicking also! The same does not happen in Internet Explorer 7 neither in Google Chrome.
Example:
Without live, go to demo and try right clicking
the paragraphs. A dialog menu should
appear.
With live, go to demo and try right
clicking "Click me!". Now both dialog
menu and "Another paragraph" appear.
*tested with firefox 3.5.3
As far as I know, that is a known issue (bug?). You can easily work around it by testing which button was clicked as follows:
$('a.foo').live("click", function(e) {
if (e.button == 0) { // 0 = left, 1 = middle, 2 = right
//left button was clicked
} else {
//other button was clicked (do nothing?)
//return false or e.preventDefault()
}
});
you might prefer using a switch depending on your specific requirements, but generally you would probably just want to do nothing (or or simply return) if any button other than the left button is clicked, as above:
$('a.foo').live("click", function(e) {
switch(e.button) {
case 0 : alert('Left button was clicked');break;
default: return false;
}
});
I think it's a known "bug", you could potentially query the event object after attaching the click handler ( which gets attached to the document ) and see if its a right click, otherwise manually attach the click handler after you manipulate the DOM.
After looking it up, e.button is the property you want to query:
.live('click', function(e){
if ( e.button == 2 ) return false; // exit if right clicking
// normal action
});
See my answer here: if you don't mind changing the jQuery source a bit, adding a single line in the liveHandler() works around the problem entirely.