Partage
  • Partager sur Facebook
  • Partager sur Twitter

Probleme avec ng-controller

Sujet résolu
    12 mars 2019 à 21:24:22

    Bonsoir a tous j'ai un souci avec l'application que je suis entrain de faire. J'ai une navbar lorsque je clique sur un bouton login ca m'ouvre un formulaire un modal-fade et sur le modal fade j'ai mis un bouton si la personne n'a pas de compte de pouvoir rediriger vers une autre page.

    mais mon souci est que lorsque je fqis le ng-click ca ne fonctionne pas et aussi je ne sais pas comment faire pour pouvoir conserver la navbar et mettre une autre image d'accueil sur la page que je veux ouvrir.

    Voici une partie du code de ma page connexion.html page d'accueil

    <!DOCTYPE html>
    <html ng-app="myApp" ng-controller="mainCtrl">
    
    <head>
      <title>IS-Finder : Recrutement de stagiaires en marketing,commerce,informatique,finance,RH</title>
    
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <link rel="stylesheet" href="./libs/css/bootstrap.min.css">
      <link rel="stylesheet" href="./connexion/connexion.css">
    
      <meta property="og:title" content="Recrutement de stagiaires en marketing commerce informatique finance RH" />
      <meta property="og:type" content="website" />
      <meta property="og:url" content="index.html" />
      <meta property="og:image" content="./img/logo.png" />
      <meta property="og:description" content="IS-Finder vous propose une gamme de services adaptés au besoins de votre entreprise"
      />
      <meta property="og:locale" content="fr_FR" />
      <meta property="og:site_name" content="IS-Finder" />
      <meta name="google-signin-client_id" content="">
    
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
    
      <meta name="viewport" content="width=device-width, initial-scale=1">
    
      <style type="text/css">
        .background-title {
    
          position: relative;
    
          background: url("./img/fond2.png") no-repeat center center,
          url("./img/fond-home.jpg") no-repeat center center;
    
    
          background-size: cover;
    
          margin-bottom: 20px;
        }
    
        .btn-simulation {
    
          border-radius: 76px;
          background-color: #4abfe2;
          color: white;
          font-weight: bold;
          transition-duration: 0.4s;
          padding-top: 15px;
          padding-bottom: 15px;
          font-size: 17px;
        }
    
    
        .btn-enquete {
    
          border-radius: 76px;
          background-color: #19d4a1;
          color: white;
          font-weight: bold;
          transition-duration: 0.4s;
          padding-top: 15px;
          padding-bottom: 15px;
          font-size: 17px;
        }
    
        .fond-enquete {
          height: 400px;
          position: relative;
    
    
          background: url("img/front/fond2.png") no-repeat center center,
          url("img/front/fond-enquete.jpg") no-repeat center bottom;
    
          background-size: cover;
    
          margin-bottom: 20px;
        }
    
        .title-enquete {
          margin: 40px;
          font-size: 40px;
          color: white;
          font-weight: bold;
          letter-spacing: -0.7px;
        }
    
        .paraph-enquete {
    
          font-size: 25px;
          color: white;
          letter-spacing: -0.7px;
          margin-bottom: 40px;
        }
    
    
    
    
        @media (max-width: 992px) {
    
          .fond-enquete {
            height: auto;
          }
    
          .title-enquete {
            margin-top: 40px;
            font-size: 22px;
          }
    
          .paraph-enquete {
    
            font-size: 18px;
          }
        }
      </style>
    
    </head>
    
    
    <body style="{{bodyBackground}}" >
    
    
      <nav class="navbar navbar-default" ng-show="isNavBarVisible">
          <div class="container-fluid">
            <div class="navbar-header">
    
              <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>                        
              </button>
              <a class="navbar-brand" href="#">
                                  <img src="./img/logo.png" class="img-responsive" width="42" height="10"/>
              </a>
            </div>
            <div class="collapse navbar-collapse" id="myNavbar">
              <ul class="nav navbar-nav">
                <li><a href="#">{{modeName}}</a></li>
              </ul>
              <ul class="nav navbar-nav navbar-right">
                <li><a ng-click="Retour()" ng-show="isRetour" style="cursor: pointer;"><span class="glyphicon glyphicon-back"></span> Revenir vers Cite</a></li>
                <li><a ng-click="signClick()" ng-show="isSignUpVisible" style="cursor: pointer;" href="./entreprise/entreprise.html"><span class="glyphicon glyphicon-user"></span> Sign-up</a></li>
                <li><a ng-click="loginClick()" ng-show="isLoginVisible" style="cursor: pointer;" data-toggle="modal" href="#infos-co"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
               <li><a ng-click="logoutClick()" ng-show="isLogoutVisible" style="cursor: pointer;"><span class="glyphicon glyphicon-log-out"></span> Logout</a></li>
              </ul>
            </div>
          </div>
      </nav>
    
    
      <div class="container-fluid"  >
      <div class="modal fade" id="infos-co" ng-show="isConnexionVisible">
    
        <div class="modal-dialog ">
    
          <div class="modal-content">
    
            <div class="modal-header">
    
              <button type="button" class="close" data-dismiss="modal">x</button>
    
              <h3 class="title-2 center">Connexion</h3>
    
            </div>
    
            <div class="modal-body">
    
              <div class="row">
    
                <div class="col-xs-offset-1 col-xs-10">
    
                  <form class="form-horizontal" name="connexionForm" id="formu">
                      <div class="form-group {{ctrlLogin}}">
                        <label class="control-label col-sm-2" for="login" for="inputSuccess">Login</label>
                          <div class="col-sm-10">
                            <input type="login" ng-model="modelLogin" ng-keyup="ctrlLoginFct()" class="form-control" id="login" id="inputSuccess" placeholder="Entrez votre identifiant"
                              name="login" value="" />
                          </div>
                      </div>
                      <div class="form-group {{ctrlPassword}}" ng-class="{'has-success'}">
                        <label class="control-label col-sm-2" for="pwd">Password</label>
                          <div class="col-sm-10">
                            <input type="password" ng-model="modelPassword" ng-keyup="ctrlPasswordFct()" class="form-control" id="password" placeholder="Entrez votre mot de passe"
                              name="password" value="" />
                          </div>
                      </div>
                      <div class="form-group">
                        <div class="col-sm-offset-2 col-sm-10">
                          <div class="checkbox">
                            <label for="cookie">
                            <input type="checkbox" name="cookie" id="cookie"> Remember me</label>
                          </div>
                        </div>
                      </div>
                      <div class="form-group">
                        <div class="col-sm-offset-2 col-sm-10">
                          <button type="submit" class="btn btn-default" ng-disabled="connexionForm.$invalid" ng-click="connect()"data-dismiss="modal">Submit</button>
                        </div>
                      </div>
                  </form>
    
                </div>
              </div>
                <div class="row">
                  <hr>
                  <p class="center mt-5" style="margin-top: 10px; margin-bottom:10px;"><b>Vous n'avez pas de compte IS-Finder ?</b></p>
                </div>
    
              <div class="row">
    
                <div class="col-md-offset-1 col-md-5">
    
                  <div class="form-group">
    
                    <a ng-click="inscription()" class="btn btn-ajstage-blue  btn-block" >Inscription candidat</a>
                  </div>
    
                </div>
    
    
                <div class="col-md-5">
    
                  <div class="form-group">
    
                    <a href="clickInscription()" class="btn btn-ajstage-blue btn-block">Inscription entreprise</a>
                  </div>
    
                </div>
    


    voici le code js

    var app = angular.module('myApp',[]);
    
    app.controller("mainCtrl",['$scope','$rootScope','$controller','$location','$http',function($scope,$rootScope,$controller,$location,$http){
    
    //declaration des variables
        $scope.choice = "";
        $scope.isConnexionVisible=false;
        $scope.isInscriptionVisible = false ;
        $scope.isSignUpVisible=true;
        $scope.isVueVisible=true;
        $scope.isLoginVisible=true;
        $scope.isLogoutVisible=false;
        $scope.isNavBarVisible = true;
        $scope.isReserverVisible=true;
        $scope.isReserverVisible=true;
        $scope.isLouerVisible=true;
        $scope.isAnnulerVisible=false;
        $scope.isImprimerVisible=false;
        $scope.isAnnulerLVisible=false;
        $scope.actionReserve=false;
        $scope.isThumbnails =true;
        $scope.isList =false;
        $scope.thDisplayColor = "orange";
        $scope.listDisplayColor = "black";
        $scope.bodyBackground="background-image:url('./img/Fond.png')";
        $scope.UserName="";
        $scope.isChoiceVisible = false;
        $scope.isRetour = false ;
        $scope.ctrlLogin = "";
        $scope.modelLogin = "";
        $scope.ctrlPassword = "";
        $scope.modelPassword = "";
        $scope.username = "";
        
        $rootScope.nomMod ="";
        $rootScope.prenomMod ="";
        $rootScope.telephoneMod ="";
        $rootScope.loginMod ="";
        $rootScope.roleMod ="";
        $rootScope.idMod ="";
    
        $rootScope.nom ="";
        $rootScope.prenom ="";
        $rootScope.telephone ="";
        $rootScope.login ="";
        $rootScope.role ="";
        $rootScope.id ="";
    
        $rootScope.Nom ="";
        $rootScope.Numero="";
       
        
    
        $rootScope.nomCite ="";
        $rootScope.IDChambreSelect="";
        $rootScope.IDChambre="";
        $rootScope.userConnected="";
      
       
        // $scope.idModo ="";
        // $scope.nomModi ="";
        // $scope.NbrModi ="";
        // $scope.NomcModi ="";
       
    
       
        
    
       
    //declaration des fonctions
        //fonction de connexion
        $scope.connect = function(){
            var login = document.getElementById('login').value;
            var password = document.getElementById('password').value;
           
            
           
            $http({
                method : "GET",
                url : "http://localhost/ProjetTutore/utils/connexion.php?login="+login+"&password="+password
            }).then(function success(response){ 
                $rootScope.userConnected = response.data[0].idConnect;
               // alert(response.data[0].mode);
                if(response.data[0].mode=="administrateur"){
                    $scope.choice = "./admin/admin.html";
                    $scope.isConnexionVisible=false;
                    $scope.isInscriptionVisible = false ;
                    $scope.isSignUpVisible=false;
                    $scope.isLoginVisible=false;
                    $scope.isLogoutVisible=true;
                    $scope.bodyBackground="background-image:url('./img/Fonde2.jpg')";
                    $scope.UserName=response.data[0].login;
                    $scope.refreshCite();
                    $scope.refreshStudents();
                    $scope.refreshConcierges();
                    $scope.refreshAdministrateurs();
                    document.getElementById('login').value = "";
                    document.getElementById('pwd').value = "";
                    $scope.ctrlPassword = "has-success";
                }
                else if(response.data[0].mode=="etudiant"){
                    $scope.choice = "./etudiant/etudiant.html";
                    $scope.isConnexionVisible=false;
                    $scope.isInscriptionVisible = false ;
                    $scope.isSignUpVisible=false;
                    $scope.isLoginVisible=false;
                    $scope.isLogoutVisible=true;
                    $scope.isVueVisible=false;
                    $scope.bodyBackground="background-image:url('./img/Fonde1.jpg')";
                    $scope.UserName=response.data[0].login;
                    $scope.refreshCite();
                    document.getElementById('login').value = "";
                    document.getElementById('pwd').value = "";
                    $scope.ctrlPassword = "has-success";                
                    
                }
                else if(response.data[0].mode=="concierge"){
                    
                    $scope.choice = "./concierge/concierge.html";
                    $scope.isConnexionVisible = false;
                    $scope.isInscriptionVisible = false ;
                    $scope.isSignUpVisible=false;
                    $scope.isLoginVisible=false;
                    $scope.isLogoutVisible=true;
                    $scope.bodyBackground="background-color:white";
                    $scope.UserName=response.data[0].login;
                    $scope.resfreshEspaceConcierges();
                    document.getElementById('login').value = "";
                    document.getElementById('pwd').value = "";
                    $scope.ctrlPassword = "has-success";
                }
                else{
                    $scope.ctrlLogin = "has-error has-feedback";
                    $scope.ctrlPassword = "has-error has-feedback";
                    alert("Login ou mot de passe incorecte");
                    
                }
                
            },function error(response){
                alert(response);
            });
    
            
    
    
           
        }
    
    
    
    
        $scope.inscription=function(){
            $location.path('./etudiant/inscription.html')
            $scope.isNavBarVisible=true;
            //alert("formulaire mal rempli");
        }
    
    
           
        //Fonction click Login
        $scope.loginClick = function(){
            $scope.isConnexionVisible=true;
            $scope.isSignUpVisible=true;
            $scope.isLoginVisible=true;
            $scope.isLogoutVisible=false;
            $scope.isInscriptionVisible =true;
            $scope.choice = "";
            $scope.bodyBackground="background-image:url('./img/Fond.png')";
            $scope.UserName="";
        }
    
         //Fonction click Login
         $scope.signClick= function(){
            $scope.isConnexionVisible=true;
            $scope.isSignUpVisible=true;
            $scope.isLoginVisible=true;
            $scope.isLogoutVisible=false;
            $scope.isInscriptionVisible =true;
            $scope.choice = "";
            $scope.bodyBackground="background-image:url('./img/Fond.png')";
            $scope.UserName="";
        }
    
       
    
    //Fonction Deconnexion
        $scope.logoutClick = function(){
            $scope.isConnexionVisible=false;
            $scope.isSignUpVisible=true;
            $scope.isLoginVisible=true;
            $scope.isLogoutVisible=false;
            $scope.isInscriptionVisible = false;
            $scope.isRetour = false; 
            // var login = document.getElementById(null);
            // var password = document.getElementById(null);
            $scope.choice = "";
            $scope.bodyBackground="background-image:url('./img/Fond.png')";
            $scope.UserName="";
            $location.path('http://localhost/ProjetTutore/connexion/connexion.html')
        }
    
        $scope.Retour = function(){
    
            $scope.isRetour=false;
            $scope.choice = "./etudiant/etudiant.html";
            $scope.bodyBackground="background-image:url('./img/Fonde1.jpg')";
    
        }
    
        //inscription candidat
        $scope.clickInscription = function(){
             
           $location.url("etudiant/inscription.html");
            
        }
    
    }]);

    Merci de votre aide

    • Partager sur Facebook
    • Partager sur Twitter

    Probleme avec ng-controller

    × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
    × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
    • Editeur
    • Markdown