We are replacing the forms for our lists with forms built with SPFx. Building and deploying the form is no issue. The problem is redirecting the form controls to this form (when a user opens an item or clicks new, etc...). Is there a recommended method of accomplishing this? I have been successful using two methods but they both seem volatile and hacky.
The first being replacing the entire form code using SharePoint designer. For instance, the new form code would be
<%# Page language="C#" %>
<html lang="en">
<head>
<script type="text/javascript">
const list = window.location.href;
const site = list.substring(0,list.toLowerCase().indexOf('/lists/'));
window.location.replace(site + "/SitePages/MyListForm.aspx");
</script>
</head>
<body>
</body>
</html>
This works sometimes... Upon saving, the form code seems to regenerate the form code but the redirect still works. However, if I open and save the code again, everything breaks and the list action goes back to default (clicking new would now show the 'New Item' call out instead of directing to the form).
The other method is opening the new/edit/display form in the browser, with ?toolpaneview=2 which allows me to add a script web part to the page (although it doesnt like to save) and add the script redirect in.
<script type="text/javascript">
const list = window.location.href;
const site = list.substring(0,list.toLowerCase().indexOf('/lists/'));
window.location.replace(site + "/SitePages/MyListForm.aspx");
</script>
this seems to be less volatile than the first method, but it still seems hacky. If I delete the original form web part, the form breaks and the list actions again revert to default. Editing the script requires visiting the form with ?contents=1 to delete the script web part and then I have to re-add it again using the toolpaneview method. In order to even save the web part change I have to click "Edit Web Part", which in turn saves it. There is no simple "Save" action which again makes me feel like this method is not intended to be done.
Is there any recommended way to accomplish these redirects? I've found plenty or tutorials online about setting up the list form, but nothing about this essential step.
i'm working on a nodejs server which renders posted html to pdf,png or jpg.
( https://github.com/svenhornberg/pagetox (server.js) if you want to try it)
It is working really good, renders complex sites but only to that point that i want do load a simple image. For example i am sending following code to my server:
<!doctype html>
<html>
<head>
<title>logo</title>
</head>
<body>
<img alt="logo" src="http://upload.wikimedia.org/wikipedia/commons/d/de/Wikipedia_Logo_1.0.png">
</body>
</html>
The Code should be okay. But the rendered response image does not contain the logo image.
As said in the phantomjs documentation (http://phantomjs.org/api/webpage/property/settings.html) localToRemoteUrlAccessEnabled is set to false, so set it to true like said in the documentation of phantom-node (https://github.com/sgentle/phantomjs-node/):
page.set('settings.localToRemoteUrlAccessEnabled', true);
page.set('settings.loadImages', true);
to prove it is set to true, i called a getter which returns true
page.get('settings.localToRemoteUrlAccessEnabled', function(data) { console.log(data);});
i'm using node v0.10.26 with phantomjs-node (0.6.1), phantomjs(1.9.7) on linux
Now the question, does anybody see a mistake ? Or can give me a hint what i am doing wrong. Or any other possibilities why phantomjs/phtanom-node isnt loading any external images
I am using the render method to generate the png, jpg or pdf file. I am calling the method inside the evaluate function as a callback, so the site should be loaded completely.
(the full code is at https://github.com/svenhornberg/pagetox/blob/master/server.js)
Edit1: I'm not behind a proxy, which maybe blocks the requests.
looks like i need to set a timeout and wait that all external resources are loaded.
page.set('content') dosen't work with dynamic content in phantomjs
i got it working, but a timeout is not what i want. If i find any better way i will post it.
What you want to set is
page.set('settings.webSecurityEnabled', false);
Which enables cross domain requests. The other option localToRemoteUrlAccessEnabled does not affect your case because you don't use file: resources but you rather overwrite about:blank.
Other issues might be SSL/TLS related. See my answer here for more help.
I need to include a javascript file right at the end of the xpage so it gets loaded after the XSP.addOnLoad event code which is generated automatically e.g.
XSP.addOnLoad(function() {
XSP.attachEvent....
}
<script src="my.js">
Ideally I want to include it as part of a theme but if I do that it goes into the HEAD section
So can I either..
-Specify in a theme to insert the link to a client side js resource at the bottom of the page rather than the head
-Include a resource on an xpage directly so it goes after the auto-generated code
NB: This it needed in order to get an xpages app working with Foundations
http://foundation.zurb.com/docs/
I need to include the foundations js file after the events have been bound to the fields
Thanks!
Try adding a script block in the end with this code:
XSP.addOnLoad(function() {
document.write('<script src="my.js">');
}
However this may execute before the generated XSP.addOnLoad. You could then try a small hack like this:
XSP.addOnLoad(function() {
setTimeout(document.write('<script src="my.js">'), 200);
}
I was looking for a way to detect the browser extension I am building from my website and I need to alert my users in-case they are viewing my site without it. I have been able to do this in firefox, but I want to know is there a way I can do this in Google Chrome? Even if there is a hack to get this going I am fine.
Sure. Create a content script specific to you site in the extension, and make it add an invisible marker in the DOM, eg:
$('body').append('<div style="display: none;" class="extension_enabled" />');
In the page, set a short timeout to check for this after the document is fully loaded, eg:
$(function() {
setTimeout(function() {
if ($('.extension_enabled').length > 0) {
alert('Installed!');
} else {
alert('Not installed.');
}
}, 500);
});
NOTE: Code in jQuery format for simplicity. You can do it with raw javascript, of course.
The official Google Chrome Extensions Developers' Guide has an item covering exactly this.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
I am writing an application that if the user hits back, it may resend the same information and mess up the flow and integrity of data. How do I disable it for users who are with and without javascript on?
It's not possible, sadly. However, consider your applications navigation model. Are you using Post/Redirect/Get PRG Model? http://en.wikipedia.org/wiki/Post/Redirect/Get?
This model is more back button friendly than the Postback model.
You shouldn't.
You could attach some script to the onbeforeunload event of a page and confirm with the user that's what they want to do; and you can go a bit further and try to disable it but of course that will only work for users who have javascript turned on. Instead look at rewriting the app so you don't commit transactions on each page submit, but only at the end of the process.
I strongly urge you to go to heroic lengths to prevent breaking the back button, it is a sure fire way to alienate your users and even made it to No.1 on Jacob Neilsen's Top 10 Web Design Mistakes in 1999.
Perhaps you could consider rather asking the question: "How to avoid breaking the back button for <insert your scenario here>?"
If Scott's answer hits close to the mark, consider changing your flow to the PRG model. If it's something else, then give a bit more detail and see how we can help.
I came up with a little hack that disables the back button using JavaScript. I checked it on chrome 10, firefox 3.6 and IE9:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<title>Untitled Page</title>
<script type = "text/javascript" >
function changeHashOnLoad() {
window.location.href += "#";
setTimeout("changeHashAgain()", "50");
}
function changeHashAgain() {
window.location.href += "1";
}
var storedHash = window.location.hash;
window.setInterval(function () {
if (window.location.hash != storedHash) {
window.location.hash = storedHash;
}
}, 50);
</script>
</head>
<body onload="changeHashOnLoad(); ">
Try to hit back!
</body>
</html>
Best option is not to depend on postbacks to control flow, however if you are stuck with it (for now)
you may use something like this:
Response.Cache.SetCacheability(HttpCacheability.NoCache);
Response.Cache.SetExpires(Now.AddSeconds(-1));
Response.Cache.SetNoStore();
Response.AppendHeader("Pragma", "no-cache");
Soon you will find that it will not work on all browsers, but then you may introduce a check in your code like:
if (Page.IsPostBack)
{
if (pageIsExpired()){
Response.Redirect("/Some_error_page.htm");
}
else {
var now = Now;
Session("TimeStamp") = now.ToString();
ViewState("TimeStamp") = now.ToString();
}
private boolean pageIsExpired()
{
if (Session("TimeStamp") == null || ViewState("TimeStamp") == null)
return false;
if (Session("TimeStamp") == ViewState("TimeStamp"))
return true;
return false;
}
That will solve problem to some extend, Code not checked -- only for examples purposes..
It is possible to disable back button in all major browser. It just uses hash values to disable the back button completely.
Just put these 5 lines of code in your page
<script>
window.location.hash="no-back-button";
window.location.hash="Again-no-back-button";//for google chrome
window.onhashchange=function(){window.location.hash="no-back-button";}
</script>
Detailed description
Here's a previous post on it:
Prevent Use of the Back Button (in IE)
Whatever you come up with to disable the back button might not stop the back button in future browsers.
If its late in the development cycle I suggest you try some suggestions above but when you get time you should structure your flow so that the back button does not interfere with the logic of your site, it simply takes the user back to the previous page like they expect it to do.
It is true, proper validation should be added to make sure duplicate data doesn't mess things up. However, as in my case, I don't full control of the data since I'm using some third party API after my form. So I used this
history.go(+1);
This will send user forward to the "receipt" which is supposed to come after "payment" page if they try to go back to "payment" page (just giving a payment for example). Use sparingly, though
You could post the data on each form to a _NEW window. This will disable the back button on each window, but without javascript it might be difficult to force the old one closed.
I was able to accomplish this by using:
Response.Cache.SetExpires(DateTime.MinValue);
Response.Cache.SetNoStore();
When I used Response.Cache.SetCacheability(HttpCacheability.NoCache); it prevented me from downloading office files.
Find below link
Disable browser back button functionality using JavaScript in asp.net | ASP.Net disable browser back button (using javascript)
http://www.aspdotnet-suresh.com/2011/11/disable-browser-back-button.html