Liferay 7.1 : Autofields can't retrieve fieldIndexes - liferay

I'm starting to use the liferay-auto-fields composant.
So here is my jsp with the aui:script -->
<aui:form action="<%=saveMotiveURL%>" name="fm" method="post" enctype="multipart/form-data" onSubmit="setZones()" >
<aui:fieldset>
<aui:field-wrapper>
<div id="emailAdress-fields">
<label class="control-label"><liferay-ui:message key="motiveConfigEdit.col5"></liferay-ui:message> </label>
<div class="lfr-form-row lfr-form-row-inline">
<div class="row-fields">
<aui:input type="text" name="emailAdress1" fieldParam='emailAdress1' id='emailAdress1' label="" value=""/>
<aui:input type="hidden" name="motiveEmailId1" fieldParam='motiveEmailId1' id='motiveEmailId1' value=""/>
</div>
</div>
</div>
<aui:button type="submit" name="saveButton" value="button.create" label=""/>
</aui:field-wrapper>
</aui:fieldset>
</aui:form>
<aui:script>
AUI().use('liferay-auto-fields',function(A) {
new Liferay.AutoFields(
{
contentBox: '#emailAdress-fields',
fieldIndexes: '<portlet:namespace />rowIndexes'
}
).render();
});
</aui:script>
Then, i want to retrieve the "rowIndexes" in the processaction function, so i do :
String rowIndexes = actionRequest.getParameter("rowIndexes");
And this always gives me EMPTY.
I notice also that the hidden field in the jsp 'rowIndexes' doesn't change or have value when i had an autofield by clicking on the "+" button.
Is anyone has a solution ?
thanks

There are a couple of issues with your code you would like to address,
aui is deprecated and you should avoid when possible
prefer tags like
<liferay-frontend:edit-form>
<liferay-frontend:edit-form-body>
<liferay-frontend:fieldset-group>
<liferay-frontend:fieldset>
The following structure should work on the latest versions of Liferay:
<liferay-frontend:fieldset >
<div id='emailAdress-fields'>
<div class='lfr-form-row lfr-form-row-inline'>
<div class='row-fields'>
</div>
</div>
</div>
</liferay-frontend:fieldset>
Your script seems fine
<aui:script use='aui-base'>
A.use('liferay-auto-fields',function(A) {
new Liferay.AutoFields({
contentBox: '#emailAdress-fields',
fieldIndexes: '<portlet:namespace/>rowIndexes'
}).render();
})
</aui:script>

Related

Redirected after submit form Formit Modx

