i have this element to which various change events are applied
how can i trigger my own function after all change events have occurred in mootools
a sample scenario is a drop down list
$('ddl').addEvent('change', function () {
// some ajax call going on here and which i can't affect
// as the page is generated that way
});
i now want to call my function right after the change event is done but adding another change event will not do as i believe the events are executed async
pass on a callback function through the onComplete of the ajax that you reference.
eg:
$("ddl").addEvents({
change: function() {
new Request({
method: "get",
url: "somefile.php",
onComplete: function() {
// run your next stuff from within here, referencing
// this.response.text or whatevever and call up another function.
}
}).send("action=checkuser&id="+this.get("value").trim());
}
});
there's also the Chain class - http://mootools.net/docs/core/Class/Class.Extras#Chain but as you have async stuff going on, you really need the onComplete on the Request.
Related
In app use content script for all pages, and send message to active page on complete loaded page, but I have many calls of script sometimes 2 and more:
You can see that here
Code implimentation:
chrome.tabs.onCreated.addListener(function (tabs) {
chrome.tabs.onUpdated.addListener(function (tabId, changeInfo, tab) {
if(changeInfo.status === "complete") {
let tabid = tab.id;
console.log("Site is valid: url -> " + tab.url)
chrome.tabs.executeScript(tab.id, {
file: '/injections/mobile.bet365.com.js',
});
console.log(tab);
setTimeout(function () {
console.log("timeout was set")
chrome.tabs.query({}, function (tabs) {
let countOpenedTabsFrom = tabs.length;
let opener = 1;
// на целевой вкладке
chrome.tabs.sendMessage(tabid, {
message: "start_app",
opener: opener,
queuenumber: countOpenedTabsFrom
}, function (response) {
console.log(response);
});
});
}, 500);
}
And executed script have many queries too.
Why is this happen?
Every time onCreated event fires, you're adding a new onUpdated listener.
When, after that, onUpdated event fires, all of them are executed, leading to the behavior you're seeing.
You either need to de-register the handlers when they are done, or register the handler only once. See chrome.events docs (which describe common points of all event objects in other APIs) for ideas on how to implement that.
Note that the code inside chrome.tabs.onCreated listener does not use the tabs parameter at all, so it's not clear why do you even need to listen to onCreated.
I have two functions, first $('#tabela').on('click', '.buyButton', function() and second function submitAll() How can I call first function from the second?
This will do
First function
function first() {
$('#tabela').on('click', '.buyButton', function() {});
}
In Second function:
function submitAll() {
first();
}
If #tabela is a button then use onClick="first();"
Give the first function a name
function tabelaOnClick() {
$('#tabela').on('click', '.buyButton', function() {});
}
Call it inside the second one
function submitAll() {
...
tabelaOnClick();
...
}
EDIT
If you want to click the button, you may just want to use $('#tabela').click()
If you want to fire the onClick event, better give the handle function a name, and call it from both onClick function and submitAll function.
how about using $('#tabela').trigger('click') ?
I made a module that draws a bar chart including a d3.svg.brush(). Part of my code is
Bar.prototype.init = function ( ) {
//...
this.brush = d3.svg.brush()
.y( this.y)
.on("brushend", this.brushend);
console.log(this.brushend); // works
}
Bar.prototype.brushend = function() {
console.log(this.brush); // undefined. why?
}
To access this.* values, I cannot make brushend function a normal function by using function brushend() or var brushend = function().
How should I call it properly?
D3 will call the event handler provided for its brushend event much like event handlers for normal DOM events will get called. For standard events this will reference the element the event occured upon. This rule does also apply to D3's brush event handlers where this references the group containing the DOM elements of the brush. Obviously, this group doesn't have a property brush you could reference by using this.brush from with the handler.
A workaround would be to save your reference by using a closure:
Bar.prototype.init = function ( ) {
//...
this.brush = d3.svg.brush()
.y(this.y)
.on("brushend", this.brushend()); // Get handler by calling factory
}
// A factory returning the handler function while saving 'this'.
Bar.prototype.brushend = function() {
var self = this; // Save a reference to the real 'this' when the factory is called.
return function() { // Return the handler itself.
// By referencing 'self' the function has access to the preserved
// value of 'this' when the handler is called later on.
console.log(self.brush);
};
}
So I'm basically developing an automated click-paste-and-upload system for mutiple texts and files inside a google page.
This method helped me get the instances of objects that I'm looking for: buttons, textboxes, richtextboxes, etc.
Now I want to work with them.
So for example I know the id of a button , and the function subscribed to its click event. How do I trigger the click event from the extension ? I've tried injecting a script with the click event handler (discovered with DOM inspector) at "document_startup" but I don't get an error or anything else.
Here's the content script! The loggerhead function should have inserted the script but I don't think it did. What might be the reason for the blow code not giving anything?
// Runs a function for every added DOM element that matches a filter
// filter -- either function(DOM_node){/*...*/}, returns true or false
// OR a jQuery selector
// callback -- function(DOM_node){/*...*/}
function watchNodes(filter, callback){
observer = new MutationObserver( function (mutations) {
mutations.forEach( function (mutation){
if(typeof filter === "function"){
$(mutation.addedNodes).filter(
function(i){ return filter(this); }
).each(
function(i){ callback(this); }
);
} else {
$(mutation.addedNodes).filter(filter).each(
function(i){ callback(this); }
);
}
});
});
// For every added element, a mutation will be processed
// with mutation.taget == parent
// and mutation.addedNodes containing the added element
observer.observe(document, { subtree: true, childList: true });
}
function loggerhead(node) {
console.log("passhead");
//also inject jquery
var jqueryEl = document.createElement('script');
jqueryEl.setAttribute('src', chrome.extension.getURL('jquery-1.11.1.min.js'));
jqueryEl.setAttribute('type', 'text/javascript');
var scriptEl = document.createElement('script');
scriptEl.setAttribute('src', chrome.extension.getURL('script.js'));
scriptEl.setAttribute('type', 'text/javascript');
node.appendChild(jqueryEl);
node.appendChild(scriptEl);
}
watchNodes("head", loggerhead);
// method not working
//var gmailHead = jQuery("head", document).get(0);
script.js contains the function of subscribed to the click event of the button that I've managed to find through the DOM inspector:
function Cdb(b){return function(){if(Vbb()){return Ddb(b,this,arguments)}else{var a=Ddb(b,this,arguments);a!=null&&(a=a.val);return a}}}
You should try to call the existing click handler like
buttonElement.click()
I have been trying to dynamically generate a check box from a value which is in JSON array from a JSON store.
{"MODULECATOGERY":[{"Menu":"MSU"},{"Menu":"SCHEDULE"},{"Menu":"MARKET_DASHBOARD"},{"Menu":"FE_REFERENCE"},{"Menu":"QC_TOOLS"},{"Menu":"QUICKQC_VOICE"},{"Menu":"QUICKQC_DATA"},{"Menu":"MARKETQC_VOICE"},{"Menu":"MARKETQC_DATA"},{"Menu":"SURGERY"},{"Menu":"FILE_INVENTORY"},{"Menu":"MARKET_TRACKER"},{"Menu":"DRIVE_ROUTE_TRACKER"},{"Menu":"TICKETS"},{"Menu":"TICKET_TRACKER"},{"Menu":"ASSETS"},{"Menu":"METRICS"},{"Menu":"DAILY_STATUS"},{"Menu":"DAILY_PROCESSING"},{"Menu":"WEEKLY_WORKFLOW"},{"Menu":"CUSTOMER_QUESTIONS"},{"Menu":"KPI_PERFORMANCE_METRICS"},{"Menu":"COLLECTION_METRICS"},{"Menu":"OPERATIONS_DASHBOARD"},{"Menu":"PRODUCTION_DASHBOARD"},{"Menu":"SUPPORT_DASHBOARD"},{"Menu":"REVENUE_TRACKER"},{"Menu":"DEPLOYMENT_TRACKER"},{"Menu":"TICKETS"},{"Menu":"TICKET_TRACKER"},{"Menu":"ASSET_MANAGEMENT"},{"Menu":"GENERATE_SHIPMENT"},{"Menu":"SHIPMENT_TRACKER"},{"Menu":"RESOURCES"},{"Menu":"SCHEDULE"},{"Menu":"TRACKER"}]}
How can a get values associated with "Menu" in the above JSON.? If i can have each and every value into an array then i can dynamically assign these to generate a check box group.
Thanks in Advance.
You can iterate your store:
store.each(function(record) {
var menu = record.get('Menu');
});
Edit:
Since you're saying this doesn't work with dynamic data I think you iterate it before it has completed loading. To be sure to handle the iteration after the load you can do the following:
store.on({
//Listener that fires everytime after your store has loaded
load: function() {
store.each(function(record) {
var menu = record.get('Menu');
//do stuff
});
}
});
store.load();
If you only want to execute the code the first time your store loads you can use the callback function on the load() method:
store.load(function() {
store.each(function(record) {
var menu = record.get('Menu');
//do stuff
});
});