I have two html pages
default.htm With LoginView
Views/Home.htm With HomeView
in javascript when login is successfull In trying to navigate to HomeView with this sintax
app.navigate('Views/Home.htm');
and produce this url
http://localhost/Default.htm#ViewsHome.htm
that is incorrect and shows a blank page only
but if I navigate with a link
<a data-align="right" data-role="button" class="nav-button" href="Views/home.htm">Home page</a>
produce this url
http://localhost/Default.htm#HomeView
and shows all the markup.
I've tried all the url variations and still doesn't know what's happening please help me.
default.htm With LoginView
Views/Home.htm With HomeView
in javascript when login is successfull In trying to navigate to HomeView with this sintax
app.navigate('Views/Home.htm');
and produce this url
http://localhost/Default.htm#ViewsHome.htm
that is incorrect and shows a blank page only
but if I navigate with a link
<a data-align="right" data-role="button" class="nav-button" href="Views/home.htm">Home page</a>
produce this url
http://localhost/Default.htm#HomeView
and shows all the markup.
I've tried all the url variations and still doesn't know what's happening please help me.
5 Answers, 1 is accepted
0
Hello Leyther,
Petyo
the Telerik team
This does not sound like a known issue. Is it possible for you to send us a sample project, so that we can reproduce the problem on our side?
Thank you in advance,Petyo
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0

Leytner
Top achievements
Rank 1
answered on 05 Feb 2013, 02:58 PM
This is the main page default.htm with the login view:
This is the application variable initialition
This is the login viewmodel script to be use by the view
The callwebservice is working and executing the parameter function
This is the second page Home.htm with only the home view located in the Views folder
The function ValidateLogin is empty without any statements.
The nav button in the loginView is working ok "<a data-align="right" data-role="button" class="nav-button" href="/Views/Home.htm">Home page</a>", but the OnLogin javascript function isn't working navigating to the home view "app.navigate('/Views/Home.htm');" with the same url, this is my problem.
<
body
>
<
div
data-role
=
"view"
id
=
"LoginView"
data-title
=
"Login to access suite"
align
=
"center"
>
<
div
id
=
"LoginForm"
>
<
table
>
<
tr
>
<
td
>User Name: </
td
>
<
td
><
input
type
=
"text"
id
=
"UserNameText"
data-bind
=
"value: Credentials.userName"
/></
td
>
</
tr
>
<
tr
>
<
td
>Password: </
td
>
<
td
><
input
type
=
"password"
id
=
"PasswordText"
data-bind
=
"value: Credentials.password"
/></
td
>
</
tr
>
<
tr
>
<
td
></
td
>
<
td
><
input
id
=
"LoginButton"
type
=
"submit"
value
=
"log in"
data-bind
=
"events: { click: OnLogin }"
/></
td
>
<!--onclick=" OnLogin()"-->
</
tr
>
</
table
>
<
span
data-bind
=
"text: Credentials.userName"
></
span
>
</
div
>
</
div
>
<
div
data-role
=
"layout"
data-id
=
"mainLayout"
>
<
div
data-role
=
"header"
>
<
div
data-role
=
"navbar"
>
bRisk Suite -
<
span
data-role
=
"view-title"
></
span
>
<
a
data-align
=
"right"
data-role
=
"button"
class
=
"nav-button"
href
=
"#LoginView"
>Log Out</
a
>
<
a
data-align
=
"right"
data-role
=
"button"
class
=
"nav-button"
href
=
"/Views/Home.htm"
>Home page</
a
>
</
div
>
</
div
>
<
div
data-role
=
"footer"
style
=
"color: #800000"
>
<!-- <
div
data-role
=
"tabstrip"
>
<
a
href
=
"#homeView"
data-icon
=
"info"
>Home</
a
>
<
a
href
=
"#loginView"
>Logs Out</
a
>
</
div
>-->
Copyright 2013 Abound Resources
</
div
>
</
div
>
<
script
src
=
"ViewModels/LoginViewModel.js"
type
=
"text/javascript"
></
script
>
</
body
>
var
app =
new
kendo.mobile.Application(document.body, {
layout:
"mainLayout"
,
hideAddressBar:
true
,
initial:
"LoginView"
,
transition:
"zoom"
});
This is the login viewmodel script to be use by the view
var
LoginViewModel = kendo.observable({
Credentials: {
userName:
""
,
password:
""
},
OnLogin:
function
() {
CallWebService(
"Security.svc/Login"
,
this
.Credentials.toJSON(),
function
(msg) {
if
(msg)
app.navigate(
'/Views/Home.htm'
);
});
}
});
This is the second page Home.htm with only the home view located in the Views folder
<
div
data-role
=
"view"
id
=
"HomeView"
data-title
=
"Home Menu"
data-before-show
=
"ValidateLogin"
>
home page
</
div
>
The nav button in the loginView is working ok "<a data-align="right" data-role="button" class="nav-button" href="/Views/Home.htm">Home page</a>", but the OnLogin javascript function isn't working navigating to the home view "app.navigate('/Views/Home.htm');" with the same url, this is my problem.
0
Hello Leytner,
You code looks OK. I prepared a small project in order to test it. Could you please check it and let me know what I am missing? Note that in order to load the remote view file successfully you should run the example from server (IIS, Apache, etc.).
All I changed is to remove the backslash from the relative path "Views/Home.htm" so it does not look up for the Views folter in the root directory. Also I bound the LoginView to the View-Model with the data-modal attribute.
Kind regards,
Alexander Valchev
the Telerik team
You code looks OK. I prepared a small project in order to test it. Could you please check it and let me know what I am missing? Note that in order to load the remote view file successfully you should run the example from server (IIS, Apache, etc.).
All I changed is to remove the backslash from the relative path "Views/Home.htm" so it does not look up for the Views folter in the root directory. Also I bound the LoginView to the View-Model with the data-modal attribute.
Kind regards,
Alexander Valchev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0

Leytner
Top achievements
Rank 1
answered on 07 Feb 2013, 05:39 PM
Hi Alexander,
The example code that you send is ok to me, the only thing maybe is that I have my project in a website folder, in http://localhost/TestSite, so you can test in the same environment than me, and I've downloaded the trial version of kendo UI.
The example code that you send is ok to me, the only thing maybe is that I have my project in a website folder, in http://localhost/TestSite, so you can test in the same environment than me, and I've downloaded the trial version of kendo UI.
0
Hi Leytner,
I tested this with the official release (v2012.3.1114) and got it working as expected. Please compare your current implementation with the one presented in the example. If you still experience problem, would it be possible for you to provide a link of your project which I can access?
In addition, it is not recommended to use the DOM click event in mobile application as it will cause troubles when the application is opened on mobile device. Instead of HTML submit button please consider using mobile Button widget and its build-in click event.
Regards,
Alexander Valchev
the Telerik team
I tested this with the official release (v2012.3.1114) and got it working as expected. Please compare your current implementation with the one presented in the example. If you still experience problem, would it be possible for you to provide a link of your project which I can access?
In addition, it is not recommended to use the DOM click event in mobile application as it will cause troubles when the application is opened on mobile device. Instead of HTML submit button please consider using mobile Button widget and its build-in click event.
Regards,
Alexander Valchev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!