I got redirected after I submit the form, and I want to remain on the same page. I am not sure why I got redirected, I am not using &redirectTo for this.
I try some things but nothing worked till now.
[[!FormIt?
&hooks=`spam,email,FormItSaveForm,successMess`
&formName= `Contact Form`
&emailTpl=`emailChunkTpl`
&emailTo=`email#gmail.com`
]]
<form action="[[~[[*id]]]]" method="post" class="contactForm">
<input type="hidden" name="nospam:blank" value="" />
<div class="row input-section-child">
<div class="col input-contact">
<input value="[[!+fi.input-name]]"class="input-name" name="input-name" id="input-name" type="text" placeholder="your name" />
<span class="error-message error" > [[!+fi.error.input-name]] </span>
<input value="[[!+fi.input-email]]" class="input-email" name="input-email" id="input-email" type="text" placeholder="email address" />
<span class="error-message error" >[[!+fi.error.input-email]] </span>
</div>
<div class="col input-contact-text">
<input value="[[!+fi.input-textare]]"class="input-textare" name="input-textare" id="input-textare" type="textare" placeholder="message" />
</div>
</div>
<div class="row second-row">
<div class="col">
<button type="submit" class="send-button">SEND</button>
</div>
[[+placeholder]]
</div>
</div>
</from>
As in my answer on your other post, you should remove all the hooks and try one at a time (after you've cleaned up the markup for this form).
And what is successMess? Is that a custom snippet you've made? It's not a Formit hook that I have heard of. If it's your custom snippet you should paste the code into your question so we can see it.

How do i create a get query in nodeJS based on information contained in checkboxes

I am trying to build an app that lets users find other users with a specific combination of skills. I ask the users to select which skills they are looking for via checkboxes but I'm not sure how to request for the status of that checkbox in my function.
My function currently is:
UserInfo.find()
.where('skill1').equals('')
.where('skill2').equals('')
.where('skill3').equals('')
.limit(10)
.then(function(doc) {
res.render('index', {items: doc});
});
It works properly if I set the equals('') to true or false but I'm not sure how to set it dynamically. My HTML code for the checkboxes is:
<form action="/getskills" method="get">
<div class="input">
<label for="skill1">Skill1</label>
<input type="checkbox" id="skill1" name="skill1" value="skill1"/>
</div>
<div class="input">
<label for="skill2">Skill2</label>
<input type="checkbox" id="skill2" name="skill2" value="skill2"/>
</div>
<div class="input">
<label for="skill3">Skill3</label>
<input type="checkbox" id="skill3" name="skill3" value="skill3"/>
</div>
FIND SKILL
</form>
How can I create and integrate a function to check the value of the checkbox and set the value of the required skill to either true or false?
Thanks in advance for your help.
The problem is that you are using an <a> element to perform the request to the server instead of <input type="submit">. Without a submit button, the elements on your form will not be submitted with the request. Modify your html to this
<form action="/getskills" method="get">
<div class="input">
<label for="skill1">Skill1</label>
<input type="checkbox" id="skill1" name="skill1" value="skill1" />
</div>
<div class="input">
<label for="skill2">Skill2</label>
<input type="checkbox" id="skill2" name="skill2" value="skill2" />
</div>
<div class="input">
<label for="skill3">Skill3</label>
<input type="checkbox" id="skill3" name="skill3" value="skill3" />
</div>
<input type="submit" value="FIND SKILL" />
</form>
then in your Node.js code (I assume you are using express), you can get the checkbox values as query parameters as follows:
//I'm assuming the req parameter is passed in to the express get() method
UserInfo.find()
.where('skill1').equals(req.query.skill1)
.where('skill2').equals(req.query.skill2)
.where('skill3').equals(req.query.skill3)
.limit(10)
.then(function(doc) {
res.render('index', {items: doc});
});

Searching option and value in the URL LARAVEL 5.2

Hello I need to put searching option and value in the URL. I know it's very basic but I have never implement the search function before ever always used the templates one but this time I need to use it. below is my code please help me.
Right now I am getting this in the link
list/%7Boption%7D/%7Bvalue%7D
but I want this in the link list/Hello/thisishelloworld or this may be list/option?Hello/value?thisishelloworld but I think I can get the second option using Get instead of Post method
AND YA ITS IN LARAVEL 5.2
<center>
<div class="form-group">
<label>Select your option from below</label>
<select class="form-control" id="options" name="options" style="width:100%" type="checkbox">
<option>Hello</option>
<option>World</option>
<option>it's Me</option>
</select>
</div>
<div class="col-md-4" id="value">
<div class="panel panel-warning">
<div class="panel-heading">
Enter your Search below
</div>
<form role="form" action="/list/{option}/{value}" method="post">
{{ csrf_field() }}
<div class="form-group has-success">
<input class="form-control" placeholder="Search" type="text" name="{{ value }}" id="value">
<input type="submit" class="btn btn-primary" name="submit" value="Search">
</div>
</form>
</div>
</div>
</center>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
function hide() {
$("#value").hide();
$("#h").hide();
$("#search").hide();
}
function show() {
$("#value").show();
$("#h").show();
$("#search").show();
}
function initHandlers() {
$("#options").change(function() {
show();
});
}
hide();
initHandlers();
</script>
Laravel 5. 2
Step 1:
First you have to create a route.
Routes.php :
Route::get('/list', function(){
// do process
})->name('search');
HTML :
something.blade.php :
{!! Form::open('search', ['route' => 'search', 'method' => 'GET']) !!}
<div class="form-group has-success">
<input class="form-control" placeholder="Search" type="text" name="search" id="value">
<input type="submit" class="btn btn-primary" name="submit" value="Search">
</div>
</form>

Modx formit working in one site - not working in another

I have a form and formit call that works in one site and not another, which is a direct copy of the first [migrating to a new design] The sites are identical right now, files & database were just copied. All the plugins were checked and even reinstalled.
What I have is:
<!-- contact page -->
[[!FormIt?
&placeholderPrefix=`contact.`
&hooks=`spam,email,redirect,FormItAutoResponder`
&emailTo=`[[GetSystemSetting? &setting=`emailContactMailTo`]]`
&emailSubject=`domain.com Contact form has been submitted. [[+contact.subject]]`
&emailTpl=`ContactCustomEmailTpl`
&redirectTo=`346`
&emailReplyTo=`no-reply#domain.com`
&submitVar=`contactSubmit`
&validate=`name:required,email:email:required,subject:required,text:required:stripTags`
&fiarSubject=`Your contact request to domain.com`
&fiarTpl=`ContactCustomEmailTpl`
&fiarReplyTo=`no-reply#domain.com`
]]
<form class="form" action="[[~[[*id]]]]" method="post" role="form">
<input type="hidden" name="nospam:blank" value="" />
<div class="row">
[[!+contact.error_message:notempty=`<div class="col-sm-12"><div class="alert alert-danger">[[!+contact.error_message]]</div></div>`]]
<div class="col-sm-4[[+contact.error.name:notempty=` has-error`]]">
<div class="form-group">
<label for="name"> Name: *</label>
<input id="name" type="text" name="name" value="[[!+contact.name]]" class="form-control" />
</div>
</div>
<div class="col-sm-4[[+contact.error.email:notempty=` has-error`]]">
<div class="form-group">
<label for="email"> Email: *</label>
<input id="email" type="text" name="email" value="[[!+contact.email]]" class="form-control" />
</div>
</div>
<div class="col-sm-4[[+contact.error.subject:notempty=` has-error`]]">
<div class="form-group">
<label for="subject"> Subject: *</label>
<input id="subject" type="text" name="subject" value="[[!+contact.subject]]" class="form-control" />
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12[[+contact.error.text:notempty=` has-error`]]">
<div class="form-group">
<label for="text"> Message: *</label>
<textarea id="text" name="text" rows="7" class="form-control">[[!+contact.text]]</textarea>
</div>
</div>
<div class="col-sm-6 col-sm-offset-3">
<div class="form-group">
<label> </label>
<input class="btn btn-primary btn-block" type="submit" name="contactSubmit" value="Send Contact Inquiry" onClick="_gaq.push(['_trackEvent', 'ContactPage', 'Contact Submitted']);" />
</div>
</div>
</div>
</form>
</div>
The form will work if I remove the 'FormItAutoResponder' from the &hooks AND all items from the &validate parameters.
What is wrong with this form?
no usefull errors in modx or server logs
reinstalled formit
isolated it in a test page with no other markup
the emailTpl is present and mail gets sent if the 2 parameters are removed from the formit call
Perhaps the GetSystemSetting snippet is missing? Why not just use [[++emailContactMailTo]] instead?
Are the MODX and FormIt versions the same on both sites?
Try calling this debug snippet somewhere below the FormIt call. Look for unshown errors (starting with contact.error.) or any other unexpected placeholders.

How do I format jade forms?

I'm trying to refactor my app to use jade instead of ejs but am running into some problems setting up a login form.
Here's my original form in ejs:
<% if (message) { %>
<p><%= message %></p>
<% } %>
<form class="form-horizontal" action='/login' method="POST" id="loginForm">
<fieldset>
<div id="legend">
<legend class="">Login</legend>
</div>
<div class="control-group">
<!-- Username -->
<label class="control-label" for="username">Username</label>
<div class="controls">
<input type="text" id="username" name="username" placeholder="" class="input-xlarge">
</div>
</div>
<div class="control-group">
<!-- Password-->
<label class="control-label" for="password">Password</label>
<div class="controls">
<input type="password" id="password" name="password" placeholder="" class="input-xlarge">
</div>
</div>
<div class="control-group">
<!-- session-->
<label class="control-label" for="rememberme">Remember Me</label>
<div class="controls">
<input type="checkbox" name="rememberme"/>
</div>
</div>
<div class="control-group">
<!-- Button -->
<div class="controls">
<button class="btn btn-success">Login</button>
</div>
</div>
</fieldset>
</form>
And here's my new form in jade:
extends layout
block content
if message
p= message
form(class='form-horizontal',action='/login',method='POST',id='loginForm')
fieldset
div#legand
legend Login
div.control-group
label(for='username',class='control-label') Username
div.controls
input(type='text',id='username',name='username',placeholder='Username',class='input-xlarge')
div.control-group
label(for='password',class='control-label') Password
div.controls
input(type='text',id='password',name='password',placeholder='Password',class='input-xlarge')
div.control-group
label(for='rememberme',class='control-label') Remember Me
div.controls
input(type='checkbox',name='rememberme')
div.control-group
div.controls
input(type='submit',class='btn btn-success') Login
Codekit is throwing an error:
/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/runtime.js:173
throw err;
^
Error: /Users/sm/Documents/Projects/Web_Applications/App/app/views/login.jade:27
25|
26|
> 27|
Invalid indentation, you can use tabs or spaces but not both
at Object.Lexer.indent (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/lexer.js:672:15)
at Object.Lexer.next (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/lexer.js:770:15)
at Object.Lexer.blank (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/lexer.js:179:19)
at Object.Lexer.next (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/lexer.js:744:15)
at Object.Lexer.blank (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/lexer.js:179:19)
at Object.Lexer.next (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/lexer.js:744:15)
at Object.Lexer.lookahead (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/lexer.js:106:46)
at Object.Parser.lookahead (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/parser.js:115:23)
at Object.Parser.peek (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/parser.js:92:17)
at Object.Parser.tag (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/parser.js:666:30)
How can I get past this indentation error and get this form to work? I'm only using tabs and no spaces so I don't understand what the problem is.
This is probably caused by a space in the trailing empty lines in your Jade template (which you don't post, but are there according to the error message).
I think your problem may be how you're specifying the button. Instead of:
div.control-group
div.controls
input(type='submit',class='btn btn-success') Login
Try:
div.control-group
div.controls
button(type='submit',class='btn btn-success') Login

Resources