Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 72
  • Last Modified:

Need to run ajax when closing a browser tab in juery

We have tried to insert the record using ajax when if user closing the browser tab. But the code i used didn't working. Please check below.
$(window).unload(function() 

	 var currentTime = new Date();
                var DurationInSeconds = (currentTime - PhotoLoadTime) / 1000;
                $.ajax({
                	 async: false,
                    url: "/property/SavePhotoDuration?propertyid=" + propertyid + "&imageid=" + imageid + "&seconds=" + DurationInSeconds
                }).done(function (rsp1) { });

    });

Open in new window


And here the full code for your reference,
var getUrlParameter = function getUrlParameter(sParam) {
    var sPageURL = decodeURIComponent(window.location.search.substring(1)),
        sURLVariables = sPageURL.split('&'),
        sParameterName,
        i;

    for (i = 0; i < sURLVariables.length; i++) {
        sParameterName = sURLVariables[i].split('=');

        if (sParameterName[0] === sParam) {
            return sParameterName[1] === undefined ? true : sParameterName[1];
        }
    }
};
var PhotoLoadTime = null;
var lastimageid;
var DurationInSeconds;

function setThumbnails() {
    
    var propertyid = unescape(getUrlParameter('propertyid'));
    $.ajax({
        url: "/home/GetPropertyData?propertyid=" + propertyid
    }).done(function (rsp) {
        var propertyData = JSON.parse(rsp);

        for (var i = 0; i < propertyData.length; i++) {
            var imageSrc = "" + propertyData[i]['imageThumb'];
            var fullImage = "" + propertyData[i]['image'];
            var address = "" + propertyData[i]['Address'];
            var description = "" + propertyData[i]['description'];
            var imageid = "" + propertyData[i]['imageid'];
            var TextColor = "" + propertyData[i]['TextColor'];
            $("#tn-list").append('<div data-color="' + TextColor + '" data-imageid="' + imageid + '" id="' + "image-" + i + '" data-image="' + fullImage + '" data-address="' + address + '" data-description="' + description + '" class="thumb"><img src=' + imageSrc + ' title="' + description + '"  /></div>');
            lastimageid = propertyData[0]['imageid'];
        }

        $(".thumb").click(function () {
            var imageid = lastimageid;
            lastimageid = $(this).data("imageid");
            if (PhotoLoadTime != null) {
                var currentTime = new Date();
                var DurationInSeconds = (currentTime - PhotoLoadTime) / 1000;
                $.ajax({
                    url: "/property/SavePhotoDuration?propertyid=" + propertyid + "&imageid=" + imageid + "&seconds=" + DurationInSeconds
                }).done(function (rsp1) { });
            }
            PhotoLoadTime = new Date();
           
            var image = $(this).data("image");
            var address = $(this).data("address");
            var description = $(this).data("description");
            var TextColor = $(this).data("color");
           
            document.getElementById('innerIframe').src = document.getElementById('innerIframe').src + "&imgSelected=" + image + "&address=" + address + "&TextColor=" + TextColor + "&description=" + description;
        });
        setIframe();



        $("#image-0").click();
    });

   
}

$(document).ready(function () {
    setThumbnails();

$(window).unload(function() 

	 var currentTime = new Date();
                var DurationInSeconds = (currentTime - PhotoLoadTime) / 1000;
                $.ajax({
                	 async: false,
                    url: "/property/SavePhotoDuration?propertyid=" + propertyid + "&imageid=" + imageid + "&seconds=" + DurationInSeconds
                }).done(function (rsp1) { });

    });


 
});

function setIframe() {
    
    var iframeUrl = parent.document.getElementById('panorama').src.replace("pannellum.htm", "pannellumInner.htm");
    document.getElementById('innerIframe').src = iframeUrl;

}

Open in new window

0
karthik80c
Asked:
karthik80c
1 Solution
 
Julian HansenCommented:
This works for me
$(function() {
  $(window).on('beforeunload', function() {
    $.ajax({
      async: false,
      type: 'POST',
      url: 't1447.php',
      data: $('#dataform').serialize()
    });
  });
});

Open in new window

Working sample here
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now