We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 51824
    • 27 Posts
    Hello,

    perhaps someone could set me on the right track...

    I'm trying to setup login-protected pages, using the extra "Login".
    So far it's working - as long as I'm working with "normal" loginforms.
    But as soon as I try to put the loginform inside a bootstrap modal, I get error messages like "user or password wrong".

    Working version ("normal" form)
    <div class="loginForm">
        <div class="loginMessage">[[+errors]]</div>
        <div class="loginLogin">
            <form class="loginLoginForm" action="[[~[[*id]]]]" method="post">
                <fieldset class="loginLoginFieldset">
                    <legend class="loginLegend">[[+actionMsg]]</legend>
                    <label class="loginUsernameLabel">[[%login.username]]
                        <input class="loginUsername" type="text" name="username" />
                    </label>
                    
                    <label class="loginPasswordLabel">[[%login.password]]
                        <input class="loginPassword" type="password" name="password" />
                    </label>
                    <input class="returnUrl" type="hidden" name="returnUrl" value="[[+request_uri]]" />
    
                    [[+login.recaptcha_html]]
                    
                    <input class="loginLoginValue" type="hidden" name="service" value="login" />
                    <span class="loginLoginButton"><input type="submit" name="Login" value="[[+actionMsg]]" /></span>
                </fieldset>
            </form>
        </div>
    </div>

    Non working version (inside modal)
    <div class="container">
       <div class="row">
            <p class="text-center"><a href="#" class="btn btn-primary btn-lg" role="button" data-toggle="modal" data-target="#login-modal">Login</a></p>
       </div>
    </div>
    
    <!-- BEGIN # MODAL LOGIN -->
    <div class="modal fade" id="login-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
        	<div class="modal-dialog">
    			<div class="modal-content">
    				<div class="modal-header" align="center">
    					<img class="img-circle" id="chor_logo" src="28M8b7qs6A/components/pic/Notenlogo.jpg">
    					<button type="button" class="close" data-dismiss="modal" aria-label="Close">
    						<span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
    					</button>
    				</div>
                    
                    <!-- Begin # DIV Form -->
                    <div id="div-forms">
                    
                        <!-- Begin # Login Form -->
                        <form id="loginLoginForm" action="[[~[[*id]]]]" method="post">
    		                <div class="modal-body loginLogin">
    				    		<div id="div-login-msg loginMessage">
                                   [[+errors]]
                                </div>
    				    		<input id="loginUsername" class="loginUsername form-control" name="username" type="text" placeholder="Benutzername" required>
    				    		<input id="loginPassword" class="loginPassword form-control" type="password" placeholder="Passwort" required>
                               <input class="returnUrl" type="hidden" name="returnUrl" value="[[+request_uri]]" />
    
                                [[+login.recaptcha_html]]
                    
                                <input class="loginLoginValue" type="hidden" name="service" value="login" />
            		    	</div>
    				        <div class="modal-footer">
                                <div>
                                    <button type="submit" class="loginLoginButton btn btn-primary btn-lg btn-block" value="[[+actionMsg]]">Login</button>
                                </div>
    				    	    <div>
                                    <a href="[[~68]]" id="login_lost_btn" type="button" class="btn btn-link">Passwort vergessen?</button>
                                </div>
    				        </div>
                        </form>
                        <!-- End # Login Form -->
                        
     
                        
    
                        
                    </div>
                    <!-- End # DIV Form -->
                    
    			</div>
    		</div>
    	</div>
        <!-- END # MODAL LOGIN -->
    
    


    Any ideas?

    calvair

    This question has been answered by yuliyepes. See the first response.

    • discuss.answer
      • 47047
      • 43 Posts
      Hi calvair

      I think the problem is because the "name" attribute is necessary in each tag...

         <input id="loginPassword" name="password" class="loginPassword form-control"  type="password" placeholder="Passwort" required>
      


      and

              
           <button type="submit" name="login" class="loginLoginButton btn btn-primary btn-lg btn-block" value="[[+actionMsg]]">Login</button>
         


      I hope this solve the problem.
        @yulianita
        • 3749
        • 24,544 Posts
        Yulianita is correct, the password input tag must have name="password" in order for the password to be in the $_POST array, and it should be the only input with that name.
          Did I help you? Buy me a beer
          Get my Book: MODX:The Official Guide
          MODX info for everyone: http://bobsguides.com/modx.html
          My MODX Extras
          Bob's Guides is now hosted at A2 MODX Hosting
          • 51824
          • 27 Posts
          d'oh - obviously! Perhaps I should drink more coffee...

          Thank you Yulianita & BobRay!