Pregunta

I have asked a question like this before, and the answer was great but the more I looked at my code the more confused I got, and after 10hrs my brain is shot and I'm in need of help. So all my content is loaded dynamically via Jquery's $.post and loaded into #content-container. Now I included my entire Jquery file to show you why I am getting so confused as how to get this to work without re-writing all the code. As you can see, and what I'm thinking, is that the history plugins such as BBQ, and history.js seem to be out of the question because I don't use anchor tags and the multitude of .live('click', funcition() { I have use different classes and id's for various reasons. I also believe that rules out using the hash and linking it to a single class via .trigger(), executing the AJAX(hope that makes sense). The only option I have left is actually kinda my question. Would it be possible to load the dynamic content into #content-container still using the $.post with $.load() or window.location and actually have the previous content loaded when the browser back button is clicked.

I greatly appreciate the help, really.....

$(document).ready(function() {

$(window).load(function () {        
});

$('#map').hide();
$('#informational-container').hide();

$('.clickable').click(function(){
$('#map').hide();
});

function getTotalDealCount() {
$.post('../service/service.getTotalDealCount.php', {}, function(data) {
    if(data.success) $('#deal-counter').append(data.results);
}, 'json');
    return false;
}

function loadMap(lat, lon) {
var latlng = new google.maps.LatLng(lat, lon);
var myOptions = {
    zoom: 15,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};

var map = new google.maps.Map(document.getElementById('map'), myOptions);
var marker = new google.maps.Marker({
    position: latlng,
    map: map
});
}

function getLatLon(address, zipcode) {
$.post('../service/service.getLatLon.php', { address: address, zipcode: zipcode },          function(data) {
    if(data.success) {
        var res = data.results;
        var coordinates = res.split('_');
        loadMap(coordinates[0], coordinates[1]);
    } else {
        return false;
    }
}, 'json');
    return false;
} 

function getAddressZipcode(id) {
$.post('../service/service.getAddressZipcode.php', { id: id }, function(data) {
    if(data.success) {
        var res = data.results;
        var location = res.split('_');
        getLatLon(location[0], location[1]);
    } else {
        return -1;
    }
}, 'json');
    return false;
}

$('#how-it-works').live('click', function() {
$('#content-container').load('../module/module.string.php #string-m1');
});

$('#why-post-a-deal').live('click', function() {
$('#content-container').load('../module/module.string.php #string-m2');
});

$('#who-are-we').live('click', function() {
$('#content-container').load('../module/module.string.php #string-m3');
});

$('#contact-us').live('click', function() {
$('#content-container').load('../module/module.string.php #string-m4');
});

$('#post-deal-img').live('click', function() {
$('#content-container').load('post.php');
});

$('.post-deal-inputs').live('click', function() {
$('.post-deal-inputs').live('click', function(e) {
    $(this).val('');
    $(this).removeClass('post-deal-inputs')
       .addClass('post-deal-inputs-clicked');
});
});

$('#df5').live('click', function() {
$('#df7').val('');
$('#df7').hide();
});

$('#df6').live('click', function() {
$('#df7').show();
});

$('#post-how-to-link').live('click', function() {
apprise();
});

$('#terms').live('click', function() {
$('#content-container').load('../module/module.string.php #string-m5');
});

$('#disclaimer').live('click', function() {
$('#content-container').load('../module/module.string.php #string-m6');
});

$('#post-deal-button').live('click', function() { 
var dealForm = $('#deal-form').serialize();
var company = $('#df1').val();
var description = $('#df2').val();
var zipcode = $('#df4').val();
var starts = $('#df7').val();
var ends = $('#df8').val();


if(company == '' || company == 'Company') {
    apprise('A company name is required!');
    return false;
} 

if(description == '' || description == 'Deal') {
    apprise('A deal is required!');
    return false;
}

var swear = swearFilter(description);
if(swear != false) {
    apprise('Please remove the naughty word `' + swear + '` from your deal.');
    return false;
}

if(zipcode == '' || zipcode == 'Zipcode') {
    apprise('A zipcode is required!');
    return false;
} 

if($('#df7').is(':visible') && typeof(ends) != 'undefined') {
    var res = validateDate(starts);

    if(res == false) {
        apprise('Please select a valid start date!');
        return false;
    }
}

if(typeof(ends) != 'undefined') {
    var res = validateDate(ends);

    if(res == false) {
        apprise('Please select a valid end date!');
        return false;
    }
}

if(ends == '') {
    apprise('A deal end date is required!');
    return false;
} 

if($('#df7').is(':visible') && $('#df7').val() == '') { 
    apprise('If its not a one day sale a start date is required!');
    return false
} 

$.post('../service/service.postDeal.php', { dealForm: dealForm }, function(data) {
    if(data.success == true) {
        apprise('Your deal has been posted, thank you!');
        window.location = '../root/index.php';
        return true;
    } 

    if(data.success == false) {
        if(data.fail == 1) {
            apprise('An error has occured and your deal has not been posted. ' +
                'The error has been emailed to our support department to have the issue fixed, we apologize :(');
            return false;
        } 

        if(data.fail == 2) {
            apprise('The zipcode you supplied was not in our database. Please enter the city ' +
                'and state/province in the following prompts to add your location.' , {'confirm':true}, function() {
                    insertNewLocation(zipcode);
            });
        } 

        if(data.fail == 3) {
            apprise('A zipcode is required!');
        }
    }
}, 'json');
    return false;
});


function validateDate(string) {
if(string.toLowerCase().indexOf('-') >= 0) {
    var dateArray = string.split('-');
    var year = dateArray[0], month = dateArray[1], day = dateArray[2];

    if(year.length == 4 && month.length == 2 && day.length == 2) return true;
    else return false;
} 

return false;
}

function swearFilter(string) {
var ret = false;

var filter = [];

var stringArray = string.split(' ');

for(var i = 0; i < stringArray.length; i++) {
    if(jQuery.inArray(stringArray[i], filter) > -1) {
        ret = stringArray[i];
        break;
    }
}

return ret;
}

function insertNewLocation(zipcode) {
var city = '';
var state = '';

if (/[^a-zA-Z 0-9]+/g.test(zipcode)) {
    apprise('The zipcode should contain only numbers, letters or both!');
    return false;
}

apprise('Enter the name of the city:', {'input':true}, function(_city_) {
    if(/[^a-zA-Z]+/g.test(_city_)) {
        apprise('The city should contain only letters!');
        return false;
    } 

    city = _city_;
    apprise('Enter the state in 2 letter abbreviated format:', {'input':true}, function(_state_) {
        if (/[^a-zA-Z]+/g.test(_state_)) {
            apprise('The state should contain only letters');
            return false;
        } 

        if(_state_.length > 2) {
            apprise('The state should only be 2 letters in length');
        } 

        state = _state_;
        $.post('../service/service.insertNewLocation.php', { city: city, state: state, zipcode: zipcode }, function(data) {
            if(data.success == true) {
                apprise('Thank you, you may now submit you deal!');
                return true;
            }

            if(data.success == false) {
                if(data.fail == 1) {
                    apprise('An error has occured and your location has not been added to our database. ' +
                        'The error has been emailed to our support department to have the issue fixed, we apologize :(');
                    return false;
                } 

                if(data.fail == 2) {
                    apprise('A zipcode is required!');
                    return false;
                } 
            }                   
        }, 'json');
            return false;       
    });
}); 
}

$('#search-type-button').live('click', function() {
var search = $('#search-type-text').val();
var keyword = $('#keyword-type-text').val();

if(search == '') {
    apprise('A zipcode or city and state combo to search for deals in your area!');
    return false;
} 

if(keyword == 'Keyword') {
    apprise('If you want to add a keyword to you deal, make sure its unique!');
    return false;
}

$.post('../service/service.loadDealsByCityOrZipcode.php', { search: search, keyword: keyword }, function(data) {
    if(data.success) {
        $('#content-container').html(data.results);
        return true;
    }  

    if(data.success == false) { 
        if(data.fail == 1) {
            apprise('An error has occured locating the deals. ' +
                'The error has been emailed to our support department to have the issue fixed, we apologize :(');
            return false;
        } 

        if(data.fail == 2) {
            apprise('There are no deals within the zipcode you provided, be the first to add one!');
            return false;
        }

        if(data.fail == 3) {
            apprise('There are no deals matching the tag you supplied!');
            return false;
        } 

        if(data.fail == 4) {
            apprise('A zipcode or city and state combo to search for deals in your area!');
            return false;
        }   
    }
}, 'json');
    return false;
});

$('.deals-queried-deal').live('click', function() {
var id = this.id;

$('#comment-link').show();

$.post('../service/service.loadDealDescription.php', { id: id  }, function(data) {
    if(data.success == true) {
        $('#content-container').html(data.results);

        var res = getAddressZipcode(id);
        if(res != -1) $('#map').show();
    } 

    if(data.success == false) {
        if(data.fail == 1) {
                apprise('An error has occured loading the deal you selected. ' +
                    'The error has been emailed to our support department to have the issue fixed, we apologize :(');
        } else if(data.fail == 2) {
                apprise('The deal you selected does not exist! ' +
                'The error has been emailed to our support department to have the issue fixed, we apologize :(');
        } else if(data.fail == 3) {
            apprise('An error has occured loading the deal you selected. ' +
                    'The error has been emailed to our support department to have the issue fixed, we apologize :(');
        }
    }
}, 'json');
    return false;
});

$('.vote-down').live('click', function() {
var id = this.id;
var vote = 0;

$.post('../service/service.tallyVote.php', { id: id, vote: vote }, function(data) {
    if(data.success == true) {
        apprise('Thank you for your vote!');
        return true;
    } 

    if(data.success == false) {
        if(data.fail == 1) {
            apprise('An error has occured when voting for this deal. ' +
                'The error has been emailed to our support department to have the issue fixed, we apologize :(');
            return false;
        }  

        if(data.fail == 2) {
            apprise('You have already voted for this deal!');
            return false;
        }
    }
}, 'json');
    return false;
});

$('.vote-up').live('click', function() {
var id = this.id;
var vote = 1;

$.post('../service/service.tallyVote.php', { id: id, vote: vote }, function(data) {
    if(data.success == true) {
        apprise('Thank you for your vote!');
        return true;
    }

    if(data.success == false) { 
        if(data.fail == 1) {
            apprise('An error has occured when voting for this deal. ' +
                'The error has been emailed to our support department to have the issue fixed, we apologize :(');
            return false;
        } 

        if(data.fail == 2) {
            apprise('You have already voted for this deal!');
            return false;
        }
    }
}, 'json');
    return false;
});

$('#email-button').live('click', function() {
var emailAddress = $('.email-textbox').val();
var from = $('#from-textbox').val();
var message = $('#email-div').html();

var atpos = emailAddress.indexOf("@");
var dotpos = emailAddress.lastIndexOf(".");
if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= emailAddress.length) {
    apprise('Please enter a valid email address!');
    return false;
} 

if(emailAddress == '') {
    apprise('An email address is required!');
    return false;
} 

if(from == '') {
    apprise('Your name is required!');
    return false;
} 

$.post('../service/service.emailDeal.php', { emailAddress: emailAddress, from: from, message: message}, function(data) {
    if(data.success == true) {
        apprise('The deal has been sent, we hope they enjoy it!');
        return true;
    } 

    if(data.success == false) {
        if(data.fail == 1) {
            apprise('An error has occured sending the email. ' +
                'The error has been emailed to our support department to have the issue fixed, we apologize :(');
            return false;
        }

        if(data.fail == 2) {
            apprise('An email address is required!');
            return false;
        }
    }
}, 'json');
    return false;
});

$('.comment-link').live('click', function() {
var id = this.id;

$.post('../service/service.loadComments.php', { id: id }, function(data) {
    if(data.success == true) {
        $('#content-container').html(data.results);
        return true;
    }

    if(data.success == false) {
        apprise('An error has occured retrieving the comments for this deal. ' +
            'The error has been emailed to our support department to have the issue fixed, we apologize :(');
        return false;
    } 
}, 'json');
    return false;
});

$('.post-comment-button').live('click', function() {
var id = this.id;
var comment = $('#comment-textarea').val();
var author = $('#post-comment-whois').val();

var swear = swearFilter(comment);
if(swear == true) {
    apprise('Please remove the word "' + swear + '" from your comment.');
    return false;
}

if(comment == '') {
    apprise('Please fill out a comment first!');
    return false;
} 

$.post('../service/service.postComment.php', { id: id, comment: comment, author:  author }, function(data) {
    if(data.success == true) {
        $.post('../service/service.loadComments.php', { id: id },     function(data) {
            if(data.success == true) {
                $('#content-container').html(data.results);
                return true;
            } 

            if(data.success == false) {
                apprise('An error has occured retrieving the comments for this deal. ' +
                    'The error has been emailed to our support department to have the issue fixed, we apologize :(');
                return false;
            } 
        }, 'json');
            return false;
    } 

    if(data.success == false) {
        if(data.fail == 1) {
            apprise('An error has occured while attempting to post your comment. ' +
                'The error has been emailed to our support department to have the issue fixed, we apologize :(');
            return false;
        } 

        if(data.fail == 2) {
            apprise('Please fill out a comment first!');
            return false;
        }
    } 
}, 'json');
    return false;
});
});`
¿Fue útil?

Solución

Use history.js to pushState and then window.history.back()

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top