Hyperlink does not work on volt in phalcon

munaz Published at Dev

munaz

i have a menu in my volt which is by default hidden by css, and its shows by jquery slide. its every links are getting its url but when i click its not go to that page. its work when i call its url by jquery. im not understanding whats the problem is?

[Volt]
            <ul id="bar_r">
            <li class="sms">0</li>
            <li>{% if uname == true and active === '1' and level !== '0' %}: {{uname}} :{% else %}::{% endif %}</li>
            <li class="menu"><span class="m"></span>
                <ul class="d">
                {% if uname == true and active === '1' and level === '1' %}
                    <li>{{ link_to('profile/each/'~uid,'Profile','id':'profile') }}</li>
                    <li>{{ link_to("blog/entry","Blog",'id':'blogin') }}</li>
                    <li>{{ link_to("session/end","Logout",'id':'logout') }}</li>
                {% else %}
                    <li>
                    {{ form('session/start','id':'logged') }}
                        <label for="email" style="margin:0;padding:0;">Email</label>
                        {{text_field("email", "class":"curved")}}
                        <label for="passwd" style="margin:0;padding:0;">Password</label>
                        {{password_field("passwd", "class":"curved")}}
                        <label for="logins" style="margin:0;padding:0;font-weight:bold;"><em style="display:none">Submit</em></label>
                        {{ submit_button('Login',"id":"logins") }} {{ submit_button('Sign up',"id":"signup") }}
                    {{end_form()}}
                    </li>
                {% endif %}
                </ul>
            </li>
        </ul>

[Jquery]

    //DropLoginMenu
$(".menu").click(function(e){
    e.preventDefault();
    $(".logform").slideToggle(400);
    return false;
});
$(".m").click(function(e){
    e.preventDefault();
    $(".d").slideToggle(500);
    return false;
});
    // Profile redirect
$('#profile').click(function(e){
    e.preventDefault();
    //var i = $(this).attr('id');
    var url = $(this).attr('href');;
    var jqXHR = $.post(url,function(){
        jqXHR.done(function(){
            window.location.href = url;
            //window.location = window.location.host;
        });
        jqXHR.fail(function(){
            window.location.href = 'index';
            //window.location = window.location.host;
        });
    });
});
// Signup
$('#signup').click(function(e){
    e.preventDefault();
    var url = 'user';
    var jqXHR = $.post(url,function(){
        jqXHR.done(function(){
            window.location.href = 'user';
        });
        jqXHR.fail(function(){
            window.location.href = 'index';
        });
    });
    return false;
});
// Login Action Redirect
$('#logins').click(function(e){
    e.preventDefault();
    var url = $('#logged').attr('action');
    var uname = $('#email').val();
    var password = $('#passwd').val();
    $('#logged').html('Processing...');
    var jqXHR = $.post(url,{email:uname,passwd:password},function(){
        jqXHR.done(function(){
            window.location.href = 'index';
            //window.location = window.location.host;
        });
        jqXHR.fail(function(){
            alert('Error');
        });
    });
    return false;
});
// Logout Page Redirect
$('#logout').click(function(){
    var url = 'session/end';
    var jqXHR = $.post(url,function(){
        jqXHR.done(function(){
            window.location.href = 'index';
            //window.location = window.location.host;
        });
        jqXHR.fail(function(){
            window.location.href = 'index';
            //window.location = window.location.host;
        });
    });
});
[css]
.bar{height:30px;background-color:#333;color:#eee;padding:0;margin:0}
#bar{margin:0 auto}
#bar_r{float:right}
#bar_l{float:left}
#bar_r li,#bar_l li{float:left;position:relative;background- color:#333;color:#fff;padding:5px 4px 6px 4px}
#bar_r li:hover,#bar_l li:hover{background-color:#444}
#bar_r .m{background-image:url('../img/menu.png');background-repeat:no-repeat;background-position:50% 50%; vertical-align: middle middle;padding:15px;cursor:pointer}
#bar_r .menu ul{background-color:#444;display:none;position:absolute;left:auto;right:0;*right:-1px;margin-top:6px;min-width:160px;width:auto;z-index:9999;}
#bar_r .menu:hover ul{display:none}
#bar_r .menu:hover li{float:none;background-color:#444;color:#fff}
#bar_r li,#bar_l li{border-right:1px solid #444}
#bar_r li:last-child,#bar_l li:last-child{border-right:0px}
#bar_r li li a,#bar_r li a,#bar_l li a{color:#fff}
.d li{display:block;width:100%;clear:both;border-bottom:1px solid #555;}

is it possible to work its url without jquery?

yergo

Your links are not working because of:

$(".menu").click(function(e){
    e.preventDefault();
    $(".logform").slideToggle(400);
    return false;
});
$(".m").click(function(e){
    e.preventDefault();
    $(".d").slideToggle(500);
    return false;
});

because both e.preventDefault() and return false stops evaluation: proof.

Collected from the Internet

Please contact [email protected] to delete if infringement.