CODEWITHSUNDEEP
jquery
99ProblemsAndTheyreAllCode
99ProblemsAndTheyreAllCode

Reputation: 342

Using jquery .find() to check existence item in DOM

I'm trying to check if one of my table rows has a <td> underneath it with the class .choose-array. If not it should skip this element. Here is what I have so far, however it keeps throwing the error cannot read property 'substr' of undefined.

HTML

   <table class="custom-includes">
        <tbody><tr>
            <td></td>
            <td>
                <input type="checkbox" name="7700-head" checked="">7700 Head
            </td>
        </tr>
        <tr>
            <th>+/-</th>
            <th>Array(s)</th>
        </tr>
        <tr>
            <td class="remove-array">-</td>
            <td>
                <select class="choose-array" name="array-0">
                    <option value="7300E-10">7300E-10</option>
                    <option value="7300E-17">7300E-17</option>
                    <option value="7300E-26">7300E-26</option>
                    <option value="7300E-35">7300E-35</option>
                    <option value="7300-52">7300-52</option>
                    <option value="7300-70" selected="">7300-70</option>
                </select>
            </td>
        </tr>
        <tr>
            <td class="remove-array">-</td>
            <td>
                <select class="choose-array" name="array-2">
                    <option value="7300E-10">7300E-10</option>
                    <option value="7300E-17">7300E-17</option>
                    <option value="7300E-26">7300E-26</option>
                    <option value="7300E-35">7300E-35</option>
                    <option value="7300-52">7300-52</option>
                    <option value="7300-70" selected="">7300-70</option>
                </select>
            </td>
        </tr>
        <tr id="add-array">
            <td class="add-array">+</td>
        </tr>
    </tbody></table>

javascript/jQuery

$("body").on("click", ".remove-array", function() {
    var name = $(this).closest("tr").find(".choose-array").attr("name");
    var num = parseInt(name.substr(name.length-1));
    $(this).closest("tr").remove();
    $(".custom-includes").find("tr").each(function() {
        if ($(this).attr("id") == "add-array") {
            return;
        }
        if ($(this).find(".choose-array")) {
            var subname = $(this).find(".choose-array").attr("name");
            var subnum = parseInt(subname.substr(subname.length-1));
            if (subnum > num) {
                $(this).find(".choose-array").attr("name", "array-"+(subnum-1));
            }
        }
    });
});

Upvotes: 0

Views: 30

Answers (1)

Barmar
Barmar

Reputation: 780974

You can use .length to tell if a selector matched anything.

var choose_array = $(this).closest("tr").find(".choose-array");
if (choose_array.length > 0) {
    var name = choose_array.attr("name");
    ...
}

Upvotes: 2

Related Questions