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!

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

Attempting to Parse - but keep getting NAN 1

Status
Not open for further replies.

fedtrain

Instructor
Jun 23, 2004
142
US
Background -
We are building a web page that has a series of questions and instructions to find the answers. When the tech is done, they click the yes or no button to move on.
There are also back buttons incase the tech needs to go back. The problem is that multiple questions can lead to the same result...so the back button needs to know what to do.

This was my first shot:
Code:
  function backButton(thisLink) {
       hideBack = document.getElementById(thisLink);
       showLast = document.getElementById(lastLink);
       hideBack.style.display = hideBack.style.display = "none";
       showLast.style.display = showLast.style.display = "block";
		}

The variable lastLink is set earlier as a global variable
Code:
var lastLink = ""
function hideRows(matrix,inStr,oldLink) {
   lastLink=oldLink;
   ((code continues....))

This works great, until you attempt to use another back button. Then lastLink and thisLink become the same. So no go.
Then I decided, that at this point...to get the page done...I would just decrement the values for all the rest of the back buttons. (This is only needed until they hit another yes or no...so not a big deal for launch.)

This is my attempt that is not working:
Code:
function backButton(thisLink) {
if (thisLink != lastLink){
    hideBack = document.getElementById(thisLink);
    showLast = document.getElementById(lastLink);
    hideBack.style.display = hideBack.style.display = "none";
    showLast.style.display = showLast.style.display = "block";
    }
else {
	nextRow = parseInt(thisLink);
	showRow = document.getElementById("internetThreeArow" + nextRow );
        hideBack = document.getElementById(thisLink);
	hideBack.style.display = hideBack.style.display = "none";
	showRow.style.display = showRow.style.display = "block";
		
	}
   }

What I keep getting is that the parse is not pulling the number out of thisLink. An example of thisLink is internetRow1, or internetRow2. Those are the id's of the rows in my table...and I use them to hide or show rows.

It was my understanding that parseInt(thisLink) would only return the number. Then I can use that number to manipulate the next lowest numbered row and make it show.

But I am not getting numbers...I keep getting NAN in my test text field. What am I doing wrong that I cannot pull the number out?

Hope I explained that well enough.
Dave

"Credit belongs to the man who is actually in the arena - T.Roosevelt
 
parseInt only returns a number if the number is at the start of the string. You'll have to write your own parsing routine that either:

1. Strips out the known non-numeric start of the string (e.g. "internetRow"), or

2. Strips out all non-numeric characters.

I'd opt for number 2, as if your known string changes, the routine will still work.

Hope this helps,
Dan

[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
 
[1]
[tt]>nextRow = parseInt(thisLink);
>showRow = document.getElementById("internetThreeArow" + nextRow );[/tt]

[tt]nextRow = thisLink.match(/\d*$/)[0];
if (nextRow) {
showRow = document.getElementById("internetThreeArow" + nextRow );
} else {
//[blue]you decide what to do because no such number is found.[/blue]
}[/tt]
[2] What is this?

[tt]>hideBack.style.display [red]= hideBack.style.display[/red] = "none";
>showRow.style.display [red]= showRow.style.display[/red] = "block";[/tt]

Why two equal things?

 
fedtrain,

This:

Code:
hideBack.style.display = hideBack.style.display = "none";

is [!]identical[/!]

to this:

Code:
hideBack.style.display = "none";

and this:

Code:
showRow.style.display = showRow.style.display = "block";

is [!]identical[/!]

to this:

Code:
showRow.style.display = "block";

You are basically doing the assignments [!]twice[/!]. While it works for you, the second assignment is redundant, and should ideally be removed. You can decide to keep it in if you like, but really, it serves absolutely no purpose other than to confuse you about what you really need.

Hope this helps,
Dan

[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
 
In fact... just to illustrate that with a little example:

Code:
<script type="text/javascript">
	var variableA = 5;
	var variableB = 5;
	var variableC = variableD = 10;

	alert(variableA);	// shows 5
	alert(variableB);	// shows 5
	alert(variableC);	// shows 10
	alert(variableD);	// shows 10
</script>

In JavaScript, it is possible to save time by assigning the same value to multiple variables (or properties) at the same time. Here you can see that we saved a few bytes of spaces (and 1 line of code) by assigning the value 10 to both variableC and variableD on the same line, whereas for variableA and variableB, we do it on different lines.

This is effectively what you are doing here:

Code:
hideBack.style.display = hideBack.style.display = "none";

You are assigning "none" to "hideBack.style.display", and then assigning "none" to "hideBack.style.display" again.

As you can see, the second assignation is redundant.

Hope this clarifies things,
Dan

[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
 
So I have my truly helpful post getting virtual? The remaining one not?
 
Just wanted to come back and post the solution that worked for this question. I actually ended up backing away from the original path and worked with another programmer to come up with this:
Code:
var historyStack = [];
function hideRows(matrix,inStr) {
   rowArr = inStr.split(",")
   historyStack.push(rowArr[0])
   //alert(historyStack.pop())
   for (x=0; x<rowArr.length; x++){
      theRow = document.getElementById(matrix + "row" + rowArr[x])
      theRow.style.display = theRow.style.display == "none" ? "block" : "none"
   }
}

function backButton(thisLink) {
        lastLink=historyStack.pop();
        hideBack = document.getElementById(thisLink);
        showLast = document.getElementById("internetOneArow"+lastLink);
		//alert(showLast);
	hideBack.style.display = "none";
	showLast.style.display = "block";
     }

So, from my very limited understanding...the push puts the new/latest number from clicks into the array stack....then the pop pulls out the last number. This is a one time deal, so once you pop out the number it is removed from the array. (You can't call it anymore.) So we put it into the variable lastLink and went from there.

(Oh and what seems to be gone is a response to the idea of multiple assignments...ie -
Code:
(showRow.style.display = showRow.style.display = "block";)
It turns out to work just fine with
Code:
showRow.style.display="block";
...which I am sure the other posters already knew..;^))

Dave


"Credit belongs to the man who is actually in the arena - T.Roosevelt
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top