Check if the textfields is null in Jquery

Question

Im trying to check if the textfields is null using jquery, but its not working, The textfields is dynamically created and has name quiztxtBox[], with bracket, indicating it is an array, and when a certain field is null the textfield will turn red,. but the problem is it is not working, hmmm Here is my codes

$("#quiztxtBox[]").each(function()
              {
                  if($("#quiztxtBox[]").val()=="")
                  {
                      $("#quiztxtBox[]").nextAll('span').html("Field needs filling");
                      $("#quiztxtBox[]").css({"background-color":"#f6d9d4"});

                  }
          });

EDIT
This is the html codes, the span part is not working, I wonder why, this is the html for dynamically creating textboxes..

<div id="QuestionTBDiv1" >
                                        <label>Question</label><br/>
                                        <input type="text" name="quiztxtBox[]" size="57" id="quiztxtBox[]" placeholder="Question #1"><br/>
                                        <label>Answer</label><br/>
                                        <input type="text" name="quiztxtBox[]" size="24" id="answer[]" placeholder="Choice A">&nbsp;<input type="radio" class = "choiceA" name="correct_answer1" value="A">&nbsp;
                                        <input type="text" name="quiztxtBox[]" size="24" id="answer[]" placeholder="Choice B">&nbsp;<input type="radio" class = "choiceB" name="correct_answer1" value="B"><br/>
                                        <input type="text" name="quiztxtBox[]" size="24" id="answer[]" placeholder="Choice C">&nbsp;<input type="radio" class = "choiceC" name="correct_answer1" value="C">&nbsp;
                                        <input type="text" name="quiztxtBox[]" size="24" id="answer[]" placeholder="Choice D">&nbsp;<input type="radio" class = "choiceD" name="correct_answer1" value="D"><br>
                                        <span name="errMchoice" class="errorMsg"></span>
                                        </div>

@ArunPJohny you should consider answering this way as of OP comments to the answer this works perfect. — Bhojendra Rauniyar
– Bhojendra Rauniyar, Commented Feb 3, 2014 at 9:06
Note that no matter what selector you use, .val() will only ever return the value of the first element in the selector's elements. — UweB
– UweB, Commented Feb 3, 2014 at 9:11

hsz · Accepted Answer · 2014-02-03 09:00:14Z

1

Try with:

$("[name='quiztxtBox[]']").each(function(){
  if ($(this).is(':empty')) {
    $(this).nextAll('span').html("Field needs filling");
    $(this).css({"background-color":"#f6d9d4"});
  }
});

answered Feb 3, 2014 at 9:00

hsz

153k63 gold badges269 silver badges320 bronze badges

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

3 Comments

user2901740 Over a year ago

Hi, this works except for this part $(this).nextAll('span').html("Field needs filling");

hsz Over a year ago

@user2901740 I don't see your HTML, so I cannot help you/

user2901740 Over a year ago

well, it is consist ko 4 textbox and 1 span tag, 4 textbox and 1 tag so on .. How I wish I can post it here.. hmm

ReNiSh AR · Accepted Answer · 2014-02-03 09:08:27Z

0

Try this:

change id to class that is, change id="#quiztxtBox[]" to class=".quiztxtBox" then,

$(".quiztxtBox").each(function()
{
    if($(this).val()=="")
    {
         $(this).nextAll('span').html("Field needs filling");
         $(this).css({"background-color":"#f6d9d4"});
    }
});

i think you need this:

check demo @ http://jsfiddle.net/renishar/S73gq/

edited Feb 3, 2014 at 9:08

answered Feb 3, 2014 at 9:01

ReNiSh AR

2,8623 gold badges34 silver badges43 bronze badges

Collectives™ on Stack Overflow

Check if the textfields is null in Jquery

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related