JQuery and nested elements

Using jQuery ...

I want to be able to take the parent div and search through any internal elements to find a specific element that can be nested in ANYWHERE with the parent element.

Then I take these elements and look at them and based on their value, disconnecting / activating different elements ...

I also want to make it so that I have several sets of parent divs that allow the functionality to work the same with the specific elements inside it ...

so if i have ...

<div class="parent">
    <table>
        <tr>
            <td>
                <input type="text" />
            </td>
        </tr>
        <tr>
            <td>
                <input type="text" />
            </td>
        </tr>
        <tr>
            <td>
                <input type="text" />
            </td>
        </tr>
        <tr>
            <td>
                <input type="submit" />
            </td>
        </tr>
    </table>
</div>

<div class="parent">
    <table>
        <tr>
            <td>
                <input type="text" />
            </td>
        </tr>
        <tr>
            <td>
                <input type="text" />
            </td>
        </tr>
        <tr>
            <td>
                <input type="text" />
            </td>
        </tr>
        <tr>
            <td>
                <input type="submit" />
            </td>
        </tr>
    </table>
</div>

Any changes that I make in the first set of text fields will enable / disable the submit button for the first group .. and the same for the second group.

jquery, , , div, div- SubmitDisable....

$(document).ready(function() {

    $('.SubmitDisable > input[type=submit]').attr('disabled', 'disabled');


    $('.SubmitDisable > input[type=text], input[type=textarea]').keyup(function() {
        $(this).siblings('input[type=submit]').removeAttr('disabled');

        $.each($(this).parent().children('input[type=text], input[type=textarea]'), function() {
            if ($(this).val() == "") {
                $(this).siblings('input[type=submit]').attr('disabled', 'disabled');
            }
        });

    });
});

? , , jquery div , (), " .

, , ,

<div class="SubmitDisable">
<div><div><div><input type="text" /></div></div></div>
<div><table><tr><td><div><input type="text" /></div></td></tr></table>
<span><div><b><input type="text" /></b></div></span>
<input type="submit" />
</div>

, , ... . , , , , , , , .

+3
2

2 ... ... , ...

$(document).ready(function() {
    $('.SubmitDisable').find('input[type=submit]').attr('disabled', 'disabled');
    $('.SubmitDisable').find('input[type=text], textarea').keyup(function() {
        var objParent = $(this).parent();
        while (!($(objParent).attr('class') == 'SubmitDisable')) {
            var objParent = $(objParent).parent();
        }
        $(objParent).find('input[type=submit]').removeAttr('disabled');
        $.each($(objParent).find('input[type=text], textarea'), function() {
            if ($(this).val() == "") {
                $(objParent).find('input[type=submit]').attr('disabled', 'disabled');
            }
        });
    });
});

, "" div, ... kudos to pixeline find

- , .

+1

, - div.parent, :

, , , .

    $(document).ready(function() {
$('.SubmitDisable > input[type=submit]').attr('disabled', 'disabled');
$('div.parent input[type="text"], div.parent input[type="textarea"]').keyup(function(){

var parent = $(this).parents('div.parent');
$('input[type="submit"]',parent).attr('disabled','disabled');

    $('input[type="text"], input[type="textarea"]', parent).each(function(){
    if ($(this).val() !== "") {
                    $('input[type=submit]',parent).attr('disabled', '');
                }
    });

    });


    });

, ( - , , )

+1

Source: https://habr.com/ru/post/1717748/


All Articles