I'm writing an extension to modify search results on my school's website adding more information to each returned result. However, when the search page executes a search and the search results are dynamically added to the page, elements added to the page by my extension are removed.
As a simple debug, I added a button next to the search button to click after the search happens, but the act of searching removes my button.
I didn't write the page I'm adding to, the school has written that in ASP.Net.
How can my extension affect search results after a dynamic post back?
First you would need to find some element on the page that is tied to search results and which presence indicates that search results are ready for processing (lets say it is <div id="search-results">). Then you can listen to DOMSubtreeModified to catch when this element is getting created:
var processed = false;
document.addEventListener("DOMSubtreeModified", function(event){
if(!processed && document.getElementById("search-results")) {
processed = true;
//process
}
});
Related
I've been quite pleased with how remote pagination on Tabulator works with automatic ajax loading, but I can't seem to find a way to set the page that is displayed when the table is first loaded. table.setPage(pageNum) only works for me after the first page has been fetched and rendered; if I do something like
new Tabulator("#my-tabular-table", { lots of stuff }).setPage(5)
then I get a Pagination Error - Requested page is out of range of 1 - 1: because the page count hasn't been received from the server yet.
Is there some way of doing this? Am I missing something? I realize that I could hook into some callback and switch to the desired page immediately after the first page has been loaded, but I'd rather not wait for an extra server call.
You can use the paginationInitialPage option in the table definition to set the page number for the initial load:
var table = new Tabulator("#example-table", {
pagination:"remote", //enable remote pagination.
paginationInitialPage:2, // this option can take any positive integer value
});
I'm writing a Primefaces 5.1 portlet.
It consists in a unique page containing a panelMenu, and I need that it starts with any panel collapsed everytime a user change page (on page loading).
But, if I open a panel, then change page, it will start showing that panel still opened.
I wasn't able to find any option to achieve this goal (e.g. collapsed=true, ignoreCookie=true or something similar).
The only solution I found was the following Javascript code:
PrimeFaces.widgets.myPanelMenu.collapseRootSubmenu(PrimeFaces.widgets.myPanelMenu.headers);
The problem is that this code will collapse any opened panel (so on page loading user is able to see panel menu collapsing animation) but it seems it doesn't store this state in its cookie/localstorage... the result is that on any page loading user can see this animation.
I'm sure it doesn't save its state, because the only way to "solve" the problem is to manually re-open and re-collapse the panels... then, on following page change, these menus start closed (and there is no animation).
I also tried to use PrimeFaces.widgets.sideMenuPanel.saveState() after collapsing, but with no success.
Do you have any idea about?
Thank you...
I found a solution to the problem.
If you read my discussion with Kukeltje (comments on my question), you will find that latest Primefaces' versions will solve the problem.
Otherwise, if you want to avoid upgrade or modify sources, and you need a quick fix based on Javascript only please read the following part of the answer.
It directly works on the component's state using JavaScript.
First of all you need to have a variable reference to your component:
<p:panelMenu model="#{menuBackingBean.menuModel}" widgetVar="sidePanelMenu" />
Then you should add the following JS code on document ready:
var panelMenu = PrimeFaces.widgets.sidePanelMenu;
// 1. On page loading collapses possible opened panels
panelMenu.collapseRootSubmenu(panelMenu.headers);
// following line is commented because it never should be necessary is not necessary (unless unexpected situation I never verified)
//clearSidePanelMenuPreferences();
// 2. Call the "clear preferences" actions on click on two tpe of links: first level are the panel link (used to open/close the menu) and second level are the destination links
// We need to fork also on the first level links to be sure it works after user clicks there then exit from the page in another way
panelMenu.headers.children("a").click(function(){setTimeout(clearSidePanelMenuPreferences, 500)}); // setTimeout is necessary because this event should be fired after preferences are written
panelMenu.headers.siblings().find("a").click(function(){clearSidePanelMenuPreferences();});
The function called to clear preferences are the following:
function clearSidePanelMenuPreferences() {
var panelMenu = PrimeFaces.widgets.sidePanelMenu;
panelMenu.expandedNodes = []; // clear the opened panels lists
panelMenu.saveState(); // store this information
}
Hope it helps
Please check this block of code
PF('myPanelMenu').headers.each(
function(){
var header = jQuery(this);
PF('myPanelMenu').collapseRootSubmenu(header);
header.removeClass('ui-state-hover');
}
);
I prefer to do this in order to execute this method only once and keep the menu option selected.
$(document).ready(function() {
if(location.pathname == "/cotizador/" || location.pathname == "/cotizador/faces/login.xhtml"){
var panelMenu = PrimeFaces.widgets.sidePanelMenu;
// 1. On page loading collapses possible opened panels
panelMenu.collapseRootSubmenu(panelMenu.headers);
panelMenu.expandedNodes = []; // clear the opened panels lists
panelMenu.saveState();
}
});
I created a Chrome extension that adds links to items (things your friends share with you) on your facebook feed. Facebook loads about 10 or 20 items on the feed on page load, and then the rest are loaded via ajax when you scroll down.
I managed to get my content script to work for the first items, but not for the rest. I've read everything i could find, and it seems that I have to reload my content script.
How can i do that considering that the URL does not change?
You can use document.addEventListener with the DOMNodeInserted event to listen for new items getting rendered in the feed. The callback will have to check each node insertion to see if it is a feed item or not. Something like the following should work.
function nodeInsertedCallback(event) { console.log(event); });
document.addEventListener('DOMNodeInserted', nodeInsertedCallback);
Well, you can hang some time driven listener that runs every XX seconds, to verify if there's new items to work with.
Unfortunately there's no event you can hang from, fired when the page's code do some Ajax.
May be you can figure out what evet you can han from to detect the user has reached the end of the loaded item's list, knowing that de page's code will do some Ajax to retrieve more items. Then you start you time driven listenter.
I've noticed with Sharepoint 2010, many of the links do not the support open in new tab/window feature. For example, items on the quick menu do not. Is it possible to enable?
Use the JavaScript function to open a new window in SharePoint 2010.
Create the function to open your target window as sample provide below.
function load_url(externallink)
{
window.open(externallink,target='_blank')
}
Place the function load_url in JavaScript file
Click site actions, select manage content and structure.
Suppose you want to change the links in the page
http://someserver/sites/Dev/Help/HelpLinks/AllItems.aspx
Then select the List named HelpLinks in the sub site Help. Dev will be the top most node(site). Help will be a sub site and inside Help you can find List by name HelpLinks.
All the links in the page and their title will be displayed
Select the title of link which you want to open in new tab and right click.
Select Edit properties. Then in the URL field and call the function as javascript:load_url('http://www.google.co.in'); instead of http:// www.google.co.in
Or Else
Suppose you want to change the links in the below URL.
URL: http:// someserver/sites/Dev/Help/HelpLinks/AllItems.aspx
Go To
open to the link http:// someserver/sites/Dev/Help/HelpLinks/AllItems.aspx
You will find the columns of the List (Title Column, URL column, Summary etc).
Select the Title and click Edit property which you want to edit
Then in the URL field and call the function as javascript:load_url('http://www.google.co.in'); instead of http:// www.google.co.in
This answer is a recap of this article and is not an answer I came up with: http://sharepointsolutions.blogspot.com/2007/09/make-selected-links-in-links-list-open.html
Step 1: Add #openinnewwindow to the end of all hyperlinks you want to open in new window.
Step 2: Then you will need to add the follow script to your SharePoint pages.
[script language = "JavaScript"]
//add an entry to the _spBodyOnLoadFunctionNames array
//so that our function will run on the pageLoad event
_spBodyOnLoadFunctionNames.push("rewriteLinks");
function rewriteLinks() {
//create an array to store all the anchor elements in the page
var anchors = document.getElementsByTagName("a");
//loop through the array
for (var x = 0; x < anchors.length; x++) {
//does this anchor element contain #openinnewwindow?
if (anchors[x].outerHTML.indexOf('#openinnewwindow') > 0) {
//store the HTML for this anchor element
oldText = anchors[x].outerHTML;
//rewrite the URL to remove our test text and add a target instead
newText = oldText.replace(/#openinnewwindow/, '" target="_blank');
//write the HTML back to the browser
anchors[x].outerHTML = newText;
}
}
}
[/script]
Whats the 'Quick menu'? Do mean list item context menu or something else? Can you post a screenshot?
There are two types of links used.
Normal HTML anchors - You can hold down the CTRL key when clicking.
JavaScript links (menus and such) the CTRL key doesn't work. If you're working with the Edit/View forms then this may be of interest
SharePoint - Editing The SharePoint List Item Menu
Especially look for Part II where it talks about changing this behaviour in List Settings > Advanced Settings > Dialogs
This is actually an Internet Explorer specific bug. The navigation links in SharePoint 2010 are regular links but have two nested span tags around the text of the link. This confuses IE which doesn't realise that the text you are right-clicking up is a link and so doesn't give the correct context menu. If you right-click just to the left of the text of the link (the cursor should still show as the "hand") the context menu appears as expected.
For Sharepoint 2013, I used Keith's code with a delayed call.
<script type="text/javascript">
// Add an entry to the _spBodyOnLoadFunctionNames array
// so that our function will run on the pageLoad event
_spBodyOnLoadFunctionNames.push("rewriteLinks");
function rewriteLinks() {
$('a').attr("target","_blank");
}
</script>
In the SharePoint Wiki Editor, you can click the "From Address" Link you added, and a LINK menu will appear in the ribbon bar. Inside that, you can click "Open in New Tab" It's not exactly New Window, but it's close and easy.
Add this to the end of the link.
#openinnewwindow
example: http://www.bing.com**#openinnewwindow
I have a search form I generated using the filterGrid option in JqGrid. I want to add a JavaScript logic which is invoked before I submit the Search form. I have added a method which is invoked by the beforeSubmit property for the filterGrid. It goes into the method before submitting, but always submits the form regardless of the value returned. I would like the form to not submit if the javascript returns false.
Have any of you guys implemented anything like this before. Or is there any othe rbetter way to implement this. Any help on this will be really appreciated.
Code:
$("#search").filterGrid("#resultsGrid",
{gridModel:true,gridNames:true,enableSearch:true,
formtype:"vertical",buttonclass:"submitButton",
enableClear:true,beforeSearch:validateDate});
function validateDate(dateDiff) {
if(daysDiff < 0){
return [false,"Message"];
}
} // ??? (commented by Oleg)
return [true,""];
}
There are at least three different ways how searching can be used: Toolbar Searching, Custom Searching which you use and Single field searching or Advanced Searching which share the same code. So one have currently three different implementations of close things.
Only Toolbar Searching has beforeSearch event handler which can return false to stop searching. In case of Custom Searching the value returned by the event handler beforeSearch will not used. Single field searching or Advanced Searching don't call any event handler before searching. In all cases for the searching will set searching filter and the jqGrid parameter search to true and then force grid reloading with the code like
$("#gridId").trigger("reloadGrid",[{page:1}]);
To be able to make any validations and stop reloading of the grid I see no simple way. So I suggest only following.
You can overwrite the standard reloadGrid event handler and chain it. The corresponding code con look like following:
var grid = $("#gridId");
var events = grid.data("events"); // read all events bound to
var originalReloadGrid; // here we will save the original event handle
var skipRefresh = false; // this can be changed by owe validation function
// Verify that one reloadGrid event hanler is set. It is typical sitation
if (events && events.reloadGrid && events.reloadGrid.length === 1) {
originalReloadGrid = events.reloadGrid[0].handler; // save old
grid.unbind('reloadGrid');
var newEvents = grid.data("events");
grid.bind('reloadGrid', function(e,opts) {
if (!skipRefresh && grid[0].p.search) {
originalReloadGrid(e,opts);
}
});
}
Probably I will create later a demo which demonstrate this on an example and place the link to the demo here. Moreover I will try to suggest code changes to jqGrid so, that in all different implementations of searching will be possible to stop serching by returning false by beforeSearch event handle.
UPDATED: OK! I prepared a demo for you. In the demo I use no server components, so it will not really do searching, but you can see the results if the grid will be refreshed and goes to the page 1.
To test the demo you can do following:
type in the "Client" input field a text not starting with 'test' and click "search" button. You receive an alert which simulate the validation dialog.
type in the "Client" input field a text starting with 'test' like test1 and click "search" button. Now the grig will refreshed because the validation will be OK.