is it possible that the grails generate-all command is generating the create/edit.gsp views in a way that all fields are genereated seperatly and not just using
Like this:
<label for="myTicketNo">Ticket no.:</label>
<input type="text" id="myTicketNo" name="myTicketNo" value="${fieldValue(bean:myInstance,field:'myTicketNo')}"/>
<label for="description">Description:</label>
<textarea id="description" name="description" cols="180" rows="10">
${fieldValue(bean:myInstance,field:'description')}
</textarea>
<span class="button"><input class="save" type="submit" value="Create" /></span>
and not like:
<g:form url="[resource:userInstance, action:'save']" >
<fieldset class="form">
<g:render template="form"/>
</fieldset>
<fieldset class="buttons">
<g:submitButton name="create" class="save" value="${message(code: 'default.button.create.label', default: 'Create')}" />
</fieldset>
</g:form>
It would make it easier for me to adjust fields seperatly and not writing that manually for each and every field I want the user to be able to change.
I'm on current grails .2.4.4.
Thanks in advance.
Use grails install-templates command so you will be able to modify edit.gsp to your liking.
http://grails.org/doc/latest/ref/Command%20Line/install-templates.html
After modifying the installed tempĺates all generate code will follow its rules.
Related
This is my current code:
<g:form method="post" >
<g:hiddenField name="id" value="${personInstance?.id}" />
<g:hiddenField name="version" value="${personInstance?.version}" />
<fieldset class="form">
<g:render template="form"/>
</fieldset>
<fieldset class="buttons">
<g:actionSubmit class="save" action="update" value="update', default: 'Update')}" />
<g:actionSubmit class="delete" action="delete" value="update", default: 'Delete')}" />
</fieldset>
</g:form>
In my person instance, I have a list variable that I want to set as a hidden field as well, but I am unable to figure out how to do so as the hiddenField tag can only take in one piece of text. This is what I want to create:
<g:hiddenField name="classes" value=["English", "Math"] />
Is this possible a different way?
I have the following domain class and gsp and can't seemed to work for validation on client gsp side.
The domain class:
class User {
String username
String password
String emailAddress
static hasMany = [memberships: Membership]
}
The form gsp:
<div class="error-details">
<g:hasErrors bean="${user}">
<ul>
<g:eachError var="err" bean="${user}">
<li>${err}</li>
</g:eachError>
</ul>
</g:hasErrors>
</div>
<form action="${raw(createLink(controller:'purchase', action:
'createSubscription'))}" method="POST">
<input type="text" name="username">
<input type="text" name="password">
<input type="text" name="emailAddress">
</form>
Is there anything I've missed out?
You should use the built in Taglibs for rendering fields. Don't use standard HTML. This way you allow Grails to determine the constraints based on your domain class.
You didn't specify the version of grails you're running:
The latest version 3.3.x uses the fields plugin, please see https://grails-fields-plugin.github.io/grails-fields/latest/ref/Tags/field.html
<f:field bean="user" property="username"/>
<f:field bean="user" property="password" />
<f:field bean="user" property="emailAddress"/>
or just use this
<f:all bean="user"/>
Which will render all the attributes of user.
Make sure you update your domain and include the following constraint
static constraints = {
password password: true
}
Additional constraints are possible. Please see https://docs.grails.org/latest/ref/Constraints/Usage.html
In older version of grails, please see https://grails.github.io/grails2-doc/2.4.3/ref/Tags/field.html
<g:field type="text" name="username" value="${userInstance?.username}"/>
<g:field type="password" name="password" value="${userInstance?.password}"/>
<g:field type="text" name="username" value="${userInstance?.username}"/>
I am using spring security plugin for login in application. The spring security has default auth.gsp page for login. I have created my own auth.gsp page to add additional thing
auth.gsp
<g:form action='${postUrl.encodeAsURL()}' method='POST' id='loginForm' autocomplete='off' class="login-form">
<g:textField class="field" name="username" value="${params.userName}"/>
<g:passwordField class="field" name="password"/>
<button>login</button>
<p class="message">Forgot Password?</p>
<p class="message"><a id="next" name="next" href="#">Have Invitation Code?</a></p>
</g:form>
The problem is that ${postUrl} contains %252F in the url. Here is the complete url: http://localhost:8080/login/%252Flogin%252Fauthenticate/loginForm. I have tried every possible answer given on stackoverflow but nothing worked.
Try using
<g:form url='${postUrl}' method='POST' id='loginForm' autocomplete='off' class="login-form">
<g:textField class="field" name="username" value="${params.userName}"/>
<g:passwordField class="field" name="password"/>
<button>login</button>
<p class="message">Forgot Password?</p>
<p class="message"><a id="next" name="next" href="#">Have Invitation Code?</a></p>
</g:form>
When setting complete urls, you use 'url' attribute. If you use "action", then you must set a action name.
Also don't use encodeAsURL(). encodeAsURL means, you want to escape special characters like '/','?' which are replaced with '%..' entities.
The other two answers on this question propose overriding
div.ui-input-text {}
However, I have multiple input fields on this page and also within my project. So those answers won't work as they would effect everything on my page or project.
How can I modify a single text input?
A class designation in the input tag doesn't work. If I encapsulate the input with a div tag it still doesn't work. I'm trying to put an icon at the end but it seems all Jquery mobile text input takes the entire screen.
<input class="address" type="text" name="address" id="basic"
placeholder="Street Address, City, State" />
<input type="button" value="FindMe" data-icon="eye" data-iconpos="notext">
CSS, No Effect!
.address {
width: 200px !important;
}
Now, I could still switch to Bootstrap if that's the better way to go on this project. It seems to have .col-xs-* classes that solve this problem.
Thanks in advance.
Instead of directly setting the class on the input,jQM provides a data-attribute for inputs called data-wrapper-class (api doc: http://api.jquerymobile.com/textinput/#option-wrapperClass). This allows you to apply a class directly to the outermost wrapping DIV that jQM adds when enhancing the textbox.
<input data-wrapper-class="address" type="text" name="address" id="basic"
placeholder="Street Address, City, State" />
Working DEMO
It is maybe bit late to answer this, but maybe for others looking for the same thing (I was :-)
You can put your address in a div:
<div class="myContainer">
<label id="lbAddress">Provide the address</label>
<input class="address" type="text" name="address" id="address" />
<input class="address" type="text" name="Street" id="Street" />
<input class="address" type="text" name="City" id="City" />
<input type="button" value="FindMe" data-icon="eye" data-iconpos="notext">
</div>
<div><input class="other" type="text" name="other" id="other"/></div>
Then select your container and just the input inside that container in the CSS:
.myContainer > .ui-input-text
{
width:200px;
}
demo: https://jsfiddle.net/petitbarzun/cfazq5k5/
Reading your comments on the answer from ezanker, if you want all the inputs to appear on one line, there needs to be a container with ui-field-contain like this (the label should be there too):
<div class="ui-field-contain">
<label id="lbAddress" style="display:none"></label>
<input class="address" type="text" name="address" id="address" />
<input class="address" type="text" name="Street" id="Street" />
<input class="address" type="text" name="City" id="City" />
<input type="button" value="FindMe" data-icon="eye" data-iconpos="notext">
</div>
<div><input class="other" type="text" name="other" id="other"/></div>
The CSS then looks like this:
.ui-field-contain > #lbAddress~[class*=ui-input-text]
{
width:219px;
}
demo http://jsfiddle.net/petitbarzun/cfazq5k5/1/
I working on my first ASP.net MVC project and and i got some problems using multiple buttons in one form.
When my user type username&password and then hit login means it will go to welcome page
if user try to Sign Up means it will go to another form field to get Personal information.
and finally all given information need to store in database and redirect user to welcome page .
#using (Html.BeginForm("about", "home", FormMethod.Post, new { #id = "msform" }))
{
#Html.AntiForgeryToken()
#Html.ValidationSummary()
<!-- progressbar -->
<ul id="progressbar">
<li class="active"></li>
<li></li>
<li></li>
</ul>
<!-- fieldsets -->
<fieldset>
<h2 class="fs-title">Create your account</h2>
<h3 class="fs-subtitle">Take 60 Seconds With Us</h3>
<input type="text" name="UsersName" placeholder="Username" />
<input type="password" name="Passsword" placeholder="Password" />
<input type="button" name="next" class="next action-button" value="Sign Up" />
<input type="button" name="next" class="nexts action-login" value="Log In" />
<input type="submit" value="+" />
</fieldset>
<fieldset>
<h2 class="fs-title">Personal Information</h2>
<h3 class="fs-subtitle">We will never share</h3>
<input type="text" name="phone" placeholder="Email" />
<input type="text" name="phone" placeholder="Phone Number" />
<input type="text" name="date" placeholder="Date of Birth" />
<input type="text" name="gender" placeholder="Gender" />
<input type="button" name="previous" class="previous action-button" value="Previous" />
<input type="button" name="next" class="next action-button" value="Next" />
</fieldset>
<fieldset>
<h2 class="fs-title">Make SomeOne Alive</h2>
<h3 class="fs-subtitle">A donor today! A hero tommorow!</h3>
<input type="text" name="fname" placeholder="Blood Group" />
<input type="text" name="lname" placeholder="Are You ?" />
<input type="text" name="phone" placeholder="State" />
<input type="text" name="phone" placeholder="City" />
<input type="button" name="previous" class="previous action-button" value="Previous" />
<input type="submit" name="submit" class="action-button" value="Submit" />
</fieldset>
}
But now that I have a login button placed on my view form, I'm totally lost. I don't know how to make when user click login button means it will redirect ,if signUp means it will redirect to another form. How to implement the form
Give your button names, and then test for their existence in the posted data server-side. Only the one that is clicked will be there:
<button type="submit" name="_SignUp">Sign Up</button>
<button type="submit" name="_LogIn">Log In</button>
Then, in your action:
if (Request.Unvalidated["_SignUp"] != null)
{
// do sign up
}
if (Request.Unvalidated["_LogIn"] != null)
{
// do log in
}
Or, you can alternatively just divine the user's intention, by attempting to retrieve the user object to sign them in, and if you get no match, then doing the signup instead. However, that pretty much makes the buttons unimportant and could result in the user clicking "Sign Up" and actually being logged in, instead, or vice versa. It doesn't really matter, but it's better to manage user's expectations. If they think they don't have an account, but actually do, they might want to know that.