if ajax function is successful display an alert - ajax

I have a jsp named home.jsp. On click of "activate now" button in this jsp, a lightbox is being displayed.
This lightbox has 2 buttons "activate" and "remove".
When I click on "activate" button, a service is being activated. On successful activation, page is reloaded and home.jsp is displayed.
Now i want to display an alert when this happens. Can anyone please help me with this?

Your home.jsp page should queue a JavaScript snippet that runs immediately after the page gets loaded (and once it's activated). I recommend using jQuery which will make this a lot easier. Here is a dirty example:
<html>
<head>
...
<script type="text/javascript">
jQuery().ready(window,function(){
alert("your account is activated");
});
</script>
...
</head>
<body>
...

Related

Remove "Mark Complete" button on Task Ribbon in Project Web App

I would like to remove the "Mark Task Complete" button from the Task Ribbon on my Project Web App to prevent users from clicking on it. I have been successful in adding a custom JavaScript Web Part to hide the button after a 200 millisecond delay because the JavaScript has to wait for the page to load. However, this not only leads to a bad user experience but also it is not guaranteed that the page will fully load in 200 milliseconds and thus leaves the possibility of the users seeing the button and being able to interact with it. Here is that JavaScript.
<html>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("li.ms-cui-tt a:eq(1)").trigger("click");
});
window.onload = function(){
setTimeout(function(){
document.getElementById('Ribbon.ContextualTabs.MyWork.Home.Tasks.MarkComplete-Large').style.display = 'none';
}, 200);
};
</script>
</body>
</html>
Is there a way to accomplish the desired affect without using a delay?
You can use CSS for the same result, note that you have to substitute the dot in the class name with \.
It should look a bit like this (In a Scritp Editor Web Part on the Page):
<style type="text/css">
#Ribbon.ContextualTabs.MyWork.Home.Tasks.MarkComplete-Large {
display: none
}
</style>

Mailchimp sign up PopUp does not work

I am trying to implement a signup PopUp from Mailchimp but as it seems, I am not able to make it working! Here's the code:
<html>
<head>
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<script type="text/javascript" src="http://s3.amazonaws.com/downloads.mailchimp.com/js/signup-forms/popup/embed.js" data-dojo-config="usePlainJson: true, isDebug: false"></script><script type="text/javascript">require(["mojo/signup-forms/Loader"], function(L) { L.start({"baseUrl":"http://mc.us9.list-manage.com","uuid":"146962178e8704d5ccaf9c28f","lid":"e13cc10d95"}) }) </script>
</head>
<body>
<p>This is a test!</p>
</body>
</html>
If I open the html file (locally), it loads but nothing else happen. Also there is no html code embedded what I would expect it to do. Do you have any ideas?
you have to know a couple of things:
this shows your popup on page load (hence no HTML code)
it only shows once since it places a cookie, and if you already saw your popup won't bother you with it again. (try it in private mode in your browser)
Try to add in header this google libraly <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>

Launching FancyBox automatically on Magento

I know this was asked before but i couldn't get it to work anyhow. What I am trying to do is to launch FancyBox on page load(on Magento). Seems simple enough but as I am not very familiar with JQuery, i am having some problems. The Code I got the work with manually clicking on the anchor is as follows:
<!-- FancyBox -->
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("a[rel=fancybox]").fancybox({
});
});
</script>
<!-- FancyBox -->
<p><a id="image_id" href="http://shop2.xsmoke.com/skin/frontend/infinitus/maxxi/images/logo-300x71.png" rel=iframeLink><img src="http://shop2.xsmoke.com/skin/frontend/infinitus/maxxi/images/logo-300x71.png" alt="" /></a></p>
What I have so far regarding automatic launch is:
jQuery(document).ready(function(){
$("#image_id").fancybox().trigger('click');
});
The rest is same. Can anyone help?
EDIT: Ok i have been trying to get it to work for hours now and I tried using plain JavaScript for clicking the anchor. I Wrote
function init(){
document.getElementById("image_id").click();
}
window.onload = init;
but it still doesn't click the anchor. When I try it on a basic html page locally it works, but on the Magento home-content.phtml on the server it doesn't.
Try
jQuery(document).ready(function(){
jQuery("a[rel=fancybox]").fancybox({});
jQuery("a[rel=iframeLink]").fancybox({});
$("#image_id").trigger('click');
});
<p>
<a id="image_id" href="http://shop2.xsmoke.com/skin/frontend/infinitus/maxxi/images/logo-300x71.png" rel="iframeLink">
<img src="http://shop2.xsmoke.com/skin/frontend/infinitus/maxxi/images/logo-300x71.png" alt="" /></a></p>

Opening Spring jsp in a popup window

My application needs a solution like Outlook mail: opening an other page as popup window on the parent window. The application is Spring 3 based and uses jsps. How do I make a popup out of my application page in order to make it work as intended at least in most common browsers?
I've tried target and window.open, without getting them work properly in Firefox.
Just as an example, the Spring travel sample app contains a jsp which is launched via a pop-up.
<a id="changeSearchLink" href="hotels/search?searchString=${searchCriteria.searchString}&pageSize=${searchCriteria.pageSize}">Change Search</a>
<script type="text/javascript">
Spring.addDecoration(new Spring.AjaxEventDecoration({
elementId: "changeSearchLink",
event: "onclick",
popup: true,
params: {fragments: "searchForm"}
}));
</script>
This shows how a link is decorated with an Ajax Event to launch searchForm.jsp when the link is clicked.

JWYSIWYG or jHtmlArea within a Jquery Ui Tab

I am not able to get my jwysiwyg and Jhtmlarea text editors to work within an AJAX loaded Jquery UI Tab
Both text editors work when loaded normally.
This loads the tabs on the "View Page"
<script type="text/javascript">
$(function() {
$("#tabs").tabs();
});
</script>
This loads the page via AJAX on the "View Page"
<li>Edit</li>
This loads the Html Area on the "Edit Page"
<script type="text/javascript" charset="utf-8">
$(function(){
$("textarea").htmlarea();
});
</script>
All help would be greatly appreciated.
Tim
because you're injecting the things you're trying to htmlarea-ize into the DOM after the page loads, you have to put your $("textarea").htmlarea() inside the callback function of the ajax call.

Resources