[Last Call] Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

Javscript text box value problem with getElementById()

Posted on 2007-10-05
9
Medium Priority
?
2,676 Views
Last Modified: 2008-01-09
I have the following code in the document head:

<script language="JavaScript">
     function uploadAll(){                  
            //check for non blank or default value
            var y=document.getElementById('newAlbumName');
            if(y.value=="" || y.value=="Enter Album Name"){
                  alert("Album Name Required yval="+y.value);
                  return false;
            }
      }

</script>

And in the body:

<form>
<input id="newAlbumName" type=text name='newAlbumName' value="Enter Album Name">
<input type="button" value="UploadAll" onClick="uploadAll();">
</form>

When I enter "1234" into the text box and click the UploadAll button, the alert says "Album Name Required yval=".  It seems that y.value is NULL, why is this?  How can I get the value of the text box to be in the alert, ie. "Album Name Required yval=1234"

Thanks.
0
Comment
Question by:burnsj2
  • 5
  • 3
9 Comments
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 20026231
You have to move the alert outside of the if.

     function uploadAll(){                  
            //check for non blank or default value
            var y=document.getElementById('newAlbumName');
            alert("Album Name Required yval=" + y.value);
            if(y.value=="" || y.value=="Enter Album Name"){
                  alert("Album Name Required yval="+y.value);
                  return false;
            }
      }

That first alert will always appear, even if 1234 is the value.  In the second case the alert will only show if the value is blank or that default phrase.

Let me know if you have a question or need more info.

bol
0
 
LVL 25

Accepted Solution

by:
devic earned 1000 total points
ID: 20026238
if you are working with a form, use form object model (without getElementById)

e.g.
=============================================
<script language="JavaScript">
function uploadAll(obj)
{                  
      //check for non blank or default value
      var y = obj.form.newAlbumName;
      if(y.value == "" || y.value == "Enter Album Name")
      {
            alert("Album Name Required");
            return false;
      }
      else
      {
            alert("thanks! \n ------------- \n" + y.value);
      }
}
</script>

<form>
<input id="newAlbumName" type=text name='newAlbumName' value="Enter Album Name">
<input type="button" value="UploadAll" onClick="uploadAll(this);">
</form>
0
 
LVL 1

Author Comment

by:burnsj2
ID: 20026273
b0lsc0tt: the second alert is always appearing because the y.value is always NULL
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 20026303
What Javascript error are you getting then?  What does the rest of the html and script look like?  That input element is the only one with an id of newAlbumName, right?

Using the form, like suggested above, is another way to do this but it seems like you have a bigger problem here.  I don't see a reason, in the snippet you have provided, for the value not being available.  There is certainly no reason for it to be Null.  Even a blank input would just be empty not Null.

bol
0
 
LVL 1

Author Comment

by:burnsj2
ID: 20026310
devic: this doesn't seem to work
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 20026330
I put the snippets above in a valid html file and it works fine for me, like expected.  The problem is in some caused by some other part of the page, other script, or another element.

Let us know more about the page or try to use the general info I provided to id the specific issue.  Let me know if you want the html I used or have a question.

bol
0
 
LVL 1

Author Comment

by:burnsj2
ID: 20026405
Ok, I got the object model working.  (The real document is a lot more complex).  Thanks.
Any Idea why getElementById() doesn't work?
0
 
LVL 54

Assisted Solution

by:b0lsc0tt
b0lsc0tt earned 1000 total points
ID: 20026414
A duplicate ID is the most likely cause.  Really without more info it is just a guess (although being an expert means our guesses are pretty good). :)

I'm glad it's working.

bol
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 20026890
I'm glad I could help.  Thanks for the grade, the points and the fun question.

bol
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
A quick Powershell script I wrote to find old program installations and check versions of a specific file across the network.
Learn the basics of strings in Python: declaration, operations, indices, and slicing. Strings are declared with quotations; for example: s = "string": Strings are immutable.: Strings may be concatenated or multiplied using the addition and multiplic…
Learn the basics of lists in Python. Lists, as their name suggests, are a means for ordering and storing values. : Lists are declared using brackets; for example: t = [1, 2, 3]: Lists may contain a mix of data types; for example: t = ['string', 1, T…
Suggested Courses
Course of the Month17 days, 21 hours left to enroll

831 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question