show sign out button after successfull login - asp.net-mvc-3

I am using mvc3 application where after click on login button i am checking that user is validated or not using ajax call in jquery. If user is authenticated then i return true and in Onsuccess method i am redirecting it to home page. Below is the code:
function OnSuccess(response) {
var mesg = $("#lblMess")[0];
switch (response) {
case true:
var url = "/Home/Search";
takeToHomePage(url);
$(location).attr('href', url);
break;
case false:
mesg.style.color = "red";
mesg.innerHTML = "Email id or Password is incorrect";
break;
case "error":
mesg.style.color = "red";
mesg.innerHTML = "Error occured";
break;
}
}
Till here working fine. Now i added one signout button in _layout.cshtml page which i made visibility none in login page, so if i show this signout button before switch starts and user is not valid then signout button displays but if user is authenticated and trying to show signout button inside true case then it is not working.
Need help.

Now i added one signout button in _layout.cshtml page which i made
visibility none in login page, so if i show this signout button before
switch starts and user is not valid then signout button displays but
if user is authenticated and trying to show signout button inside true
case then it is not working.
Make a Ajax call to server to check if user is authenticated or not. And then you can toggle the button show and hide. This is not the best method to do it. But talking about good approach would be to create a custom CustomPrincipal by inheriting ICustomPrincipal and may more changes. which I think would be too much for you if you have just started on MVC.
This solution is only to toggle the sign-out button visibility and I am not proposing this as best practise.
$.get("User/CheckUserAuthenticity",function(response){
if(response == "true")
{
//button show;
}
});
your Controller Action can be
public ActionResult CheckUserAuthenticity()
{
return Json(User.Identity.IsAuthenticated,JsonRequestBehavior.AllowGet);
}

Related

Oracle JET : Want to create a login page in which after click on login button should route me to home page

