I have a Word add-in with both a command and a taskpane. I'd like to refresh the entire browser window (so that linked content controls and fields can update). How can I do this?
If I run the following in the taskpane, only the pane reloads.
window.location.reload()
And nothing happens if i run the above in my ribbon command.
You can access the task-pane related staff from the task pane code only. Instead, you may consider tracking changes in the document itself in the task pane's code. And doing such changes in the document from your ribbon button you could force the code running on the task pane. For example, you could track the selection change:
Office.context.document.addHandlerAsync("documentSelectionChanged", myHandler, function(result){}
);
// Event handler function.
function myHandler(eventArgs){
write('Document Selection Changed');
}
// Function that writes to a div with id='message' on the page.
function write(message){
document.getElementById('message').innerText += message;
}
Feature requests on Tech Community are considered, when the dev team go through the planning process. Use the github label: Type: product feature request at https://aka.ms/M365dev-suggestions .
Related
The azure-devops-extension-sdk has events that can be listened to for work items like onLoaded, onRefreshed, onUnloaded etc. But there's no event to listen to while the web page itself is being refreshed(navigating away). I need to stop the navigation action in case there are unsaved changes in my custom UI element. Azure DevOps does this inherently only in those cases where a standard backend field is used. My custom UI element (installed using an extension I developed) doesn't use any backend fields.
window.addEventListener function doesn't seem to work and neither did the window.beforeunload function.
Seems you are using a hub extension. We could not use the window.beforeunload event of the browser which is not working in the case of an extension because it is running in an iframe.
After go through azure-devops-extension-api, didn't find any related interface. Afraid this is not available for a customized extension right now.
By default, TinyMCE's autosave plugin stores the editor's text in localStorage. Is there a way to tell it to use a different storage engine? Ultimately what I want to do is set up a listener on the storeDraft event so I can persist the contents to our server so the user can access the contents even after the autosave_retention limit has been surpassed. I know that I can set the autosave_rentention to 0 but even when I do I can see that it still writes the data to localStorage -- it just removes it (though, sometimes not immediately and it seems like a page reload short circuits that in some cases).
So basically, I'd like to hit 2 birds with one stone. I'd like to stop TinyMCE from storing the data in localStorage and, if I can specify a different "data store", then perhaps I can point it to my ajax handler which will persist to the back end.
Any advice would be greatly appreciated!
thnx,
Christoph
The autosave plugin is designed to work with local storage and has no option to change to a different storage mechanism. If you want to store the data on your server you would typically that with some custom code that uses either (a) TinyMCE events or (b) a timer to get the editor's current content and then send it to the server.
If you want to use TinyMCE events (https://www.tiny.cloud/docs/advanced/events/#editorevents) to trigger this process you would have code along these lines:
tinymce.init({
selector: "textarea",
...
setup: function (editor) {
editor.on('init change NodeChange Dirty', function (e) {
// 1. use getContent() to extract the editor's current HTML
// 2. send the HTML to your server
});
}
});
If you want to use a basic timer (e.g. setTimeout()) you would use that to trigger the same two actions as the sample code above.
In theory you could modify the autosave plugin to send data to your server as opposed to storing the data in local storage but I think you can do what you need in a far simpler way without needing to dig into the ~200 lines of code in the existing plugin.
Everything about the uploader is working perfectly, but one callback seems to do nothing:
.bind('fileuploadchange', function (e, data) {
console.log("foo");
})
Binding to the change event never returns anything... so my question:
1) Is this a bug? I'm using the most recent version.
2) Is there another/better way to detect when files are manually removed from the upload queue (something more elegant than reading DOM elements)?
There might be a bit of misunderstanding in what the fileuploadchange event does.
The admittedly limited documentation for the change event states:
Callback for change events of the fileInput collection.
That means it's an event callback for the native change event of all the file input elements of the fileupload widget.
This event only fires if the user selects one or more files via the file picker dialog that is displayed after clicking on the file input button.
Technically, the basic fileupload library doesn't keep track of a queue.
It's up to the UI implementation to handle this, via the various callbacks provided by the basic library.
Until the user actually starts the file upload, there is technically nothing the basic library could keep track of.
And as soon as a file upload is started, the done and fail events are your basic building blocks.
By the way, the sample UI implementation handles the removal of items that have not been started yet by triggering a manual fail event.
in my app i have a relative complex activity/place. Resolving the state (from history token to model) on start of activity causes some server interactions.
On user interactions the activity only updates the necessary parts of the model and therefore safes some server interactions - the activity/model has an inner state.
Is there a way to reflect the state in browser history without (re)starting the activity? (History.newItem(token) also causes start of activity)
UPDATE
Chris' solution "nearly" works but another problem rose: in my ui i have a reset-button (a link to the place with empty token). If i click around the ui the token is updated fine but now the reset button doesn't work. gwt thinks it is in the same place and so it ignores the reset click.
Before this the problem was nearly the same: the token and place didn't change and so the reset button didn't work either.
GWT logs this as "Asked to return to the same place"
So is there a way to let gwt restart the activity regardless of place equivalence?
Go to a new place, but have your ActivityMapper return the same activity instance. That way, the activity is not restarted.
You have to find a mean of updating the activity when the place changes from some other mean though (e.g. browser history). See GWT MVP updating Activity state on Place change for instance.
There is a semi-solution, and although I don't want to recommend it, I'd like to add it here - just to warn against the drawbacks of this solution:
You could add tokens to the History without firing an event by calling History.newItem(token, false).
This is a semi-solution, because:
It works correctly (as long as you build your tokens correctly).
A part of the performance problem is also solved: The activity won't be re-started when adding the token to the history.
However, if the user goes back and forward through the history, the performance problem would still be there (because then, the events will be fired again).
I am injecting a partial into a page using $().html(content). Part of the partial is JavaScript code in an inline script block I need to inspect. When I look in the Sources tab in the Chrome Developer Tools it doesn't show the injected content. All it shows is the original source.
Is there a way to gain access to the JavaScript?
Update
I am using Google Chrome 21.0.1180.77 but I also have Google Chrome Canary installed.
I don't have a Sources tab (Elements, Resources, Network, Scripts, Timeline, Profiles, Audits, Console).
The Elements tab always reflects the current state of the DOM, so it will show any injected scripts. EDIT: This appears to be wrong.
There's a Chrome issue about this: http://code.google.com/p/chromium/issues/detail?id=95352
You can add a specially formed comment to the injected JavaScript code, and it will then show up in the Scripts tab (but it still doesn't show up in the Elements tab, for whatever reason):
//# sourceUrl=whatever.js
How to see injected snippets:
In order for injected code to be visible, you will need to add a sourceURL comment to the top of the evaluated script, like one of the following:
//# sourceURL=//domain/file.js
//# sourceURL=http://domain/file.js
//# sourceURL=https://domain/file.js
//# sourceURL=//domain/file
Note, that without the // hinting at the protocol and some domain immediately following, then the injected snippet will not show up under sources by default.
How to see injected snippets without a protocol and domain:
Continuing, with just a file name, like so:
//# sourceURL=file.js
You will have to change the source settings by unchecking Group by folder. See image.