Javascript $.inArray is not working

Question

I have an existing table and I want to prevent the same data add to existing table.
My Question : Why when I click "create new user" button, the result is always alert "not found" ?

here is the code: HTML:

<div id="users-contain" class="ui-widget">
    <h1>Existing Users:</h1>
    <table id="users" class="ui-widget ui-widget-content">
        <thead>
            <tr class="ui-widget-header ">
                <th>Name</th>
                <th>Email</th>
                <th>Password</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>guruh</td>
                <td>[email protected]</td>
                <td>123456</td>
            </tr>
            <tr>
                <td>edo</td>
                <td>[email protected]</td>
                <td>123456</td>
            </tr>
        </tbody>
    </table>
</div>
<button id="create-user">Create new user</button>

jQuery

    $(function() {
        var name = $( "#name" ),
            email = $( "#email" ),
            password = $( "#password" ),
            allFields = $( [] ).add( name ).add( email ).add( password ),
            tips = $( ".validateTips" );

        function checkExisting2(o) {
            var arr = [];
            $('#users-contain tr').each(function() {

                if (!this.rowIndex) return;
                var  Id = $(this).find("td").eq(0).html();    

                arr.push(Id);
           });

            if ( $.inArray(o,arr) > -1) {
                return false;
            } else {
                return true;
            }
        }

        $( "#dialog-form" ).dialog({
            autoOpen: false,
            height: 300,
            width: 350,
            modal: true,
            buttons: {
                "Create an account": function() { 
                    var bValid = true;

                    bValid = bValid && checkExisting2(name);

                    if ( bValid ) {
                        alert("not found");
                        $( "#users tbody" ).append( "<tr>" +
                            "<td>" + name.val() + "</td>" + 
                            "<td>" + email.val() + "</td>" + 
                            "<td>" + password.val() + "</td>" +
                        "</tr>" ); 
                        $( this ).dialog( "close" );
                    } else {
                        alert("found");
                    }
                },
                Cancel: function() {
                    $( this ).dialog( "close" );
                }
            },
            close: function() {
                allFields.val( "" ).removeClass( "ui-state-error" );
            }
        });

        $( "#create-user" )
            .button()
            .click(function() {
                $( "#dialog-form" ).dialog( "open" );
            });
    });

$("#name") is null: there's no id "name" in the HTML you posted. — frenchie
– frenchie, Commented Oct 17, 2012 at 22:01
@frenchie $('#name') will return an empty jquery object not null. — Amareswar
– Amareswar, Commented Oct 17, 2012 at 22:02
@Amareswar: true, an empty object. Either way, I think that's one of the problems with this code. — frenchie
– frenchie, Commented Oct 17, 2012 at 22:03
This line of code is evil!!!!!! if (!this.rowIndex) return; Use braces man! — frenchie
– frenchie, Commented Oct 17, 2012 at 22:05

frenchie · Accepted Answer · 2012-10-17 22:13:24Z

1

When you write this line:

bValid = bValid && checkExisting2(name);

There's nothing in the code that indicates that name points to anything useful because

var name = $("#name")

points to an empty object.

Also, when you write this:

if (!this.rowIndex) return;

It'll work but it's considered bad form; try this instead:

if (!this.rowIndex) { 
   return; 
}

That way, there's no confusion possible about the code when someone else reads it. Also, all this is redundant:

var bValid = true;
bValid = bValid && checkExisting2(name);
if ( bValid ) { .... }

is equivalent to:

if (checkExisting2(name)) { ... }

edited Oct 17, 2012 at 22:13

answered Oct 17, 2012 at 22:07

frenchie

52.3k117 gold badges321 silver badges532 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

redShadow Over a year ago

good point, altough I think he cut the code a bit (eg. the whole form part is missing)

frenchie Over a year ago

@redShadow: that might be the case.

guruh Over a year ago

thank you very much, I forgot to write code $("#name").val(); and it solved the problem.

redShadow · Accepted Answer · 2012-10-17 22:07:17Z

Why are you building the whole array and then iterating it again to check whether it contains the id?

Just use something like this:

    function checkExisting2(o) {
        var rows = $('#users-contain tr'),
            row = null;
        for (var i=1; i<rows.length; i++) {
            if (rows[i].find('td')[0].html() == o)
                return true;
        }
        return false;
    }

Anyways, I'm unsure why your version doesn't work.. try debugging a bit, by placing the word

debugger

on its own line, just before you call $.inArray. Then run the script: when execution gets there, you'll enter debug mode and you can see for sure what's in arr and o.

Side note

var bValid;
bValid = bValid && checkExisting2(name);

is perfectly equivalent to:

var bValid = checkExisting2(name);

(unless, of course, you cut out some code in between the two lines)

Collectives™ on Stack Overflow

Javascript $.inArray is not working

2 Answers 2

3 Comments

Side note

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Side note

Comments

Your Answer

Sign up or log in

Post as a guest

Related