Dom7 - referencing by name returns an array

I have an app working with multiple pages, one of which is a login page, set up with the following route :

name: ‘home’,
path: ‘/’,
url: ‘index.html’,
name: ‘connect’,
path: ‘/connect/’,
componentUrl: ‘pages/connect.html’
I have a panel on the home page that allows me to switch between pages.

I was trying to login and noticing that the following stops working after I have gone to this login page ‘multiple’ times :
fitPassword = Dom7("[name=fitPassword]").val();

I could not understand why I was getting a blank password sometimes and now I see that the Dom7("").val() returns a blank string because there is an array when I use name=NAME
I have done a quick test now and I think using an id will solve it but I wanted to check why this occurs to make sure I am not doing something wrong or in case there is a bug. (latest 3.52 version if that matters)


It happens because there are multiple elements with name=“fitPassword” in the DOM. Make sure you are referencing correct input

Are you saying you think my html is flawed with multiple elements with the same name? I think it is good…
I am going to the same page multiple times. The first time I try to login, there is a proper value and no array.
The second time I go to the page is when I see the problem. Why are there multiple elements?

I have since discovered that adding a back link with class=back does not do the same thing. It seems to only happen when I use the link in the menu?

I have tried to create a quick jsfiddle to show better but the link to the “/” page is not working in either the left panel, or the navigate link. Just the back button moves the page, not sure why?
If you can tell me why that is not working, maybe I can reproduce.
On my system, the first time I press the connect button, it shows 0/1
If I use the back link and come back, it shows the same thing.
If I use the panel and go back to List, then back to Connect, I get 0/2 , 0/3, 0/4, … as repeated.

I also thought returning by name and id would return the same object and length?

unable to navigate ‘/’ seems to be related to my route for ‘/’ :

url: 'index.html', 

Not sure if I can mimic that in jsfiddle

I wonder if I am reloading the index.html each time. I thought I was just navigating back to the base page.
Maybe I just need to correct the navigation back to main page in panel ? (same as navigate link)

First of all, you should never do router.navigate in pageInit, why?

Check this fiddle

Go to connect, then list, then connect. Check the DOM with browser inspector. You will see there are 2 Connect pages in DOM. When stackPages enabled, it keeps previous pages in DOM

I was trying to default the app to the connect page. I added the navigate to the pageInit because changing the default in view does not work :
var viewMain = app.views.create(’.view-main’, { url: ‘/connect/’, stackPages: true });

  1. how best to default to connect page?
  2. your example does exactly what I was trying to show (if you use the navigate back link). If you press the connect buttont he first time, you get a 0/1 result. If you go back to main and then to connect, you get a 0./2 result and you can not get the proper password value (assuming you put one in) :
    alert(“Password is : “+Dom7(”[name=fitPassword]”).val());