Add a carrage return to a dropdown value.

NoviceJavaUser · May 19, 2004

Hello there,

I am fairly new to Javascript, all i want to do is add a carrage return to a value, IE when a dropdown option is selected, it writes some text in a text box, but i cannot get it to automatically carrage return so that when the next text box is selected it starts on a new line.

here is the code....

<html>

<head>
<meta http-equiv="Content-Language" content="en-gb">
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
<SCRIPT type="text/javascript">

<!--

function putText(addText) {

var addText;
var revisedMessage;
var currentMessage = document.templates.messageBox.value;
revisedMessage = currentMessage+addText;
document.templates.messageBox.value=revisedMessage;
document.templates.messageBox.focus();
return;
}

</script>
</head>

<body>

<p>   </p>
<form method="POST" name="templates">

<p>Is the PSTN OK?<select size="1" name="PSTN" tabindex="1" onChange="putText(this.value)">
<option selected value>*</option>
<option value='The PSTN is working OK.'>Yes</option>
<option value='The PSTN is not working.'>No</option>
</select></p>

<p>Has the service ever worked?<select size="1" name="Worked" tabindex="2" onChange="putText(this.value)">
<option selected>*</option>
<option value="The Service Has Worked in the past.">Yes</option>
<option value="The Service Has Never Worked.">No</option>
</select></p>

<p>
<textarea cols="50" rows="15" name="messageBox" wrap="virtual" class="text"></textarea></p>

<p>
<input type="reset" value="Reset" name="B1"></p>

</form>

<p> </p>
<p> </p>
 </body></html>

Additional to that, it would be useful if i could have a window.alert when certain options are selected, IE if you were to say no to a particular question, it pops up an alert warning the user to do something, but does not pop up if they select yes option.

I look forward to your help.

klaz2002 · May 19, 2004

First don't use IE when desc. your problem (I thought you were saying 'in IE Internet Explorer.....').

Why not add the text '\n' (carrage return) to your addText var.
ex.
var newText = "\n" + addText;

Hope that this helps.

NoviceJavaUser · May 19, 2004

Sorry about using "IE"!

This is also the first time i have used a forum!!

However, saying that, you seem to have solved the problem! I had already tried using \n in lots of other places, but didn't think of adding it as another variable, thank you very much for your quick response.

Have you any idea on the second half of my question? (At the end of the code!)

BillyRayPreachersSon · May 20, 2004

>> First don't use IE when desc. your problem (I thought you were saying 'in IE Internet Explorer.....')

Klaz, I think it was pretty obvious that it was a reference to "i.e." and not "Internet Explorer" - just look at the context in which it was used.

NoviceJavaUser, I think that you should reduce the values in your select boxes from a whole sentence to some value that you can easily test - such as "Y" and "N", etc - that way, you can easily see if the user has selected "No", and do the alert accordingly.

Hope this helps,
Dan

NoviceJavaUser · May 20, 2004

Billy Ray,

Not too sure why you are asking me to do that??? the problem is, i'm not sure how to get the window.alert to work if the user was to select "NO" for example. But if they where to selct "YES" then it would NOT show the alert.
I've managed to do it with checkboxes, but these are not suitable in this form i am creating, i need to use dropdown boxes.

What i am trying to do, is create a checklist of about 15 different questions that the user will have to do, some will be "YES or NO" and some will be multiple choice, and as the questions are answered it creates the checklist for them automatically, (to help save them writing it all up and to increase the quality and consistency of our notes) but when a certain option is picked i want an alert to prompt them to do something else.

It's going to be a fairly complex form in the end, and i will want to be adding some "if" and "else" commands to it aswell... but i need to get the alerts sorted first!

BillyRayPreachersSon · May 20, 2004

>> Not too sure why you are asking me to do that

I thought I made it very clear why I suggested that - so that you had a common set of values to test within your putText function, rather than having to test for many different sentences.

Of course, if the text is never going to be anything other than "Yes" or "No", you could test on that instead. Your call!

Hope this helps,
Dan

NoviceJavaUser · May 20, 2004

I think we may have our wires crossed here....

The putText function is fine, it writes what i want it to in the big text box on the other side of the screen and in the correct order.

So you could say my form is fine. However, at the moment it has NO window.alert functions, and this is what i want to add, but as i said i'm not sure where to put the code when a certain option is selected...

BillyRayPreachersSon · May 20, 2004

>> i'm not sure where to put the code when a certain option is selected