Hi I am using the example application with navigation list but I want to create a login page on top of it in which once I click login button and after authentication i have to route the application to main page.
I tried below code but nothing happened.
oj.Router.rootInstance.go('login');
please help.
Application : Oracle JET distribution
Code:
function (oj, ko, app) { // this callback gets executed when all required modules are loaded
$(function() {
function init() {
oj.Router.sync().then(
function () {
// Bind your ViewModel for the content of the whole page body.
ko.applyBindings(app, document.getElementById('globalBody'));
// navigate the user to login or wherever you want them to be now
oj.Router.rootInstance.go('login');
},
function (error) {
oj.Logger.error('Error in root start: ' + error.message);
}
);
}
You'll want to move your router go() commands out of the main.js and into a viewModel that backs the login page and only runs if and when the user passes your authentication test by entering the right username/password.
If login is the default page you want them to see, change the router.configure and navData setup in appController.js to make that the default page:
self.router.configure({
'login': {label: 'Login', isDefault: true},
...
Have a look at the FixItFast sample code for an example of a login page and the structure that supports it. FixItFast is a much more involved example than the standard Starter templates because it assumes mobile-first, but the signin.html view and signin.js viewModel might give you good ideas.
First you make your login page as default page.
Then (in your login.html) on button click you can call a function (function in login.js) where validation of your username and password takes .
self.signIn = function()
{
//your validation
if (login==success)
{
oj.Router.rootInstance.go('dashboard');
}
else
{
alert("check your details");
}
};
Make sure that you have add your dashboard page in router config
self.router.configure({
'dashboard': {label: 'Dashboard'},
'login': {label: '',isDefault: true}
});

How to know when Recaptcha window is closed

I'm facing the following situation: When an user clicks a submit button, the app disables the button. Then, when the callback function of the ReCaptcha is called, I can enable the button again. But if the user closes the verify window how can I know that and then enable my button again?
I was facing the same problem using invisible recaptcha. The way I solve it is observing when the captcha was getting closed.
First get the div Element containing the captcha.
let iframe = document.querySelector('iframe[src^="https://www.google.com/recaptcha"][src*="bframe"]');
let container = iframe.parentNode.parentNode;
Then
let observer = new MutationObserver( mutations => {
if(container && container.style.visibility === 'hidden'){
// Re enable the button
}
});
observer.observe(container, { attributes : true, attributeFilter : ['style'] });

How to bypass/dismiss webform validation in drupal 7?

Here is my situation:
I have a very long multi-page survey built by webforms in drupal.
The questions are not required but we don't want the users to skip all the questions too easy by just clicking Next Page button.
So this is what we need:
When the user try to click on "Next Page" button with any empty fields on the page, error or warning messages will show up, "Are you sure you want to skip this question?", as well as a skip button next to it. When the user click on the skip button, the message disappears and they click on the next page button to proceed the survey.
Here are my thoughts on this:
I used webform validation module to create an Not Empty validation and apply it to the fields.
in webform_validation_validators.inc:
case 'skip_if_empty':
foreach ($items as $key => $val) {
if (count($val) == 0) {
drupal_set_message(t('This field is empty.'), 'warning');
// do something, not sure about it here
}
}
Another thought:
I used the Dismiss module to display an X button next to the error message.
Can I add some functions to the X button to bypass the validation when it is clicked?
And here is the script for the Dismiss module, :
(function ($) {
Drupal.behaviors.dismiss = {
attach: function (context) {
$('.messages').each(function () {
var flag = $(this).children().hasClass('dismiss');
if (!flag) {
$(this).prepend('' + Drupal.t('Close this message.') + '');
}
});
$('.dismiss').click(function () {
$(this).parent().hide('fast');
// some functions to bypass validation to the field?
});
}
}
})(jQuery);
I don't know what to do to after the //. Or is there any other ideas that will work?
AS per the you requirement mention
Take this example
You have created webform having field like
Firstname with required field
Lastname with required field
Then Next button button
When user click next button then error show because you have make the fields are required
When your showing "Dismiss button" next to each field.
Whenr user click "Dismiss button" that time you have to remove "required" attribute of field using jquery or drupal ajax
After that when user click next button then user not get any kind of required field validation error.

On Session Timeout Login.gsp is rendered within the <body> tag instead of redirecting to a new gsp page

I am new to Grails and working on a project which has just 2 controllers one is for login and the other is for a explorer (similar to a windows explorer with left panel displaying a tree -like structure and the right displays the folders contents as a table)
The application is working as excpected meaning when user accesses the application it displays Login Screen if user hasn't logged in and if he has logged in it displays the explorer screen.
But this is not the case on session Timeout: suppose the session has timed out and the user clicks on a link in the right panel of the explorer screen then the login screen is displayed within the right panel.
I am using SecurityFilter to redirect to login screen.
SecurityFilters.groovy
def filters = {
loginCheck(controller:'*', action:'*') {
before = {
if (!session.idpuser && actionName != "login") {
redirect(controller: "user", action: "login")
return false
}
}
}
}
userController.groovy
def login () {
if (request.get) {
return false
}
......
redirect(controller: "explorer", action: "file")
}
explorerController.groovy
def generateFiles = {
.....
render(template: 'list', model: [ dirList: dirList])
}
UrlMappings.groovy
static mappings = {
"/$controller/$action?/$id?"{
constraints {
// apply constraints here
}
}
"/"(action:"file", controller: "explorer")
"500"(view:'/error')
}
The reason I think login.gsp is being rendered in the right panel is because when a user click on a link in right panel "generateFiles" action is invoked and that is rendering login.gsp as a template within explorer.gsp. But I dont know how to fix it :(
I would appreciate if someone can help me with this issue.
PLEASE HELP!!!!!
Since this is an ajax based site, you need to explicitly handle the "you need to login" response in your ajax response handlers and force the user to the login page if needed.
Looks like I found the solution may not be an efficient way but it works.Based on the response I get from the Ajax call I am redirecting to Login.gsp using
window.location.href = '${createLink(controller='user', action='login')}'
Thank you cdeszaq for the hint. I really appreciate it.

how to cancel fancybox from an AJAX callback within onStart

I am loading a login form within a fancybox. If the user has the site open in two browser tabs, and logs in in the first tab, and then clicks the login link in the second tab, I want to avoid opening the fancybox in the second tab since the page will redirect to the user profile and won't look good inside of the fancybox. So I have an AJAX callback within the onStart setting to check if the user is authenticated. If the user is already authenticated, I want to cancel the fancybox and direct the parent to another page (such as the user profile).
Here is my onStart code at the moment:
'onStart': function(opener) {
if ($(opener).attr('id') == 'login') {
$.get('/hicommon/authenticated', function(data) {
if ('yes' == data) {
console.log('this user must have already authenticated in another browser tab, SO I want to avoid opening the fancybox.');
return false;
} else {
console.log('the user is not authenticated');
return true;
}
});
}
},
This doesn't prevent the fancybox from opening for authenticated users, presumably because I'm returning false within the AJAX callback, rather than in the scope of the onStart function. Is there some way I can cancel the fancybox from within that AJAX callback, or pass something to the scope of the onStart function? Thank you

Resources