How to give a value of 1 to a textbox with a class

Go To StackoverFlow.com

-2

I want to know if the code below removes all input type='text' values back to "":

var inp = document.getElementsByTagName('input');
for (var i = inp.length - 1; i >= 0; i--) {
    if ('text' === inp[i].type) inp[i].value = "";
}

Then I want to know if I have an input which is type='text' but which class is .num_questions. How can I code that so that it looks for the class name and gives it a value of "1"?

2012-04-05 17:16
by user1304948
Umm... TIAS - Madara Uchiha 2012-04-05 17:18
@jbabey what does that have to do with anything... He's obviously tried something - Madara Uchiha 2012-04-05 17:19
@Truth a half-decent google, combined with your comment, will solve all of his problems - jbabey 2012-04-05 17:21
I have tried this: var inp = document.getElementsByClassName('num_questions'); if ('text'===inp.type) inp.value = "1";. But what do I replace 'text' with in the if statemen - user1304948 2012-04-05 17:25
hint: condition for if statement is if(condition){code... - Kevin Bowersox 2012-04-05 17:31
I don't know why you are getting your Q downvoted, and I don't know why people are suggesting to close it. It seems a reasonable question to me. If people don't want to answer, don't answer - Cheeso 2012-04-05 17:42
@Cheeso: Are you serious? First part of the question: Here's some code, does it work?. Second part of the question: Here's what I want. Show me the codes.. It's a terrible disservice to StackOverflow when questions like this get upvotes (or answers for that matter) - NoName 2012-04-05 18:06
I don't get it. "Here's what I want, can you suggest code?" is basically the standard format for 98% of stackoverflow questions. That is the raison d'etre of this site. Like I said, if you don't want to answer, don't. I don't understand the hostility toward this user or question - Cheeso 2012-04-05 18:38
@Cheeso: Downvoting is not hostility. It's site maintenance for those who care to make it a more useful site. Haven't you noticed that when asking a question, potentially related questions are offered? Or that such potentially related questions are listed on the right of this page? Or that the faq states "Please look around to see if your question has been asked before."? Or that the how to ask page states "Do your homework. Have you thoroughly searched for an answer before asking your question?..." - NoName 2012-04-05 19:22


1

Well, i don't think your question should be downvoted, handling classNames is not easy in javascript. So here is my answer:

var inp = document.getElementsByTagName('input');
for (var i = inp.length-1; i>=0; i--) {
   if ('text'===inp[i].type) {
      if(inp[i].className.indexOf('num_questions') > -1){
         inp[i].value = "1";
      } else{
         inp[i].value = "";
      }
   }
}
2012-04-05 17:39
by André Alçada Padez
I agree that there is no need to downvote the question. But I think the answer could be a little better. In the edge case, if the class he is looking for is "numquestions" and the class on the element is "numquestions1" then your test will yield a false positive. In many cases this may be not worth worrying about, but in the general case the test will fail - Cheeso 2012-04-05 17:40
you are right, no doubt about it. I didn't want to go through the regExp path, since the user seems like a beginner. And i assume that the site will be simple enough to not have overlapping classes... either way, you are righ - André Alçada Padez 2012-04-05 17:42


2

There is a property className on the Html Dom Element.

function hasCssClass(elt,clz) {
    return elt.className.match(new RegExp('(\\s+|^)'+clz+'(\\s+|$)'));
}

var inp = document.getElementsByTagName('input'); 
for (var i = inp.length-1; i>=0; i--) { 
  if ('text'===inp[i].type && hasCssClass(inp[i],'num_questions')) {
       inp[i].value = "?"; 
  }
} 

http://jsbin.com/aluzuv/2

EDIT - followup as requested.

Each HTML DOM Element has a className property, which is a string, containing a list of whitespace-separated CSS classes that apply to the element. In order to determine if a class applies to a particular element, you need to search for that string, in the list.

There are a couple ways to do it. One way is to split the className string by whitespace, and then see if your desired class (needle) is equal to any of the elements in the resulting string array. This might be something like this:

function hasCssClass(elt, clz) {
  var classes = elt.className.split(/\s+/);
  for(i=0; i<classes.Length;i++) {
     if (clz == classes[i]) return true;
  }
  return false;
}

Another way is to use a regex match; that's what I did, because to me it's more succint. The regex I used looks for something, followed by the classname, followed by something else. The first something is (\\s+|^) , which in English means "one or more whitespace characters, OR, the beginning of the string." The something else is (\\s+|$), which in English is, "one or more whitespace characters, OR the end of the string." Therefore, the entire regex matches a string which consists of:

  • whitespace or beginning-of-string
  • desired classname
  • whitespace or end-of-string
2012-04-05 17:39
by Cheeso
+1 bonus if you walkthrough the rege - Kevin Bowersox 2012-04-05 18:04
As requested. Not for the +1; I'm just glad to help - Cheeso 2012-04-05 18:50
still get the +1 thanks for going through tha - Kevin Bowersox 2012-04-05 18:56
Ads