How to focusout an html array?

Question

I want to add a focusout function to this html array.

Array:

echo '<td><input name="codemf[]" type="text" id ="codemf'.$indexofid.'" class="form-control form-control-sm" required></td>';

Focusout function:

$('#codemf[]').focusout(function () 
                {
                    if ($('#codemf[]').val() !== '') 
                    {
                        $.get("req.php?mf=", function (data) 
                        {
                            var is=0;
                            var info = data.split('|');
                            for(let i=0;i<info.length;++i)
                            {
                                if($('#codemf[]').val()==info[i])
                                {
                                    
                                    is=1;
                                }
                            }
                            if(is==0)
                            {
                                $('#codemf[]').addClass("is-invalid");
                                $('#command').attr('disabled', true);
                            } else {
                                $('#codemf[]').removeClass("is-invalid");
                                $('#command').attr('disabled', false);
                            }
                        });
                    }
                    else
                    {
                        $('#codemf[]').removeClass("is-invalid");
                        $('#command').attr('disabled', false);
                    }
                });

I tried a lot of things but nothing works... If anyone has an idea, it would save me.

By *html array* do you mean *input*? Your input is `name=codemf` and `id=codemfnnn` where *nnn* could be any value. So you can't use `#codemf` as you don't know the id. You can use `name=` but it needs to be escaped as `[]` as meaning in the selector. So needs to be `$('[name="codemf\\[\\]"')` — freedomn-m, Jun 29 '21 at 07:50
Or [more results](https://stackoverflow.com/search?q=%5Bjquery%5D+selector+with+brackets) — freedomn-m, Jun 29 '21 at 07:53

Izayoo · Answer 1 · 2021-06-29T08:11:22.907

What you are using is an id selector $('#codemf[]').

You can attach a class to all input tags that you want to have the focusout event and just use the $(this) selector to select the current element.

<input name="codemf[]" type="text" class="some-class form-control form-control-sm" required>

$(".some-class").focusout(function(){
    // do something here
    // like $(this).addClass("another-class");
});

Note that you'd have to delegate the event for it to work on dynamically added elements, so you'd have to use on().

$(".some-class").on("focusout", function(){
    // do something here
    // like $(this).addClass("another-class");
});

score 0 · Answer 2 · edited Jun 30 '21 at 15:12

I might be bad on few things so take care of what I'm saying.

!-----

this is probably your problem:

the $('#..') of Jquery take care of the ID, not the name of the element

(selector of jquery work like CSS one # for ID, for class, nothing for tag)

or as the last guy said, you can select by attribute --- $('input[name="..."]')

!----

if the id needs to be dynamic for any reason, you can add a listener on a class and get the id of the focus out element with this.id

depending on what you want you can use focus out or blur (not a mistake, just in case of a problem)

name case: I am not sure about '[]' in name propriety, most of the time I use only camel case letters and no special chars

How to focusout an html array?

2 Answers2