School Assignment? Project Due Tomorrow? Chat LIVE With A Programming Expert!

Programming Help

Web Development



What's Here?

  • Members: 306,833
  • Replies: 841,314
  • Topics: 140,566
  • Snippets: 4,465
  • Tutorials: 1,166
  • Total Online: 1,756
  • Members: 127
  • Guests: 1,629

Welcome to Dream.In.Code
Become an Expert!

Join 306,833 Programmers for FREE! Get instant access to thousands of experts, tutorials, code snippets, and more! There are 1,756 people online right now. Registration is fast and FREE... Join Now!




popup/alert with textarea/textbox value when clicking button?

 

popup/alert with textarea/textbox value when clicking button?, how to displaya popup/alert with the textbox field value?
XMEGA

14 Jan, 2009 - 07:22 PM
Post #1

D.I.C Head
**

Joined: 17 Nov, 2008
Posts: 80



Thanked: 2 times
My Contributions
So I have a function

CODE

<script type="text/javascript">
    
function disp_alert(firstName)
{
alert("firstName");
}
</script>

whatsthat.gif^ how to I bring the text from the firstName textbox area thro here???

a textbox area field
CODE

<input name="firstName" type="text" id="firstName"/>

where you enter first names example "Bob"

and a button
CODE

<input type="button" onclick="disp_alert()" value="Calculate Lucky Number" />


What I would like is when I fill out the firstName textbox area say "Bob" and then next click the button...I would like a popup/alert with the firstName text inside saying what the textbox text I just filled in being in this example "Bob"

This post has been edited by XMEGA: 14 Jan, 2009 - 07:34 PM

User is offlineProfile CardPM
+Quote Post


Christopher Elison

RE: Popup/alert With Textarea/textbox Value When Clicking Button?

14 Jan, 2009 - 07:37 PM
Post #2

D.I.C Head
**

Joined: 29 Dec, 2008
Posts: 226



Thanked: 37 times
My Contributions
Morning, buddy!

Try this, is this what you wanted?:
CODE

<html>
  <head>
    <script type="text/javascript">
      function disp_alert(firstname) {
        alert("Hello, " + firstname);
      }
    </script>
  </head>
  <body>
    <input name="firstName" type="text" id="firstName"/>
    <input type="button" onclick="disp_alert(firstName.value)" value="Calculate Lucky Number" />
  </body>
</html>
User is offlineProfile CardPM
+Quote Post

XMEGA

RE: Popup/alert With Textarea/textbox Value When Clicking Button?

14 Jan, 2009 - 08:18 PM
Post #3

D.I.C Head
**

Joined: 17 Nov, 2008
Posts: 80



Thanked: 2 times
My Contributions
worked great, any chance why I am getting a blank popup box value nothing is shown inside the alert now?


This post has been edited by XMEGA: 14 Jan, 2009 - 09:23 PM
User is offlineProfile CardPM
+Quote Post

Christopher Elison

RE: Popup/alert With Textarea/textbox Value When Clicking Button?

14 Jan, 2009 - 08:21 PM
Post #4

D.I.C Head
**

Joined: 29 Dec, 2008
Posts: 226



Thanked: 37 times
My Contributions
Could you paste me the whole HTML, one thing I have noticed is you need to end statements in JavaScript with a semi colon.
User is offlineProfile CardPM
+Quote Post

Christopher Elison

RE: Popup/alert With Textarea/textbox Value When Clicking Button?

14 Jan, 2009 - 08:32 PM
Post #5

D.I.C Head
**

Joined: 29 Dec, 2008
Posts: 226



Thanked: 37 times
My Contributions
Modified it slightly, I tried it, think it works, tried my name 'chris' and size 9 and got 45 in the alert.

CODE

  <head>
    <script type="text/javascript">
      function display(luckyNumber) {
        var firstNameLength = firstName.value.length;
        var shoeSizeValue = shoeSize.value;
        var luckyNumber = firstNameLength * shoeSizeValue;
        alert(luckyNumber);
      }
    </script>
  </head>


Am I right in thinking you want to replace using the alert and putting the lucky number in that lucky number textfield? If so, you can replace the alert(luckyNumber); line with:

CODE

   document.getElementById("luckyNumber").value = luckyNumber;


With that added, you'll be able to calculate the lucky number on the page and it'll appear in the text box.

This post has been edited by Christopher Elison: 14 Jan, 2009 - 08:37 PM
User is offlineProfile CardPM
+Quote Post

XMEGA

RE: Popup/alert With Textarea/textbox Value When Clicking Button?

14 Jan, 2009 - 08:50 PM
Post #6

D.I.C Head
**

Joined: 17 Nov, 2008
Posts: 80



Thanked: 2 times
My Contributions
yes at the end the lucky number will appear there but I am still having problems with the popup with the changes now when I click the button nothing appears no popup/alert even???

