WordPress.org

Ready to get started?Download WordPress

Forums

WP Login Form Code not getting validated, while adding a Checkbox (3 posts)

  1. phatpat10
    Member
    Posted 1 year ago #

    Hi All,

    I'm trying to add a checkbox to the WP login form, where the user has to check the checkbox before logging in. I have some code i've been trying to implement, but for some reason the code is not getting executed, can someone tell me why the code below isn't working? FYI, i have an ID name of "form1" on the form in the wp-login.php file:

    $('#form1').submit(function() {
    if ($('input:checkbox', this).is(':checked')) {
    // everything's fine...
    } else {
    alert('Please select something!');
    return false;
    }
    });

    [Please don't bump - it's not permitted here.]

  2. linux4me2
    Member
    Posted 1 year ago #

    Ah, here's your code.

    I think if it were me I would give the checkbox an ID and change how you're checking the state of the checkbox so that you're using the boolean value of .prop. Say your checkbox has an ID of "mycheckbox:"

    $('#form1').submit(function() {
    if ($('#mycheckbox').prop('checked')) {
    // everything's fine...
    } else {
    alert('Please select something!');
    return false;
    }
    });

    If you have a whole bunch of checkboxes, and you want to make sure at least one is checked, the ID option won't work, but you can use the combination of a fieldset and an array like this, where your fieldset looks like:

    <fieldset id="checkArray">
        <input type="checkbox" name="chk[]" value="Apples" />
        <input type="checkbox" name="chk[]" value="Bananas" />
    </fieldset>

    and your JQuery would be either:
    var atLeastOneIsChecked = $('#checkArray :checkbox:checked').length > 0;
    or without the fieldset using the array of checkboxes:
    var atLeastOneIsChecked = $('input[name="chk[]"]:checked').length > 0;

  3. phatpat10
    Member
    Posted 1 year ago #

    Thank you, I figured out my the code wasn't working was because the Jquery was conflicting with other plugins therefore not being able to execute the code. I found a quick way to be able to execute code, which can be wrapped around the code below:

    jQuery(document).ready(function($) {
        // $() will work as an alias for jQuery() inside of this function
    });

    Appreciate the help though!

Topic Closed

This topic has been closed to new replies.

About this Topic