Is it possible to "refresh" or "rerun" a jQuery selector after the DOM might have changed? -
i have page loads complicated set of forms. in set of forms, there password fields. these password fields have show/hide toggle switches which, when of them clicked, password fields replaced equivalents of in dom types toggled between "text" , "password" facilitate show/hide effect. clear, original input replacewith()'ed brand new input same attributes, including id, different type attributes.
the problem when toggle occurs, global handles had made in jquery selectors (such $('#password_field_id')) no longer map password fields.
is there jquery function can run on selector re select original css selector current dom?
the function replaces inputs follows:
function togglepasswordhide() { var show = false; if ($('#basic_pass_24').attr('type') == 'password') { show = true; } $('input.password_input').each(function() { var sdisabled = ''; if ($(this).is(':disabled')) { sdisabled = 'disabled="disabled"'; } if ( show ) // show password { $(this).replacewith('<input type="text" '+sdisabled+' class="password_input" id="'+$(this).attr('id')+'" value="'+$(this).val()+'">'); show_password.text('hide'); } else // hide password { $(this).replacewith('<input type="password" '+sdisabled+' class="password_input" id="'+$(this).attr('id')+'" value="'+$(this).val()+'">'); show_password.text('show'); } }); } ...is there call can make during .each "reload" jquery object after replacement has been made global handles same relative inputs update rather having redeclare new jquery objects same selectors each element , overwrite original handles?
use event-delegation, , listen events on parent form:
$("form").on("click", ".password_input", function(event) { /* when password input clicked */ }); because event bound form element, can add , remove inputs wish without having worry losing events.
when click, or perform other action, on 1 of password inputs, event bubbles form evaluated. if .target matches selector (in example, .password_input), callback function invoked , can react event took place.
Comments
Post a Comment