I want to load data on window scroll event
this is my code:
private scrollChangeCallback: () => void;
ngOnInit() {
this.scrollChangeCallback = () => this.handleWindowScroll(event);
window.addEventListener('scroll', this.scrollChangeCallback, true);
}
handleWindowScroll = (event): void => {
const total = this.sites.length;
const page = this.getPageForIndex(total);
let bottomPosition = event.srcElement.scrollTop + window.innerHeight + 25;
let scrolledHeight = event.srcElement.scrollHeight;
if (this.sites != null && bottomPosition > scrolledHeight && !this.theEnd && total >= this.pageSize) {
this.siteRepositoryService.loadSites(this.searchTerm, page);
this.subscribeOnScroll();
}
}
It gives error on firefox ReferenceError: Event is not defined.
I have try every possible solution and spend enough time for this but it's not working can someone help me?
I have solve this error by two ways:
Update firefox
User ngAfterViewInit instead of ngOnInit
Related
much to my surprise I've successfully made an apps scripts that sends me email notifications when a specific cell is changed to 'Submitted,' but I have no idea how to make this identify the sheet it came from - have linked a copy of the sheet below, there are going to be around 20 of these, each with 6 submission sheets, and I need to do a thing as soon as the sheet has been marked submitted, i.e. same day. I'd rather not hard code in separate messages for each sheet, can I do something around getting the URL and sheet with the get active sheet coding and insert it into the email message? I'm also aware currently I've hard coded in the sheet names and therefore need 6 different triggers, I'm working on that - tried loads of different coding pages and this is the only one that worked!
https://docs.google.com/spreadsheets/d/1b0LOr9vhmFu4WtYy_RbS-1cvXncNOI_x3YT0f30fZgY/edit#gid=1979912158
Cheers,
Meg
function emailSubmit() {
MailApp.sendEmail("Testemail", "Test", "Test message");
}
function onEdit(e) {
const specificSheet = "Sub1"
const specificCell = "C11"
let sheetCheck = (e.range.getSheet().getName() == specificSheet)
let cellCheck = (e.range.getA1Notation() == specificCell)
if (!(sheetCheck && cellCheck) || e.value !== "Submitted") {
return;
}
else {
emailSubmit()
}
}
function onEdit2(e) {
const specificSheet = "Sub2"
const specificCell = "C11"
let sheetCheck = (e.range.getSheet().getName() == specificSheet)
let cellCheck = (e.range.getA1Notation() == specificCell)
if (!(sheetCheck && cellCheck)) {
return
}
else {
emailSubmit()
}
}
To obtain the spreadsheet object bound to the fired onEdit trigger, use the event object source
Sample:
function emailSubmit(spreadsheet, sheet) {
console.log("spreadsheet: " + spreadsheet);
console.log("sheet: " + sheet);
MailApp.sendEmail("Testemail", "Test", "Spreadsheet " + spreadsheet + " and tab " + sheet + "have been submitted");
}
function onEdit(e) {
const allowedSheets = ["Sub1","Sub2"];
const specificCell = "C11";
const spreadsheetName = e.source.getName();
const sheetName = e.range.getSheet().getName();
let sheetCheck = (allowedSheets.indexOf(sheetName) != -1);
let cellCheck = (e.range.getA1Notation() == specificCell);
if (!(sheetCheck && cellCheck) || e.value !== "Submitted") {
return;
}
else {
emailSubmit(spreadsheetName, sheetName);
}
}
References:
Event Objects
getName()
indexOf()
I'm using wbraganca dynamic-form. The problem I'am facing is that datepicker works fine for the first row of dynamic form. But on rest of the rows its not working. I have tried almost every possible solution for it but none of them worked for me.
The first alteration I did to code is by making changes in yii2-dynamic-form.js by replacing the code below
// "kartik-v/yii2-widget-datepicker"
var $hasDatepicker = $(widgetOptionsRoot.widgetItem).find('[data-krajee-datepicker]');
var $hasDatepicker = $(widgetOptionsRoot.widgetItem).find('[data-krajee-datepicker]');
if ($hasDatepicker.length > 0) {
$hasDatepicker.each(function() {
$(this).parent().removeData().datepicker('remove');
$(this).parent().datepicker(eval($(this).attr('data-krajee-datepicker')));
});
}
with this
// "kartik-v/yii2-widget-datepicker"
var $hasDatepicker = $(widgetOptionsRoot.widgetItem).find('[data-krajee-kvdatepicker]');
if ($hasDatepicker.length > 0) {
$hasDatepicker.each(function() {
$(this).parent().removeData().kvDatepicker('remove');
$(this).parent().kvDatepicker(eval($(this).attr('data-krajee-kvdatepicker')));
});
}
and now it is showing an error in the console as below
Uncaught TypeError: Cannot read property 'deprecated' of undefined
at Datepicker.remove (bootstrap-datepicker.js:33)
at HTMLDivElement.<anonymous> (bootstrap-datepicker.js:1649)
at Function.each (jquery.js:365)
at jQuery.fn.init.each (jquery.js:137)
at jQuery.fn.init.datepickerPlugin [as kvDatepicker] (bootstrap-datepicker.js:1626)
at HTMLInputElement.<anonymous> (yii2-dynamic-form.js:316)
at Function.each (jquery.js:365)
at jQuery.fn.init.each (jquery.js:137)
at _restoreSpecialJs (yii2-dynamic-form.js:315)
at _addItem (yii2-dynamic-form.js:116)
Thanks in advance.
Actually, I was struggling for hours and finally came up with a simple solution, sometimes it is better to figure up a solution from your experience rather than searching for hours.
I did same as you did but then I made this simple modification
// "kartik-v/yii2-widget-datepicker"
var $hasDatepicker = $(widgetOptionsRoot.widgetItem).find('[data-krajee-kvdatepicker]');
if ($hasDatepicker.length > 0) {
$hasDatepicker.each(function () {
// $(this).parent().removeData().kvDatepicker('remove');
// here is the solution
$(this).parent().find('.krajee-datepicker').kvDatepicker(eval($(this).attr('data-krajee-kvdatepicker')));
});
}
Jus catch the input that has .krajee-datepicker class and initialize it with KvDatepicker loading to it the options of the first datepicker element you have created.
It worked for me. tell me if it works
I was working on this problem on many embeded dynamic forms and the problem was solved in next way:
1.-Go to folder frontend/web/assets or backend/web/assets and delete all files there (cache files) except .gitignore if you're using git
2.-Go to vendor/wbraganca/yii2-dynamicform.js and comment paragraph block
// "kartik-v/yii2-widget-datepicker"
/*
var $hasDatepicker = $(widgetOptionsRoot.widgetItem).find('[data-krajee-datepicker]');
if ($hasDatepicker.length > 0) {
$hasDatepicker.each(function() {
$(this).parent().removeData().datepicker('remove');
$(this).parent().datepicker(eval($(this).attr('data-krajee-datepicker')));
});
}
*/
3.-Paste next code there
// "kartik-v/yii2-widget-datepicker"
var $hasDatepicker = $(widgetOptionsRoot.widgetItem).find('[data-krajee-kvdatepicker]');
if ($hasDatepicker.length > 0) {
$hasDatepicker.each(function () {
console.log("Clonado2....");
$(this).parent().removeData().off();
//$(this).parent().removeData().kvDatepicker('remove');
$(this).parent().kvDatepicker(eval($(this).attr('data-krajee-kvdatepicker')));
//$(this).parent().find('.krajee-datepicker').kvDatepicker(eval($(this).attr('data-krajee-kvdatepicker')));
});
}
4.-Enjoy ;D
I'm using the API successfully but encountered an error this morning with "OOPS! Something went wrong" sitting in the textbox and the user cannot type into it. I found the issue to be key related and fixed, however, this brought to light that some issue may arise and the user cannot complete because of this blocking. I'd like to be able to detect in javascript if there is some issue with the google.maps.places.Autocomplete object and not bind it to the textbox.
For anyone else wanting to do this.
Thanks to the folks for the idea over at:
Capturing javascript console.log?
// error filter to capture the google error
(function () {
var oldError = console.error;
console.error = function (message) {
if (message.toLowerCase().includes("google maps api error")) {
document.getElementById('<%=hdnGoogleSelected.ClientID %>').value = "DISABLE";
triggerUpdatePanel();
//alert(message);
}
oldError.apply(console, arguments);
};
})();
Mine is in an update panel so I triggered the update which sets the onfocus back to this.select(); for the textbox which effectively disables the autocomplete attempts.
tbAddress1.Attributes["onfocus"] = "javascript:this.select();";
Another option:
Google will return an error after about 5 seconds from loading.
"gm-err-autocomplete" class indicates any error with the autocomplete component.
You can periodically check for the error class google returns. I do it for 10 seconds after loading:
function checkForGoogleApiErrors() {
var secCounter = 0;
var googleErrorCheckinterval = setInterval(function () {
if (document.getElementById("AddressAutocomplete").classList.contains("gm-err-autocomplete")) {
console.log("error detected");
clearInterval(googleErrorCheckinterval);
}
secCounter++;
if (secCounter === 10){
clearInterval(googleErrorCheckinterval);
}
}, 1000);
}
I am using Page object model where I am calling the below function written in a page_object.js from my spec. I have tried all possible ways but it always fails on switch. Please help
var Twitter_Actions = function (){
this.authorizeAccount = function(username,pswd){
browser.ignoreSynchronization = true;
return browser.getAllWindowHandles().then(function (handles) {
var popUpHandle = handles[1];
expect(popUpHandle).toBeDefined();// Asrton to cnfrm pop-up is defined
browser.switchTo().window(popUpHandle); // Failing on Switch
var windowtitle = browser.getTitle().then(function(webpagetitle){
return webpagetitle;
});
console.log(windowtitle);// Printing title on the console to debug
browser.executeScript('window.focus();');
element(by.name("session[username_or_email]")).sendKeys(username);
element(by.name("session[password]")).sendKeys(pswd);
element(by.id('allow')).click();
});
}
}
I have been trying many things to attach a click event handler to a selection box in tinymce 4.0.2 content with no success. Does anyone know how to do this in a custom plugin? The following is what I have tried but it is not functioning.
ctr++;
var id = 'vnetforms_elem_'+ctr;
editor.insertContent('<select id="'+id+'"><option>X</option</select>');
tinymce.dom.DOMUtils.bind(tinymce.activeEditor.dom.select('#'+id)[0],'click',function() {
alert('click!');
});
Using jQuery this may help:
$(ed.getBody()).find('#'+id).bind('click', function() {
alert('click!');
});
I have solved my own problem.
It turns out that this was indeed a bug in firefox. When a select element in firefox is marked as editable it doesn't fire events. I was able to resolve this with the following.
ctr++;
var id = 'vnetforms_elem_'+ctr;
editor.insertContent('<select id="'+id+'"></select>');
tinymce.activeEditor.dom.select('#'+id)[0].contentEditable = 'false';
addEvent(tinymce.activeEditor.dom.select('#'+id)[0],'click',function() {
alert('MyClick');
});
Where addEvent is defined in the custom plugin as
var addEvent = function(node,eventName,func){
if ("undefined" == typeof node || null == node) {
} else {
if (!node.ownerDocument.addEventListener && node.ownerDocument.attachEvent) {
node.attachEvent('on' + eventName, func);
} else node.addEventListener(eventName,func,false);
}
}; this.addEvent = addEvent;