I need to open an email client via javascript. I need to do this within the success function of an ajax call.
My issue is that this does not work on the iPhone. It works fine when it's not within the Ajax call.
function open_email_client(){
var a = document.createElement('a');
a.setAttribute("href", "mailto:myfriend");
a.setAttribute("target", "_blank");
var dispatch = document.createEvent("HTMLEvents");
dispatch.initEvent("click", true, true);
a.dispatchEvent(dispatch);
}
// open_email_client(); Works here for computer (Chrome) and iPhone (Safari)
$.ajax({
type: "POST",
url: "myurl/",
data: {},
success: function(data){
open_email_client(); // Only works on computer, not iPhone. Tested with alert() that it does go here.
}
,error: function(e) {
}
});
I've also tried:
document.location.href = "mailto:my_friend";
This works fine for the iPhone (also within Ajax), but is no good on the computer because I need the client to open in a new window or tab.
I'd like a solution that does not require that I test which sort of device I'm on.
I ended up solving it a different way, which was possible because the initial action is a manual click.
Note that the ajax calls has to have async=false.
<a id = "email_link" target = "blank_" >
<div>Email</div>
</a>
$("#email_link").click(function(){
$.ajax({
type: "POST",
url: "myurl/",
async: false,
data: {},
success: function(data){
$("#email_link").attr("href","mailto:myfriend");
}
,error: function(e) {
}
});
});
Related
i have the following jquery for onclick code :
function find(){
$.ajax({
type: "post",
url: link + 'register/data',
data: {},
success: function () {
window.location.href= "mycontroller/myfunction"
}
});
}
i want to make the url stays on mycontroller/myfunction everytime they click the button, i tried substring lastindexof but it keeps adding more url everytime i click the button, how do i make the button stays on that whenever i click it?
thanks in advance
Let's pretend you're on http://example.com. You redirect the page to "test", so now you're on http://example.com/test. Now you redirect to "test" again. Uh oh, now you're on http://example.com/test/test. Didn't want that to happen, did you? You redirect it just one more time to "other/test". Oh no, now you're on http://example.com/test/test/other/test!
The way to solve this resides in a single bytes. Change test to /test, so it'll always compare to the base URL instead of the current one.
In your JavaScript:
window.location.href = "/mycontroller/myfunction";
However you click it you'll always be on http://example.com/mycontroller/myfunction.
You can change the success function to use window.location.origin like this:
function find(){
$.ajax({
type: "post",
url: link + 'register/data',
data: {},
success: function () {
window.location.href = window.location.origin + "/mycontroller/myfunction"
}
});
}
I have dynamically loaded content .task-listing. The click works because it does "show" the div. But the ajax request doesnt function properly. I get a 200 status in the console, but I get no response from the server. If I refresh the page, it works properly. Why would this occur? I cant figure it out, I have been researching for over 2 hours. When I use firefox it doesnt happen again until I close the browser...
$(document).ready(function () {
$(document).on("click", ".task-listing", function () {
var info = $(this).attr("id");
getTaskInfo(info);
$(".task-data").show();
});
});
function getTaskInfo(info) {
$.ajax({
type: "POST",
url: "/src/php/get-info-task.php",
dataType: "json",
data: "info=" + info,
success: function (response) {
alert("ok");
},
});
}
I have a problem with popstate, Basically my code works really well. I perform an AJAX request and pushState. The problem comes up when I hit the back button on the browser. The whole page will request AJAX again. As you know Github is using this method also but when we hit back button it will not request AJAX again. how does Github do that? This is my code :
function loadProducts(dataPage) {
$.ajax({
type: "GET",
url: test.php,
data: {page : dataPage},
dataType: "html",
cache: true,
success: function(checks) {
$(".ajaxpage").html(checks).fadeIn("slow");
}
});
};
window.onpopstate = function(event) {
if (event.state != null) {
var pop = event.state;
loadProducts(pop.dataPage)
document.title = pop.dataPage;
}
};
$('#product').on("click", ".paging a", function(e) {
e.preventDefault();
history.pushState({
dataPage: $(this).attr('href')
}, null, $(this).attr('href'));
loadProducts($(this).attr('href'));
});
i try to remove "loadProducts(pop.dataPage)" but the page did not show previous page that should be. only the URL had change.
What's wrong with my code?
I have an ajax function that creates a link that triggers another ajax function. For some reason the second ajax function refuses to go through POST event if I've set type: "POST"
The two functionas are below:
function HandleActivateLink(source) {
var url = source.attr('href');
window.alert(url)
$.ajax({
type: "POST",
url: url,
success: function (server_response) {
window.alert("well done")
}
});
return false;
}
function HandleDeleteLink() {
$('a.delete-link').click(function () {
var url = $(this).attr('href');
var the_link = $(this)
$.ajax({
type: "POST", // GET or POST
url: url, // the file to call
success: function (server_response) {
if (server_response.object_deleted) {
FlashMessage('#form-success', 'Link Deleted <a class="activate-link" href="' + url.replace('delete', 'activate') + '">Undo</a>');
$('a.activate-link').click(function(){
HandleActivateLink($(this));
});
the_link.parent().hide();
} else {
var form_errors = server_response.errors;
alert(form_errors)
}
}
});
return false;
});
}
You'll notice HandleDeleteLink creates a new link on success, and generates a new click event for the created link. It all works butHandleActivateLink sends the request to the server as GET. I've tried using $.post instead with no luck.
Any pointers, much appreciated.
In the second event you do not inform the client to prevent the default behaviour.
One way to do this would be to change:
$('a.activate-link').click(function(){
HandleActivateLink($(this));
});
to:
$('a.activate-link').click(function(){
return HandleActivateLink($(this));
});
(This works because HandleActiveLink already returns false.)
A nicer way to do this is to pass in the event argument to the click function and tell it to preventDefault
$('a.activate-link').click(function(e){
e.preventDefault();
HandleActivateLink($(this));
});
what is your url?
btw You can't send a cross-domain post via javascript.
I have a link 'hrefs="javascript:callFunc()">' that invokes the function 'callFunc()';
function callFunc(){
$.ajax({
type: "POST",
url: "call.php",
data: "i="+i+add,
success: function(msg){
$('#content').html(msg);
}
});
}
The issue: When the user click's that link 4 times, the callFunc is going to invoke 4 times, sending 4* the post via ajax.
Anyway to lock this down?
*Beaware that the link could be through out the page too; And there could be similar functions.
What about:
window.funcRunning = false;
function callFunc(){
if(window.funcRunning == false) {
window.funcRunning = true;
$.ajax({
type: "POST",
url: "call.php",
data: "i="+i+add,
success: function(msg){
$('#content').html(msg);
window.funcRunning = false;
}
});
}
}
Have the event handler disable the link, or ever better replace it with "Please wait…" or other appropriate feedback message.