This is a migrated thread and some comments may be shown as answers.
Prevent default navigation when making ajax call
2 Answers 89 Views
This is a migrated thread and some comments may be shown as answers.
PromptAlert Inc.
Top achievements
Rank 1
PromptAlert Inc. asked on 20 Jun 2012, 06:45 AM
The initial view of our application displays a login page. The user is required to login. We validate the login in javascript making an ajax call to the server.

Our login button looks like this:

<a href="#main" data-role="button" data-click="loginClick">Login</a>

If login succeeds the app should navigate to #main. If not, stay on the login view. 
 
In our loginClick processing, we make an ajax call. If the login is not valid, we call e.preventDefault(); (which does not work)

The problem is that the ajax call is asynchronous (of course) and the view has already changed to #main even if the login failed.

How can we best implement the login failed logic?

2 Answers, 1 is accepted

Sort by
0
Iliana Nikolova
Telerik team
answered on 22 Jun 2012, 12:53 PM
Hello,  

To achieve the needed functionality I would suggest the following approach: 
  • Remove the href attribute from the link;
  • Hook up the ajax request success event and then use the navigate() method of the Kendo UI Mobile Application. 

For convenience, I created a simple jsFiddle example which illustrates such approach in action.

Kind regards,
Iliana Nikolova
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
PromptAlert Inc.
Top achievements
Rank 1
answered on 27 Jun 2012, 09:24 PM
Thank you. That solved our issue.
Asked by
PromptAlert Inc.
Top achievements
Rank 1
Answers by
Iliana Nikolova
Telerik team
PromptAlert Inc.
Top achievements
Rank 1
Share this question
or