We Keep Coding

How to use information from the URL to click on specific button?

I'm working on a group project for a class, and we have a webpage that is split into different tabs, so it is only one webpage, but appears to be different pages using Jquery so the page doesn't have to reload when switching between tabs. The problem I am having is that one of the tabs has a form to get information from the user, then after the user clicks the submit button, the info is sent to the database using php, causing the page to reload. Then depending on if the information was successfully sent to the database, there will be either "success" or "invalid" appended to the end of the URL. If the user submits this form, we want them to automatically come back to this tab on the reload, and I have tried doing this by using a script like this:
<script>
document.getElementById("baseTab").click();
window.onload = function() {
var theurl = document.location.href;
if (theurl.includes("success") || theurl.includes("invalid") {
document.getElementById("infoTab").click();
}
};
</script>
The baseTab is the tab we want to load whenever someone first loads the webpage, unless they have just submitted the form on the infoTab page. This code structure works on a simple test webpage I run on my computer, but when I try to push it to our project repository, it will only do the "baseTab".click, and not click the "infoTab" button even if theurl includes "success" or "invalid". I tried doing it without the window.onload(), but that doesn't work either. Also, if I do
if (theurl.includes("success") || theurl.includes("invalid") {
document.getElementById("infoTab").click();
}
else {
document.getElementById("baseTab").click();
}
then neither of the buttons get clicked. If their is an easier way to do this or you see where I am going wrong, any help would be appreciated. Thanks!

Changing an object properties then calling a function inside a custom function with javascript

Title is probably a little messy. Basically what I'm trying to do is to create a custom function that will modify an object properties, then return that object, and then call a function.
A little background on what I'm doing : Trying my best with the Zendesk API to use a web widget on my webpage. Basically this web widget is configured to be a HelpCenter on startup, which then shows a button for either live chat or email, depending on the state. The main property in question here is called 'suppress' which disables one of the widget pages (chat, email & helpCenter). And my goal is to make that custom function 'suppress' 2 of the 3 widget pages so it only shows one. Then a API func called zE.activate() would open up the widget.
I know this is a lot of text, let me show you the code I've got so far :
<script>
function setChatPopOutProps(window) {
window.zESettings = {
webWidget: {
contactForm: {
suppress: true
},
helpCenter: {
suppress: true
}
}
};
return window.zESettings;
};
function chatPopOut() {
setChatPopOutProps(window);
zE.activate();
};
</script>
Now when I click on the button that has chatPopOut() assigned, the zE.activate() works since it opens up the widget, but basically the setChatPopOutProps(window) didn't seem to work.
I also tried the following :
Not returning window or window.zESettings
Putting everything under a single function by putting zE.activate() at the end of zESettings or just after the return window or window.zESettings
If you need to see the widget in action to have an idea, you can see it right here. Click on the green button on the bottom right, type anything, and you'll see the contact form button pop up. This button changes for a chat button when a live chat agent is available.
Now I know this is something that I should normally work out with Zendesk directly, which I tried, but they told me that there's nothing that can do what I'm trying to accomplish, but I really feel like this has something to do with the way I'm doing things in javascript and not the way the API is built..
Does anyone have an idea ? I would really appreciate it.
P.S. This is my 2nd post, so I apologize in advance for mistakes I probably made in this question.

Sadly, it turns out that what you are trying to accomplish just isn't possible. As the zE.settings get applied when the widget is first initialized, so there is no way to dynamically alter the widget settings without doing an action such as refreshing the page and re-initializing the widget. As far I can see from your code, I dont think you want to refresh the page everytime, and reinitialize the widget just to apply those settings that you listed above.

Clicking a menu link to bring up sign up box via js file

I have set up a pop up sign up box to show on first site arrival that is loaded using a .js file called inside the <head> tag and this all works fine.
How can i get it to re-show if a menu link is clicked?
Obviously when i link it like this below it will open the file itself containing the codes.
Mailing List
So how do i get it to carry out the function that's in popup.js when the above link is clicked?
Edit: I was able to get the pop up to show by using the below thank you all who contributed.
Mailing List
Now to complete what i'm trying to achieve is to ignore/disable the cookie being set that stops the popup from showing the next time the link is clicked.
function AlreadyBeenNewsletter()
and
function SetNewsletterCookie()
Link to the actual js file

If the JS is already included, you could use the onclick attribute. It will run JS code when a link is clicked.
Mailing List
For the second part of your question, I would create two functions. One that shows the popup without checking if the cookie is set, and another (you already have it) that checks the cookie.
Function that shows popup without checking:
function showPopup(){
var id;
id = "popupSignup";
if (jq(".popupWindow").length) {
jq(".popupWindow").prop("id", id);
} else {
jq("#aspnetForm").after('<div id="popupSignup" class="popupWindow"><a class="popupClose" href="javascript:;"></a><div class="popupDetails"></div></div><div class="backgroundPopup"></div>');
}
jq("#" + id + " .popupDetails").html('<iframe class="popupiframe" src="/user/files/newsletter.html"></iframe>');
InitialisePopup(id, 99, false, true);
ShowPopup();
CenterPopup();
}
Function that you already have popup()
jq(function popup() {
if (!AlreadyBeenNewsletter()) {
SetNewsletterCookie();
showPopup();
}
});
Then you can do the following for your link:
Mailing List
By separating the two functions apart like this you are free to show the popup without preventing it from showing again.

Why does Facebook change the "FB.ui - picture" when the share is resharing on facebook itself?

I use following sourcecode to share a Feed on Facebook.
Explanation:
I have many pictures and each picture has a own ShareButton with an onclick which starts the shareonfb().
And the first share works very well, it shares the picture, but if somebody clicks onto the share, it's opens the gallery which consist the picture(because, if i use for 'link' the direct picture-url, it would only open the picture and the person would not see the homepage).
Problem:
If i try to reshare(to click on the share button in facebook at this share), facebook doesn't use the content of this variables. It uses the og:XXXX meta-tags which are at my website(where it goes by the 'link' url). Because of that, there is a other Picture and Text ...(the share-content has changed).
So, I don't understand why it does that ... I can only specify the datas/variables for 1 post/share ... that makes no sense. Then I could work directly with the og:xxx meta-tags. BUT I don't want that, because the pictures itself has no own html-page where i could place my own meta-tags(i show them "directly"(with fancybox). (I wanted to change the meta-tags by javascript, but I read here on stackoverflow that the facebook crawler doesn't run JS.)
So, for what is the function to specific this datas?, and how get I Facebook to don't change it?
MfG Torben K
function shareonfb() {
var FB_ui_var = {
fb_method : 'feed',
fb_name : 'Name of picture',
fb_link : 'http://mysite.de/the_gallery_which_consist_the_picture027.html',
fb_caption : 'Description caption',
fb_picture : 'http://mysite.de/picture027.jpg',
fb_description : 'Descriton Text',
}
FB.ui({
method: FB_ui_var.fb_method,
name: FB_ui_var.fb_name,
link: FB_ui_var.fb_link,
caption: FB_ui_var.fb_caption,
picture: FB_ui_var.fb_picture,
description: FB_ui_var.fb_description,
}, function(response){});
}

That´s how it is, the share dialog does not allow dynamic content (anymore), you ALWAYS need a page with Open Graph tags and the dialog only takes the URL as parameter.
One way to solve this is to use a PHP file with a parameter/id for getting separate Open Graph tags and a JavaScript redirection to the main page. The Facebook crawler does not run JavaScript, so it can get the Open Graph tags.
Btw, the feed dialog is deprecated, you should use the FB.ui share dialog instead.

Facebook Javascript Inviting Friends

Basically, I have this piece of Javascript below:
javascript:var inputs = document.getElementsByClassName('uiButton _1sm');
for(var i=0; i<inputs.length;i++) {
inputs[i].click();
}
The user simply loads up a Facebook page, clicks on the 'See All' under "Invite Your Friends to Like This Page", scroll all the way down, then paste the above code into the console.
I was wondering if there's any way to modify this script to ensure that it automatically scrolls down to the bottom of the 'Friends List' before it starts inviting?
And maybe even a 0.3 second delay between each invite?
Thanks

You can scroll down using window.scrollTo(0,document.body.scrollHeight); before inviting all the the friends. The scrollTo() method scrolls the document to specified coordinates. So as you call this, the document will automatically scroll until it reaches the end. You need to use setInterval() to call this, and as soon as the end is reached you would need to clearInterval().
Have a look at my chrome extension on Github for inviting all friends to like any Facebook page here (Github). Also you can download my chrome extension from the google chrome store.

document.getElementsByClassName('headerTextLink')[0].click(); //Open Layer
window.setTimeout( function(){ //Timeout for 3 seconds
var inputs = document.getElementsByClassName('uiButton _1sm');
for(var i=0; i<inputs.length;i++) {
inputs[i].click();
}
}, 3000);
I hope, this is only for you. It's a dirty trick for inviting all friends at once.
You should think about whom you are sending an invitation. Otherwise it is spam.

Well , let this message. Here in this article I will share some way invite all friends to your Facebook fan page a click . We just need a simple script that automatically invite all your friends by clicking on a button to use . So , follow these simple steps and enjoy ..
Open your Facebook page , where you want to invite your friends.
Now simply navigate to the public to build > Invite option.
Now , a dialog box will be the option to invite all your friends
name.
Press F12 to open inspect element tab.
Go to the Console, tab and copy and paste the following script.
var inputs = document.getElementsByClassName('uiButton _1sm');
for(var i=0; i<inputs.length;i++)
{
inputs[i].click();
}
After the paste code above in the list of the console, then hit enter and see the magic ! all your friends will be invited to your Facebook page.