I want to access form's ngModels from controller.
HTML looks like this:
<div ng-if="ctrl.showForm">
<form name="myForm">
<input name="model">
</form>
</div>
Controller gets injected Scope object. After showForm is set to true I'm doing this: scope.context['myForm']['model']. However, myForm doesn't exists in context because ng-if creates its own scope.
Is there any way how to access the form from controller?
Related
Sorry for the simple question. I am learning to use JSF 2.2 to create a form and trying to keep it close to plain HTML5 as possible. I have an ui:repeat generated list that goes like this:
<ul id="nameLst">
<ui:repeat var="d" value="#{controller.names}" varStatus="status">
<li>
<input
jsf:id="nameTxt"
jsf:binding="#{nameTxt}"
jsf:value="#{d}"
type="hidden" />#{d}
</li>
</ui:repeat>
</ul>
It gets rendered like this:
<ul id="nameLst">
<li>
<input id="j_idt14:0:nameTxt" name="j_idt14:0:nameTxt" value="Name1" type="hidden">
Name1
</li>
<li>
<input id="j_idt14:1:nameTxt" name="j_idt14:1:nameTxt" value="Name2" type="hidden">
Name2
</li>
</ul>
Now, I am trying to add names using JavaScript only to this list. Problem is, how can I control this generated id, so I can use it in JavaScript. And mainly, if the list starts empty, how do I generate this id so it can be correctly posted back to the managed bean.
how can I control this generated id, so I can use it in JavaScript
Just give it a fixed id.
<ui:repeat id="names" ...>
Alternatively, use jsfc attribute to turn <ul> into an <ui:repeat>.
<ul id="names" jsfc="ui:repeat" value="#{bean.names}" var="name">
<li>
<input jsf:id="name" type="hidden" value="#{name}" />
</li>
</ul>
And mainly, if the list starts empty, how do I generate this id so it can be correctly posted back to the managed bean
Use JSF for this instead of JS. An example can be found here: How to dynamically add JSF components
See also:
How can I know the id of a JSF component so I can use in Javascript
JavaServer Faces 2.2 and HTML5 support, why is XHTML still being used
I am trying to open a popup using the below code in jsf.
Forgot password
<div class="modal fade" jsf:id="forgotPassword">
<div class="modal-dialog">
<form jsf:id="reset-password-form">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Request for new password</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label for="inputEmail">EmailId</label>
<div class="col-sm-9">
<input type="text" class="form-control" jsf:id="inputEmail"
jsf:value="#{myBean.passwordResetEmail}"
name="inputEmail" />
<h:message for="inputEmail" />
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button class="btn btn-primary"
jsf:action="#{myBean.resetPassword}">sendPassword</button>
</div>
</div>
</form>
</div>
</div>
I am facing some issues here.
When the user enters wrong email Id, the user shall be on same page and errors shall be shown. But I see, the popup closes automatically when the invalid emailId is entered.
I also want to display success messages as well.
Can any one help me how to do that.
When the user enters wrong email Id, the user shall be on same page and errors shall be shown. But I see, the popup closes automatically when the invalid emailId is entered.
You're indeed synchronously submitting the form and performing a full page reload. It's exactly that full page reload which causes an apparent "automatically close" of the dialog (it's actually not closed, it's just exactly like you're pressing F5 in browser directly after opening the dialog). You need to submit the form asynchronously and only perform a partial reload.
You can do that by simply enclosing <f:ajax> in the UICommand component, exactly like shown for <h:commandButton> in the average JSF tutorial (which your <button jsf:action> passthrough element ultimately get converted to).
<button ... jsf:action="#{myBean.resetPassword}">
<f:ajax execute="#form" render="#form" />
</button>
Both execute and render attributes indicate in this particular example that the entire form must be processed, and that only the form itself must be partially updated. As long as the form is inside the modal dialog, and not outside, then this will keep the modal dialog open (at least, in the HTML DOM tree).
I also want to display success messages as well.
Just add a (global) faces message in action method.
public void resetPassword() {
// ...
FacesMessage message = new FacesMessage("Some success message");
FacesContext.getCurrentInstance().addMessage(null, message);
}
<h:messages globalOnly="true" />
A null client ID indicates a global faces message and those will only be shown when globalOnly="true" is set.
I have created a project that contains two login mechanisms:
The first one is the first authentication mechanism that uses a simple login page (get a user if exists from the database using a function findUser)
And the second authentication mechanism is the login mechanism offered by JAAS (j_security_check)
Basically I am trying to achieve this goal: when the user will
authenticate successfully (in the first login page) he should be
able to skip the second page login (offered by JAAS) without having
to reenter his username and password in login form (j_security_chek
) i prefer that the login page will not be shown at all and jump to the resources pages directly.
I need some suggestion, and if the question is not clear enough please do not hesitate to notify that, thank you in advance for your reply.
I founded a temporary solution, it works very well. So it's simple I just filled the j_username & j_password with values comming from the first login mechanism (the first one) and what i do is that i had created a function with javascript ( accessResource() ) That submiting the login form (the form with action = j_security_check) on load of the current page
jaasLogin.xhtml :
<h:head>
<title>Facelet Title</title>
<script>
function accessResource(){
document.forms["loginForm"].submit();
}
</script>
</h:head>
<h:body class="metro" onload="accessResource()">
.......
.......
<form id="loginForm" name="loginForm" method="post" action="j_security_check" class="form bg-login">
<div class="container span5" name="container">
<h:outputLabel>Utilisateur</h:outputLabel>
<div class="input-control text" data-role="input-control">
<input type="text" name="j_username" value="#{moduleBean.userBean.username}"/>
<h:commandButton type="button" class="btn-clear" tabindex="-1"></h:commandButton>
</div>
<h:outputLabel>Mot de passe</h:outputLabel>
<div class="input-control password" data-role="input-control">
<input type="password" name="j_password" value="#{moduleBean.userBean.password}" />
<h:commandButton type="button" class="btn-reveal" tabindex="-1"></h:commandButton>
</div>
<div class="buttons">
<input name="login" type="submit" value="LOGIN" />
</div>
</div>
</form>
wish that help you
I am using Liferay Portal 6 version.
How can I get the UserName and Password values with in the same page?
<%# taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>
<%#page import="javax.portlet.RenderRequest"%>
<portlet:defineObjects />
This is the <b>Kiran</b> portlet.
<form>
<p><b>UserName:</b> <input type="text" name="UserName" size="10"></p>
<p><b>Password:</b> <input type="Password" name="Password"
size="10"></p>
<p><input type="submit" value="Submit" name="submit"><input type=
"reset" value="Reset" name="reset"></p><hr><hr>
</form>
<%
// here
%>
I'm not sure if its submitting the values correctly as your form has no target and is not refering to a portlet action url.
This tutorial shows some basic usage and parameter retrieval. Check the JSP portlet section. You should be able to access the request object in your jsp as well.
I wouldn't start writing JSP portlets. Its quite outdated nowadays. Check Spring Portlet MVC or even consider JSF.
In a portal/portlet all identifiers must be properly namespaced - you never know what other content ends up on the same html document with you. Thus a form control should rather read:
<input type="text" name="<portlet:namespace/>user" .../>
in order to be able to retrieve the parameter as "user" from the request.
If, in Liferay 6, you use the AlloyUI taglibs, a lot of this namespacing is done automatically for you.
Also, you should add the portlet action URL as Udo Held suggests:
<form action="<portlet:actionURL/>">
What are you trying to get ? Do you want to get the username and password in some other .java file or .jsp file ?? Or do you want to get the username and password once a user logs in ?
If you are trying to get user details set in present jsp page in some other .java or .jsp, then simply use the PortletSession.
Eg: From jsp
PortletSession portletSession = actionRequest.getPortletSession();
portletSession.setAttribute("liferayUserMap", liferayUserMap,PortletSession.APPLICATION_SCOPE);
From .java/.jsp
PortletSession portletSession = actionRequest.getPortletSession();
portletSession.getAttribute("liferayUserMap",PortletSession.APPLICATION_SCOPE);
By doing so, you can share the data among different files in different portlets too.
For case 2: If you are trying to get the user details, simply do the following:
ThemeDisplay themeDisplay = (ThemeDisplay) actionRequest.getAttribute(WebKeys.THEME_DISPLAY);
themeDisplay.getUser();
I hope you are following the portlet structures while coding, otherwise the above mentioned code wouldn't work. Since you have to point to some action class, in the 'struts-config' and 'tiles-def'
I want to call a Servlet which exists in a different war from my war. When user clicks a button we need to call the post method of the servlet. To implement this I did see an existing example which is slightly different but works in that case.
I am using jsf, so in the jsp there is a h:form with another html form inside of it. Below is the code:
<h:form>
<div id="gform" class="column span-20 append-1">
<h:outputText value="Text." /><br/><br/>
<h:commandLink id="addPaymentButton" styleClass="button" onclick='autorenew();return false;'> <span><h:outputText value="Payment Option"/></span> </h:commandLink>
<a id="noThanksButton" href="#"><span><h:outputText value="No Thanks"/></span></a><br/><br/><br/>
<h:outputText style="color:grey" value="Some text" />
<div> </div>
</div>
<form id="hiddenSubmit" method="post" action="https://localhost.myapp.com/myapp/LoginRouter" >
<input type="hidden" name="redirectUrl" value="/myapp/customers/addNewSavedCCInfo.faces"/>
<input type="hidden" name="jump_message" value="IAmJumpingToCC"/>
<input type="hidden" name="jump_url" value="/premiumServices/myPage.htm"/>
<input id="hiddenSubmitButton" type="submit" name="submit" style="display: none" value='' />
</form>
</h:form>
<script language="javascript">
function autorenew(){
window.alert('In js fnt');
document.hiddenSubmit.getElementById('hiddenSubmitButton').click();
window.alert('In js fnt COMPLETE');
return false;
}
So when the button is clicked, javascript is executed which submits the form to the servlet. However I can see in firebug that the second form which I need to submit does not appear. I am not sure how I can call the post method of a servlet class in a different war. Any ideas welcome, I am really stuck!
Thanks.
As per the HTML specification it's forbidden to nest <form> elements. The (mis)behaviour is browser dependent. Some browsers will send all parameters, some browsers will send only the data of the parent form, other browsers will send nothing.
You want to have a single form here. You can perfectly replace the <h:form> by a plain vanilla HTML <form> with the desired action pointing to the servlet in question.