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!

Register Log in
  • Congratulations IamaSherpa on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Swapping values 2

Status
Not open for further replies.
ScrabbleKing

ScrabbleKing

Programmer
Mar 11, 2007
20
US
How do I get nowSel and prevSel to swap each time the 'Swap' button is pressed (and only if both nowSel and prevSel have values)?

Code: 
<script type="text/javascript">
var selected=false;
function showSel(s){
var t1=s.form['prevSel'];
var t2=s.form['nowSel'];
selected?t1.value=selected:null;
selected=s.options[s.selectedIndex].text;
t2.value=selected;
}
</script>
<body>
<form>
Previous selected<input type="text" readonly="readonly" name="prevSel">
<br>
<br>
<select id="selSeaShells" onchange="showSel(this)">
			<option value="val0">sea zero</option>
			<option value="val1">sea one</option>
			<option value="val2">sea two</option>
			<option value="val3">sea three</option>
			<option value="val4">sea four</option>
</select>
<br>
<br>
Now selected<input type="text" readonly="readonly" name="nowSel">
<br>
<br>
<INPUT TYPE="button" VALUE="Swap" onclick="swapSel();">
</form>
</body>
 
Sort by date Sort by votes
Why not simply store the value of one in a temporary variable, copy the value of the other over the one you're just stored, and then copy the temporary variable into the other one?

There is no magical "swap" command in JS to do this for you.

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
 
Upvote 0 Downvote
If your code example was copied and pasted here, you have some typos and/or other mistakes that will prevent it from working correctly. If you didn't copy and paste, then please do that so we can see what you really have.

Lee
 
Upvote 0 Downvote
What does this mean?
Code: 
selected?t1.value=selected:null;

You have an argument in your function that you use in the function, but don't pass a value to it. There are also several other things that are incorrect, and the original code overall is just a mangled mess.

Using Dan's idea (which I agree with completely)
Code: 
function showSel()
{
var els = document.forms[0].elements;
var swapvalue = els['nowSel'].value;
els['nowSel'].value = els['prevSel'].value;
els['prevSel'].value = swapvalue;
}

Lee
 
Upvote 0 Downvote
Thank you Lee. I added your code and renamed the function to swapSel. It works great for swapping the values, but when selecting from the dropdown again the prevSel does not get updated (unless you hit the 'swap' button an even number of times).

Also, to answer your question,
What does this mean?
Code: 
selected?t1.value=selected:null;
Click to expand...
It is a ternary operator, the short notation for an if-else statement.
Code: 
if(selected){
t1.value=selected;
}
else{
null; // do nothing
}
Prevents the writing of a value first time when changing the option, as the first time there is no previous selected option.

I gave you a star. Yet, how do we solve the issue of after swapping the values with the 'swap' button, making sure prevSel updates when selecting from the dropdown again?

Here is the current code:
Code: 
<script type="text/javascript">
var selected=false;
function showSel(s){
var t1=s.form['prevSel'];
var t2=s.form['nowSel'];
selected?t1.value=selected:null;
selected=s.options[s.selectedIndex].text;
t2.value=selected;
}

function swapSel(s)
{
var els = s.form.elements;
var swapvalue = els['nowSel'].value;
els['nowSel'].value = els['prevSel'].value;
els['prevSel'].value = swapvalue;
}
</script>
<body>
<form>
Previous selected<input type="text" readonly="readonly" name="prevSel">
<br>
<br>
<select id="selSeaShells" onchange="showSel(this)">
			<option value="val0">sea zero</option>
			<option value="val1">sea one</option>
			<option value="val2">sea two</option>
			<option value="val3">sea three</option>
			<option value="val4">sea four</option>
</select>
<br>
<br>
Now selected<input type="text" readonly="readonly" name="nowSel">
<INPUT TYPE="button" VALUE="Swap" onclick="swapSel(this);">
</form>
</body>
 
Upvote 0 Downvote
Try removing the "selected" variable, and using these two replacement functions:

Code: 
function showSel(s) {
	swapSel(s, true);
	s.form['nowSel'].value = s.options[s.selectedIndex].text;
}

function swapSel(s, force) {
	var els = s.form.elements;
	var swapvalue = els['nowSel'].value;
	var curvalue = els['prevSel'].value;

	if ((swapvalue != '' && curvalue != '') || force === true) {
		els['nowSel'].value = curvalue;
		els['prevSel'].value = swapvalue;
	}
}

They seem to do everything you've asked:

- Swap the two values (only if they are both non-blank)
- When a new value is chosen, move the current one from "now" to "prev", and update "now" with the new one.

I think your "selected" variable was just making things harder.

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
 
Upvote 0 Downvote
BillyRayPreachersSon,

THANK YOU VERY MUCH! That worked perfectly. Sorry for the delay in responding. I have not checked back since my last post. Thank you Dan! I am giving you a star also.
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

waubain
  • Locked
  • Question
Syntax help to create values list for table column
Replies
1
Views
143
waubain
waubain
jason.lex
  • Locked
  • Question
How do I edit this code to also count the checkboxes checked and total values
Replies
3
Views
163
jason.lex
jason.lex
rk68
  • Locked
  • Question
Javascript to sum values
Replies
5
Views
99
feherke
feherke
corexdev
  • Locked
  • Question
Adding Dropdown Form Values
Replies
5
Views
120
ChrisHirst
ChrisHirst
axLW
  • Locked
  • Question
Reset input and select form values
Replies
2
Views
138
ChrisHirst
ChrisHirst

Part and Inventory Search

Sponsor

Back
Top