You would add that code to the putText function, as that is what is called when the select box selection is changed.

Dan

NoviceJavaUser · May 20, 2004

Ah i see i see i see!!

Sorry!

I did say i was a novice!!

OK, got the window.alert working, have changed the values to "yes" and "no" for now... but the alert is popping up whichever option i select... how do i tell it only to pop up on "NO"??

PS Many thanks for your quick responses, much appreciated!

<CODE>

function putText(addText) {

var addText;
var newText = addText + "\n";
var revisedMessage;
var currentMessage = document.templates.messageBox.value;
revisedMessage = currentMessage+newText;
document.templates.messageBox.value=revisedMessage;
document.templates.messageBox.focus();
window.alert ("YOU SHOULD ONLY SEE THIS IF YOU SELECT NO!")
return;
}

BillyRayPreachersSon · May 20, 2004

Changing this:

Code:

window.alert ("YOU SHOULD ONLY SEE THIS IF YOU SELECT NO!")

to this:

Code:

if (addText.toLowerCase()=='no') window.alert ('YOU SHOULD ONLY SEE THIS IF YOU SELECT NO!');

Should work. You will also need to remove this line from the function:

Code:

var addText;

It isn't needed, as "addText" is already defined (as a parameter).

Hope this helps,
Dan

NoviceJavaUser · May 20, 2004

Excellent!!

That works fine, however i need to change the variables back to the long sentences, and these are a mix of upper and lowercase and numerical characters, so i changed:

Code:

if (addText.toLowerCase()=='no') window.alert ('YOU SHOULD ONLY SEE THIS IF YOU SELECT NO!');

to

Code:

if (addText=='no') window.alert ('YOU SHOULD ONLY SEE THIS IF YOU SELECT NO!');

and this seems to work fine with mixed case variables.

Unless you can see forseeable problems??

I have now added a list of 4 different conditions.

And they work fine... Thank you very much Dan!

I wonder if you could help with one more thing??

As you can see now, i have 2 dropdown boxes, 1 with condition "A" or "B" and one with condition "C" or "D" (Just to make things simpler for now!) and each of these pop up an alert, however, i would like one more thing to happen, If the user where to pick say condition B and then condition D, it would display the original "B & D" messages PLUS an additional Condition E message. Is this possible Dan???

Here is the code now as it stands...

Code:

<html>

<head>
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Is the PSTN OK</title>
<SCRIPT type="text/javascript">

<!--

function putText(addText) {

var newText = addText + "\n";
var revisedMessage;
var currentMessage = document.templates.messageBox.value;
revisedMessage = currentMessage+newText;
document.templates.messageBox.value=revisedMessage;
document.templates.messageBox.focus();
if (addText=='Condition A') window.alert ('Condition A Alert');
if (addText=='Condition B') window.alert ('Condition B Alert');
if (addText=='Condition C') window.alert ('Condition C Alert');
if (addText=='Condition D') window.alert ('Condition D Alert');
return;

}


</script>

</head>

<body>
<p>&nbsp;&nbsp; </p>
<form method="POST" name="templates">

<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%" id="AutoNumber1">
  <tr>
    <td width="50%" valign="top">
    <p align="left">Select Condition 1:<select size="1" name="PSTN" tabindex="1" onChange="putText(this.value)">
  <option selected value>*</option>
  <option value='Condition A'>A</option>
  <option value='Condition B'>B</option>
  </select></p>
    <p align="left">Select Condition 2<select size="1" name="Worked" tabindex="2" onChange="putText(this.value)">
  <option selected>*</option>
  <option value='Condition C'>C</option>
  <option value='Condition D'>D</option>
  </select><p align="left">&nbsp;</td>
    <td width="50%" valign="top">
  <textarea cols="50" rows="15" name="messageBox" wrap="virtual" class="text"></textarea><p>
  <input type="reset" value="Reset" name="B1"></td>
  </tr>
</table>


<p>&nbsp;</p>

</body>

</html>

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Add a carrage return to a dropdown value.

NoviceJavaUser

Programmer

klaz2002

Programmer

NoviceJavaUser

Programmer

BillyRayPreachersSon

Programmer

NoviceJavaUser

Programmer

BillyRayPreachersSon

Programmer

NoviceJavaUser

Programmer

BillyRayPreachersSon

Programmer

NoviceJavaUser

Programmer

BillyRayPreachersSon

Programmer

NoviceJavaUser

Programmer

Similar threads

Part and Inventory Search

Sponsor