Question

i have this jquery function on my cms files:

/* ************************************* */

// JQuery Function calls:

$(document).ready(function(){

    // Fade message
    $(".message").css({display: "none"}).fadeIn(1000);


    // Show/Hide table details (Plugin Management page and similar tables)
    $(".table_drop_down").click(function () {
        var target = $(this).parents("tr").next("tr");
        target.fadeToggle();
        return false;
    });

    // Hide table details (Plugin Management page and similar tables)
    $(".table_hide_details").click(function () {
        $(this).parents("tr.table_tr_details").fadeOut();
        return false;
    });  

    // Show/Hide forgot password form
    $(".forgot_password").click(function () {
        var target = $("#forgot_password_form");
        target.fadeToggle();
        return false;
    });  

    // Show/Hide generic
    $(".show_hide").click(function () {
        var target = $(".show_hide_target");
        target.fadeToggle();
        return false;
    });

});

the // Show/Hide forgot password form suddenly stopped working.

this is the part of php file where its called:

<a href="#" class="forgot_password">Forgot password?</a>
<form id="forgot_password_form" style="display: none;" name='forgot_password_form' action='<?php echo BASEURL; ?>index.php' method='post'>
    <?php echo $h->lang['user_signin_login_forgot_password_submit_instruct_1']; ?>
<table>
    <tr>
    <td><?php echo $h->lang["user_signin_account_email"]; ?>&nbsp; </td>
    <td><input type='text' size=30 name='email' value='<?php echo $email_check; ?>' /></td>
    <td><input type='submit' class='submit' value='<?php echo $h->lang['user_signin_login_forgot_password_submit']; ?>' /></td>
    </tr>            
</table>
<input type='hidden' name='forgotten_password' value='true'>
<input type='hidden' name='page' value='login'>
<input type='hidden' name='csrf' value='<?php echo $h->csrfToken; ?>' />
    <?php echo $h->lang['user_signin_login_forgot_password_submit_instruct_2']; ?>
</form>

this is the style declaration

#forgot_password_form {
    display: none;
}

it stopped working sometime ago, i dont know why, i click the link and nothing seems to happen.

does anyone see something wrong here?

the error on console

target.fadeToggle is not a function
...rget");target.fadeToggle();return false;});});$.extend({URLEncode:function(c){va...

the console debug head me to this line

var ajax=Array();var returnvalue=Array();jQuery.fn.fadeToggle=function(speed,easing,callback){return this.animate({opacity:'toggle'},speed,easing,callback);};$(document).ready(function(){$(".message").css({display:"none"}).fadeIn(1000);$(".table_drop_down").click(function(){var target=$(this).parents("tr").next("tr");target.fadeToggle();return false;});$(".table_hide_details").click(function(){$(this).parents("tr.table_tr_details").fadeOut();return false;});$(".forgot_password").click(function(){var target=$("#forgot_password_form");target.fadeToggle();return false;});$(".show_hide").click(function(){var target=$(".show_hide_target");target.fadeToggle();return false;});});$.extend({URLEncode:function(c){var o='';var x=0;c=c.toString();var r=/(^[a-zA-Z0-9_.]*)/;while(x<c.length){var m=r.exec(c.substr(x));if(m!=null&&m.length>1&&m[1]!=''){o+=m[1];x+=m[1].length;}else{if(c[x]==' ')o+='+';else{var d=c.charCodeAt(x);var h=d.toString(16);o+='%'+(h.length<2?'0':'')+h.toUpperCase();}x++;}}return o;},URLDecode:function(s){var o=s;var binVal,t;var r=/(%[^%]{2})/;while((m=r.exec(o))!=null&&m.length>1&&m[1]!=''){b=parseInt(m[1].substr(1),16);t=String.fromCharCode(b);o=o.replace(m[1],t);}return o;}});function handleEnter(field,event){var keyCode=event.keyCode?event.keyCode:event.which?event.which:event.charCode;if(keyCode==13){return false;}

Answer 1

If your PHP file being called is being executed via some kind of ajax, you might want to try changing your click function to this:

If using jquery 7+

// Show/Hide forgot password form
    $(".forgot_password").on("click",function () {
    var target = $("#forgot_password_form");
    target.fadeToggle();
    return false;
}); 

If you’re using a slightly older jquery try using live() instead of on().