Question

I'm having a problem whit my script here and I don’t understand why. After testing a lot I understood that the main problem is the Ajax-request. Also I have been using the Ajax-request in another version of my script... Back then the changing of my content went very well... But now I wanted to enable the back-button so I asked here how that would work... I got a very good answer, so I tried to do that whit the help of this tutorial now this below is the result: now the changing of the url works and the old-content is fading out but the new-content (from the request) isn’t updating… Update: its's like not even sending the request... Could someone please tell me why??

Thank you in advanced

And sorry for my bad English.

JavaScript:

$(function () {

    var newHash = "",
        $content = $("#content"),
        $el;

    $('ul li a').click(function () {
        window.location.hash = $(this).attr("href");
        return false;
    });

    $(window).bind('hashchange', function () {

        newHash = window.location.hash.substring(1);
        url=$(this).attr("href");
        if (newHash) {
            $content

            .fadeOut(200, function () {

                //                 url=url.replace('#','');

                $('#loading').css('visibility', 'visible'); //show the rotating gif animation

                $.ajax({
                    type: "POST",
                    url: "load_page.php",
                    data: 'page' + url,
                    success: function (msg) {

                        if (parseInt(msg) != 0) //if no errors
                        {
                            $('#content').html(msg); //load the returned html into pageContet

                        }
                        $('#loading').css('visibility', 'hidden'); //and hide the rotating gif
                    }

                });

                $('ul li a').removeClass("current");
                $("'ul li a'[href='" + newHash + "']").addClass("current");
            });

        };

    });

    $(window).trigger('hashchange');

});

PHP:

<?php
if(empty($_POST['page'])) die("0");

$page = $_POST['page'];

//  validate it as alphanumeric before reading the filesystem
if (preg_match('/^[a-z0-9]+$/i', $_POST['page']) && file_exists('article/'.$page.'.html')) {
  echo file_get_contents('article/'.$page.'.html');
}
else echo 'There is no such page!';
?>

Update: In the firebug-plugin I get this:

Error: Syntax error, unrecognized expression: 'ul li a[href='anmeldung']

This is how my FireBug Consol looks like... does this meens the URL was empty?

Was it helpful?

Solution 3

 $(function() {

    var newHash      = "",
        $content = $("#content");



    $('ul li a').click(function() {
        window.location.hash = $(this).attr("href");
        return false;
    }); 

    $(window).bind('hashchange', function(){

        newHash = window.location.hash.substring(1);
        url=newHash
        if (newHash) {
            $content

                .fadeOut(200, function() {

         url=url.replace('#','');

 $('#loading').css('visibility','visible'); //show the rotating gif animation

   $.ajax({
        type: "POST",
        url: "load_page.php",
        data: 'page='+url,
        success: function(msg){

               if(parseInt(msg)!=0) //if no errors
            {
                 $content.fadeIn(200, function() {
            $('#content').html(msg);}); //load the returned html into pageContet

            }  $('#loading').css('visibility','hidden');//and hide the rotating gif
        }

    });

                        $('ul li a').removeClass("current");
                        $('ul li a[href="' + newHash + '"]').addClass('current');
                    });

        };

    });

    $(window).trigger('hashchange');

});

Ahhh I found the Error the problem was that I set url to late... Thanks every person - robot who looked and helped me solve this ^^

OTHER TIPS

Change this line:

$("'ul li a'[href='" + newHash + "']").addClass("current");

Into this one:

$('ul li a[href="' + newHash + '"]').addClass('current');

At least that's the syntax error FireBug is complaining about.

You are sending data to your PHP script in the wrong way. You should be sending it as key=value, you are sending it like keyvalue, so your PHP script never gets the page variable.

So change your script from

data: 'page'+url,

to

data: 'page='+url,
//         ^
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top