I have created a form that is working perfectly on web browsers but it is not working on mobile devices. I am using localStorage to save some info from step one to step two in my forms. The way i am doing this is by using onblur function to each input element. For example on an email input I add onblur="storeData()" . The form is working perfectly on web browsers but on mobile devices it is not. I am not sure what might be the issue but I think that the onblur is not working on mobile devices. How can i replace the onblur ONLY for mobile devices? Please if you know provide the JS code to test it.
Thanks.
JS Code:
<script>
function storeData() {
var userEmail = document.querySelector("#UserName");
var userPhoneNumber = document.querySelector("#PhoneNumber");
var userName = document.querySelector("#FirstName");
var userLastName = document.querySelector("#LastName");
localStorage.setItem("mail", userEmail.value);
localStorage.setItem("phone", userPhoneNumber.value);
localStorage.setItem("name", userName.value);
localStorage.setItem("lastName", userLastName.value);
}
function getData() {
var userEmail = document.querySelector("#UserName");
var userPhoneNumber = document.querySelector("#PhoneNumber");
var userName = document.querySelector("#FirstName");
var userLastName = document.querySelector("#LastName");
userEmail.value = localStorage.getItem("mail");
userPhoneNumber.value = localStorage.getItem("phone");
userName.value = localStorage.getItem("name");
userLastName.value = localStorage.getItem("lastName");
}
</script>
Related
I am trying to add a mailto button to send an email using email client
Here is my code:
clickEmail(e) {
let storyId = this.refs.storyToEmail.getAttribute('id');
if (storyId != undefined) {
let urlToSend = this.createURL(storyId) + "?ref=emailShare";
let subjectLine = "Shared story - " + this.props.headline;
let hrefValue = "mailto:?subject=".concat(subjectLine, "&body=", "I thought you might find this interesting:%0D%0A %0D%0A", urlToSend, "%0D%0A %0D%0AConnecting Communitie %0D%0A %0D%0A");
let email = this.refs.storyToEmail;
email.href = hrefValue;
return email.href;
}
}
However this works for me and almost all desktops and not working on many mobile devices.
After searching I noticed it needs permission from the browser as follows:
https://blog.hubspot.com/marketing/set-gmail-as-browser-default-email-client-ht
But the issue is I cannot find anyway to do the setting as suggested in the link for mobile(chrome)?
Can anyone shed light on this?
i'm using JavaScript to make some small customization in default SharePoint 2013 issue tracker. When user submit an issue (default SharePoint function presave) JavaScript should redirect document to new URL. Everything works fine in Firefox in IE but from unknown reason redirection doesn't work in Chrome.
I'm used location, replace.href, assign etc - result the same - chrome just save the form without redirection. Can you give me any hint why it doesn't work?
I'm using SP 2013 online (and i don't have access to SP designer)
<script src="/sites/SiteAssets/Scripts/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="/sites/SiteAssets/Scripts/sessvars.js"></script>
<script language="javascript" type="text/javascript" src="/sites/_layouts/15/clientpeoplepicker.js"></script>
<script type="text/javascript">
// Here i have small function to get email from sharepoint peoplePicker field
function getEmailFromPeoplePicker(title) {
var ppDiv = $("div[title='" + title + "']")[0];
var peoplePicker = SPClientPeoplePicker.SPClientPeoplePickerDict[ppDiv.id];
var userList = peoplePicker.GetAllUserInfo();
var userInfo = userList[0];
var userEmail;
if(userInfo != null)
{
userEmail = userInfo.EntityData.Email;
}
return userEmail;
}
function PreSaveAction(){
// check if there is attachment
if ($('#onetidIOFile').get(0).files.length === 0) {
} else {
OkAttach() //attach file to form
}
//get email from field
var RequestApprover = getEmailFromPeoplePicker('Assigned To');
//create link for redirection with email at the end (ill use it latter for sending emails)
var targetUrl = '/sites/SitePages/RedirectDestination.aspx' + '#' + RequestAprover;
//window.location.href = targetUrl;
//location.replace(targetUrl);
//window.location.assign(targetUrl);
// window.top.location.href = targetUrl;
window.location.assign(targetUrl); // <---------- redirection which works in IE and FireFox but not in Chrome
//window.location.href = targetUrl;
//window.location.assign(targetUrl);
//window.parent.location.href(targetUrl);
//setTimeout(function(){location.href = targetUrl},500);
return true;
}
</script>
I believe you should have "return false;" (instead of return true;) at the end of your PreSaveAction function implementation. Looks like in Chrome redirect takes more time then in other browsers, so Sharepoint continues usual form flow (e.g. continues to PreSaveItem etc.)
I'm trying to save a cookie and then load it again
I have this code
<html>
<head>
<script>
var myCookies = {};
function saveCookies()
{
myCookies["_uuser"] = document.getElementById("user").value;
myCookies["_uuage"] = document.getElementById("age").value;
//Start Reuseable Section
document.cookie = "";
var expiresAttrib = new Date(Date.now()+60*1000).toString();
var cookieString = "";
for (var key in myCookies)
{
cookieString = key+"="+myCookies[key]+";"+expiresAttrib+";";
document.cookie = cookieString;
}
//End Reuseable Section
document.getElementById("out").innerHTML = document.cookie;
}
function loadCookies()
{
//Start Reuseable Section
myCookies = {};
var kv = document.cookie.split(";");
for (var id in kv)
{
var cookie = kv[id].split("=");
myCookies[cookie[0].trim()] = cookie[1];
}
//End Reuseable Section
document.getElementById("user").value = myCookies["_uuser"];
document.getElementById("age").value = myCookies["_uuage"];
}
</script>
</head>
<body>
User: <input type="text" id="user">
Age: <input type="text" id="age">
<button onclick="saveCookies()">Save To Cookies</button>
<button onclick="loadCookies()">Load From Cookies</button>
<p id="out"></p>
</body>
</html>
when I type an input for both name and age, and click on save to cookies,
and then clock on load from cookies, I got this "undefined" for both user and age!!
what's missing in my code, so I can save the cookie
For Chrome cookies can only be set, when the page is running on a webserver.
For example accessed via http://localhost/foo/bar.html or http://127.0.0.1/foo/bar.html
edit: you might check out as well this answer:
where cookie saved for local HTML file
I just tested it myself: it works with Firefox.
Otherwise it would be better for testing such cases, to put up a local webserver like apache
I have tested your code from a web server and it works fine.
You must load it from a web server, rather from the local file system.
JSFiddle is here if you want to prove it for yourself.
https://jsfiddle.net/brx5ropp/
Note that due to JSFiddle limitations I had to move the click triggers for the buttons to code like this:
document.getElementById("load").addEventListener("click", loadCookies);
document.getElementById("save").addEventListener("click", saveCookies);
...but that is irrelevant to my answer!
I need to select some words in 2 TextArea programmatically. I am using the following javascript to select the words. The problme is that the selection persists only on the 2nd TextArea. I am using IE 6(I know it is old, but project related purpose).
function abc(start1, end1){
var textarea1ctlID = '<%=textarea1. ClientID %>';
var textarea2ctlID = '<%=textarea2. ClientID %>';
var txtarea1 = document.getElementById(textarea1ctlID);
var txtarea2 = document.getElementById(textarea2ctlID);
var start = parseInt(start1);
var end = parseInt(end1);
var txtarearange1 = txtarea1.createTextRange();
txtarearange1.moveStart("Character", start1);
txtarearange1.collapse();
txtarearange1.moveEnd("Character", end1);
txtarearange1.select();
var txtarearange2 = txtarea2.createTextRange();
txtarearange2.moveStart("Character", start1);
txtarearange2.collapse();
txtarearange2.moveEnd("Character", end1);
txtarearange2.select();
}
How to make the select persist in both the TextAreas
You can't. IE only allows one selected range.
I am tryin to use an email client in my application. I am using plugins for the same.
The code that am using is
function tellAFriend()
{
var succcallback = function(result) {
//alert("Mail sent");
};
var errorcallback = function(e) {
//alert("error:" + e);
};
var body1='Hi,\n I came across this new app and thought you might be interested';
var body2=body1+'.You can check it out at \n';
var href1='market';
var anchortext;
anchor1 = document.createElement("a");
anchortext = document.createTextNode('Test');
anchor1.appendChild(anchortext);
anchor1.href=href1;
anchor1.setAttribute('href','https://market.android.com/details?id=com.unisys.cps&feature=search_result#?t=W251bGwsMSwxLDEsImNvbS51bmlzeXMuY3BzIl0');
//alert(anchor1);
window.plugins.webintent.tellAFriend({
mailSubject : 'CPS Mobile App',
mailRecepients: '',
mailBody: href1
//mailBody: 'Hi,\n I came across this new app and thought you might be interested.You can check it out at \nhttps://market.android.com/details?id=com.unisys.cps&feature=search_result#?t=W251bGwsMSwxLDEsImNvbS51bmlzeXMuY3BzIl0 \nor \nhttps://www.cargoportalservices.com/lmsweb/DownloadCPSMobileApp.jsp'
}, succcallback, errorcallback);
}
Thats the function. In the function, the mail body that i have provided needs to be a text. but I need to pass a hyoerlink to it. Meaning, when the email client opens up, the text should be displayed as hyperlinks.
Any suggestions on how that can be achieved.