is the button correct seems you didn't modify it only the head stuff
CODE

<input type="button" onclick="display(luckyNumber.value)" value="Calculate Lucky Number" />


I added the semi colons which I was missing but now nothing lol?

This post has been edited by XMEGA: 14 Jan, 2009 - 08:52 PM
User is offlineProfile CardPM
+Quote Post

Christopher Elison

RE: Popup/alert With Textarea/textbox Value When Clicking Button?

14 Jan, 2009 - 08:52 PM
Post #7

D.I.C Head
**

Joined: 29 Dec, 2008
Posts: 226



Thanked: 37 times
My Contributions
I only changed the head, I'll paste my working example, this works in my Firefox, notice I moved the 'var' lines inside the function:

CODE

<html>
  <head>
    <script type="text/javascript">
      function display(luckyNumber) {
        var firstNameLength = firstName.value.length;
        var shoeSizeValue = shoeSize.value;
        var luckyNumber = firstNameLength * shoeSizeValue;
        alert(luckyNumber);
      }
    </script>
  </head>
  <body>
  <form action="" method="get" name="myForm" id="myForm">
  <table width="1400" border="1">
    <tr>
      <td>First Name:</td>
      <td><input name="firstName" type="text" id="firstName"/></td>
    </tr>
    <tr>
      <td>Gender:</td>
      <td><input name="gender" type="text" id="gender"/></td>
    </tr>
    <tr>
      <td>Shoe Size:</td>
      <td><input name="shoeSize" type="text" id="shoeSize"/></td>
    </tr>
    <tr>
      <td><input type="button" onclick="display(luckyNumber.value)" value="Calculate Lucky Number" /></td>
      <td> </td>
    </tr>
    <tr>
      <td>Lucky Number:</td>
      <td><input name="luckyNumber" type="text" id="luckyNumber"/></td>
    </tr>
  </table>
  </form>
  </body>
</html>


This post has been edited by Christopher Elison: 14 Jan, 2009 - 08:54 PM
User is offlineProfile CardPM
+Quote Post

Christopher Elison

RE: Popup/alert With Textarea/textbox Value When Clicking Button?

14 Jan, 2009 - 09:04 PM
Post #8

D.I.C Head
**

Joined: 29 Dec, 2008
Posts: 226



Thanked: 37 times
My Contributions
Oh, hang on, I've just tried it in Internet Explorer and it's giving the error:

Line: 5
'firstName' is undefined.

Fixed it! Here you go, slightly modified code:
CODE

  <script type="text/javascript">
      function display(luckyNumber) {
        var firstNameLength = document.getElementById("firstName").value.length;
        var shoeSizeValue   = document.getElementById("shoeSize").value;
        var luckyNumber = firstNameLength * shoeSizeValue;
        alert(luckyNumber);
      }
    </script>


This will now work on both IE and Firefox biggrin.gif

This post has been edited by Christopher Elison: 14 Jan, 2009 - 09:05 PM
User is offlineProfile CardPM
+Quote Post

XMEGA

RE: Popup/alert With Textarea/textbox Value When Clicking Button?

14 Jan, 2009 - 09:13 PM
Post #9

D.I.C Head
**

Joined: 17 Nov, 2008
Posts: 80



Thanked: 2 times
My Contributions
I am sure it works in firefox fine I have had issues before but for some funny reason I turned on script debuggin on IE and it says line 10 char 9 "firstName" is undefined??? werid I don't see the issue...great thanks for dey help my next steps are to make gender radiobuttons and if male display the lucky number in blue and if female in pink...thanks again smile.gif
User is offlineProfile CardPM
+Quote Post

Christopher Elison

RE: Popup/alert With Textarea/textbox Value When Clicking Button?

14 Jan, 2009 - 09:30 PM
Post #10

D.I.C Head
**

Joined: 29 Dec, 2008
Posts: 226



Thanked: 37 times
My Contributions
No problem, and thanks for the icon_up.gif biggrin.gif

By the way, I think we were getting those errors because we should have been using document.getElementById("blah").value to extract a field's value, but we got there in the end smile.gif
User is offlineProfile CardPM
+Quote Post

Fast ReplyReply to this topicStart new topic

Time is now: 11/20/09 10:56PM
Invision Power Board v2.1.7 © 2009  IPS, Inc.
Licensed to: MediaGroup1

Live Help!

Be Social

Dream.In.Code RSS Feed Dream.In.Code LinkedIn Group Follow Us On Twitter Fan Us On Facebook

Tutorials

Programming

Web Development

Reference Sheets

Code Snippets

DIC Chatroom

Bye Bye Ads

Monthly Drawing

Thumb Drive

Top Contributors

Top 10 Kudos This Month