Fóruns

Início » Liferay Portal » English » 3. Development

Visualização combinada Visão plana Exibição em árvore
Tópicos [ Anterior | Próximo ]
toggle
sanchita dutta
form submission in ajax without refreshing whole page.
14 de Junho de 2012 04:37
Resposta

sanchita dutta

Ranking: New Member

Mensagens: 8

Data de entrada: 20 de Fevereiro de 2012

Mensagens recentes

HOW IT IS POSSIBLE?
please help.
jaid shaik
RE: form submission in ajax without refreshing whole page.
14 de Junho de 2012 06:00
Resposta

jaid shaik

Ranking: Regular Member

Mensagens: 170

Data de entrada: 7 de Outubro de 2010

Mensagens recentes

Hi sanchita,

check this link


Thanks
Jaid.Shaik
Manish Yadav
RE: form submission in ajax without refreshing whole page.
21 de Junho de 2012 00:26
Resposta

Manish Yadav

Ranking: Expert

Mensagens: 467

Data de entrada: 26 de Maio de 2012

Mensagens recentes

you can also use jquery Ajax for submitting form

view.jsp file
 1
 2<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>
 3<%@page import="javax.portlet.PortletURL"%>
 4<portlet:resourceURL var="ajaxUrl" />
 5<script>
 6function ajaxcall()
 7{   
 8var  empname= document.SubmitForm.empname.value;
 9var employeeId=document.SubmitForm.employeeId.value;
10var ajaxdata=name+":"+employeeId;
11
12    jQuery.ajax({
13                type     : "POST",
14                url      : "<%=ajaxUrl%>",
15                data     : "ajaxdata=" +ajaxdata,
16                success  : function(data){
17               
18                //write your logic here
19               
20                }
21                   
22                },
23                async    :    false,
24                });
25
26   
27}
28
29<form name="SubmitForm" id="SubmitForm" action='#' method="post"  >
30<input type="text" size="30" id="empname" name="empname">
31<input type="text" size="30" id="employeeId" name="employeeId">
32<button type="button" id="submitButton" onclick="ajaxcall()" >Submit Form</button>
33</form>


JavaActtionClass

 1
 2public void serveResource(ResourceRequest resourceRequest, ResourceResponse res) throws PortletException, IOException {
 3            final String METHOD_NAME="serveResource";
 4            String userString=resourceRequest.getParameter("ajaxdata");
 5       
 6            PrintWriter out = res.getWriter();
 7            
 8            
 9             if(null!=userString&&!userString.isEmpty())
10            {
11                    String [] str= userString.split(":");
12                    String empname=str[0];
13                    String employeelID=str[1];
14                                        
15                                        int status= SubmitRecoredInDB(empname,employeelID)
16                    //write your logic here for returning values you can use
17                   
18                    you can use out.print()
19                                        if(status==1)
20                    out.print("your message successfully submited");
21                                        else
22                                          out.print("execption occurs while submitting record in Database");
23                   
24                    } catch (SystemException e) {
25                        
26                        e.printStackTrace();
27                    }
28            }
29            out.flush();
30            out.close();
31        }
Mohammad Azharuddin
RE: form submission in ajax without refreshing whole page.
28 de Outubro de 2014 23:56
Resposta

Mohammad Azharuddin

Ranking: Expert

Mensagens: 477

Data de entrada: 17 de Setembro de 2012

Mensagens recentes

HI Manish

Suppose my form contain 10 input fields and i want validate all fields via ajax so do i need to pass all the parameter in the constructor of Ajax or is there any way to achieve this...?
Tariqul Islam
RE: form submission in ajax without refreshing whole page.
2 de Março de 2015 17:14
Resposta

Tariqul Islam

Ranking: New Member

Mensagens: 15

Data de entrada: 27 de Janeiro de 2013

Mensagens recentes

Please check this here.Its may help liferay developer.
http://tariqliferay.blogspot.com/2015/03/ajax-form-submit-in-liferay.html
David H Nebinger
RE: form submission in ajax without refreshing whole page.
2 de Março de 2015 22:09
Resposta

David H Nebinger

Community Moderator

Ranking: Liferay Legend

Mensagens: 11511

Data de entrada: 1 de Setembro de 2006

Mensagens recentes

Tariqul Islam:
Please check this here.Its may help liferay developer.
http://tariqliferay.blogspot.com/2015/03/ajax-form-submit-in-liferay.html


Not the best example. By using an action URL the portal will invoke the action and the render logic even though you are totally discarding the results of the render in your javascript function.

These kinds of things it is much better using a resource URL. Much lighter overhead on the server side, you can return targeted HTML fragments for inserting into DOM or javascript objects to manipulate, ...

But never an action URL unless you're stuck in JSR 186 land...
Tariqul Islam
RE: form submission in ajax without refreshing whole page.
3 de Março de 2015 09:59
Resposta

Tariqul Islam

Ranking: New Member

Mensagens: 15

Data de entrada: 27 de Janeiro de 2013

Mensagens recentes

Thanks.
For my current project i follow microblogportlet. Here use action request . I also use resource request for ajax form submit in my several projects.
I my my current project after sucess of action request i refersh my portlet as microblog portlet. Bellow is my code..
on: {
success: function(event, id, obj) {
updatePortletConten();
}
}
function updatePortletConten(){

var updateUrl = '<portlet:renderURL windowState="<%= LiferayWindowState.EXCLUSIVE.toString() %>"><portlet:param name="mvcPath" value="/html/home/view.jsp" /></portlet:renderURL>';
var retrflag= $.ajax({
url: updateUrl,
dataType: "html",
data: {},
type: "get",
async: false,
success: function(data){

$('#p_p_id<portlet:namespace /> .portlet-body').html(data);
//here response data will come and we need to update in the page.

},
beforeSend: function(){
// it will execute before Ajax call start

},
complete: function(){


},
error: function(){
}

});

}
Again thanks @David H Nebinger
I update my blog and show both action and resource request.
I know in action request portlet render method is execute...and resource request in jsr 286
David H Nebinger
RE: form submission in ajax without refreshing whole page.
3 de Março de 2015 10:23
Resposta

David H Nebinger

Community Moderator

Ranking: Liferay Legend

Mensagens: 11511

Data de entrada: 1 de Setembro de 2006

Mensagens recentes

So you're doing two calls? One for the ajax submission and another for the render? And your ajax submission is using the Action URL anyway?

Me, I'd use a resource url and return the DOM fragment from the ajax method so it's available in the success function. Then you can apply the changes directly into the DOM.

Every decision has a consequence. Any hack can throw together code that would work, including both the examples that you provided. But understanding the implications of the decisions to use an action, render, or resource URL is important. They can mean the difference between only supporting 20 users on a server vs supporting 100.

At the end of the day, the overhead from bad implementation choices reduce your server capacity and this leads to forum posts about why more memory is needed or more CPU or a cluster, etc.

Doing things the right way from the get go is more important than just slinging something together that appears to work.
Tariqul Islam
RE: form submission in ajax without refreshing whole page.
3 de Março de 2015 10:46
Resposta

Tariqul Islam

Ranking: New Member

Mensagens: 15

Data de entrada: 27 de Janeiro de 2013

Mensagens recentes

Again thanks,
I will remember your suggestions in my future projects.