Ask Questions and Find Answers
Important:
Ask is now read-only. You can review any existing questions and answers, but not add anything new.
But - don't panic! While ask is no more, we've replaced it with discuss - the new Liferay Discussion Forum! Read more here here or just visit the site here:
discuss.liferay.com
RE: How to send file using in servresource in Ajax call
I am using servresource to send parameters to action all fields i have sccessfully submitted by i have one upload button there in which i have to attach CV of some candidate.i want to send the file using that servesource call to the action.But the way i am doing it ,getting null every time .Here is my code ...
<script type="text/javascript">
function sendToConsultant(){
var fname = $('#<portlet:namespace />fname').val();
var lname = $('#<portlet:namespace />lname').val();
var email = $('#<portlet:namespace />email').val();
var phone = $('#<portlet:namespace />phone').val();
var jobtitle = $('#<portlet:namespace />jobtitle').val();
var comments = $('#<portlet:namespace />comments').val();
var fileName = $('#<portlet:namespace />fileName');
var type = "candidateInterestInJob";
var url = "<%=candidateInterestURL%>";
alert(fileName)
jQuery.getJSON(url+"&type="+type+"&fname="+fname+"&lname="+lname+"&email="+email+"&phone="+phone+"&jobtitle="+jobtitle+"&comments="+comments+"&fileName="+fileName, function(data) {
});
}
</script>
<table>
<tr>
<td><aui:input cssClass="textBoxJobDetails" label="" name="fname" id="fname" type="type" placeholder="First Name" size="40" /></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxJobDetails" label="" name="lname" id="lname" type="type" placeholder="Last Name" size="40"/></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxJobDetails" label="" name="email" id="email" type="type" placeholder="Email" size="40"/></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxJobDetails" label="" name="phone" id="phone" type="type" placeholder="Phone No." size="40"/></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxNonMandetory" label="" name="jobtitle" id="jobtitle" type="type" placeholder="Title" size="40"/></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxNonMandetory" label="" type="textarea" id="comments" rows="5" cols="44" name="comments" placeholder="Your Comments"/></td>
</tr>
<tr>
<td><aui:input inlineField="true" type="file" name="fileName" label="Upload your CV. Supported Formats: doc, docx, rtf, pdf." size="75" accept=".doc,.docx,.rtf,.pdf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/rtf,application/pdf"/></td>
</tr>
<tr>
<td>
<aui:button type="submit" name="Submit" cssClass="applyJobToConsultant" value="Send" style="width: 160px" onClick="sendToConsultant()"></aui:button>
</td>
</tr>
</table>
</div>
Here the filename i am sending is getting NULL all the time can anyone help me ???Thanks is advance....And also i have to use that getJson() method and have to pass the filename as parameter within that function
<script type="text/javascript">
function sendToConsultant(){
var fname = $('#<portlet:namespace />fname').val();
var lname = $('#<portlet:namespace />lname').val();
var email = $('#<portlet:namespace />email').val();
var phone = $('#<portlet:namespace />phone').val();
var jobtitle = $('#<portlet:namespace />jobtitle').val();
var comments = $('#<portlet:namespace />comments').val();
var fileName = $('#<portlet:namespace />fileName');
var type = "candidateInterestInJob";
var url = "<%=candidateInterestURL%>";
alert(fileName)
jQuery.getJSON(url+"&type="+type+"&fname="+fname+"&lname="+lname+"&email="+email+"&phone="+phone+"&jobtitle="+jobtitle+"&comments="+comments+"&fileName="+fileName, function(data) {
});
}
</script>
<table>
<tr>
<td><aui:input cssClass="textBoxJobDetails" label="" name="fname" id="fname" type="type" placeholder="First Name" size="40" /></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxJobDetails" label="" name="lname" id="lname" type="type" placeholder="Last Name" size="40"/></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxJobDetails" label="" name="email" id="email" type="type" placeholder="Email" size="40"/></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxJobDetails" label="" name="phone" id="phone" type="type" placeholder="Phone No." size="40"/></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxNonMandetory" label="" name="jobtitle" id="jobtitle" type="type" placeholder="Title" size="40"/></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxNonMandetory" label="" type="textarea" id="comments" rows="5" cols="44" name="comments" placeholder="Your Comments"/></td>
</tr>
<tr>
<td><aui:input inlineField="true" type="file" name="fileName" label="Upload your CV. Supported Formats: doc, docx, rtf, pdf." size="75" accept=".doc,.docx,.rtf,.pdf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/rtf,application/pdf"/></td>
</tr>
<tr>
<td>
<aui:button type="submit" name="Submit" cssClass="applyJobToConsultant" value="Send" style="width: 160px" onClick="sendToConsultant()"></aui:button>
</td>
</tr>
</table>
</div>
Here the filename i am sending is getting NULL all the time can anyone help me ???Thanks is advance....And also i have to use that getJson() method and have to pass the filename as parameter within that function
Hi Jeet,
You can take a reference from below code -
Reference :: http://www.phpletter.com/Demo/AjaxFileUpload-Demo/
Regards.
You can take a reference from below code -
$.ajaxFileUpload({
url:ajaxUrl,
secureuri:false,
fileElementId:elementId,
dataType: 'json',
success: function (data, status)
{
// Success
},
error: function (data, status, e)
{
alert("There might be some issue with this file.");
}
});
Reference :: http://www.phpletter.com/Demo/AjaxFileUpload-Demo/
Regards.
Ayatullah Abdulhakim, modified 10 Years ago.
Junior Member
Posts: 36
Join Date: 5/12/13
Recent Posts
You cannot upload any file using ajax, you may use any js library that can help you.
https://blueimp.github.io/jQuery-File-Upload/basic.html
or
https://github.com/davgothic/AjaxFileUpload
https://blueimp.github.io/jQuery-File-Upload/basic.html
or
https://github.com/davgothic/AjaxFileUpload
HI
it may help you..
http://michi-path.blogspot.in/2013/02/file-upload-using-serveresource-ajax.html
https://www.liferay.com/community/forums/-/message_boards/message/31536959
Regards,
Meera Prince
it may help you..
http://michi-path.blogspot.in/2013/02/file-upload-using-serveresource-ajax.html
https://www.liferay.com/community/forums/-/message_boards/message/31536959
Regards,
Meera Prince
I have tried this but not working for me .. 
<script type="text/javascript">
function sendToConsultant(){
var url = "<%=candidateInterestURL%>";
var fname = $('#<portlet:namespace />fname').val();
var lname = $('#<portlet:namespace />lname').val();
var email = $('#<portlet:namespace />email').val();
var phone = $('#<portlet:namespace />phone').val();
var jobtitle = $('#<portlet:namespace />jobtitle').val();
var comments = $('#<portlet:namespace />comments').val();
var type = "candidateInterestInJob";
jQuery.getJSON(url+"&type="+type+"&fname="+fname+"&lname="+lname+"&email="+email+"&phone="+phone+"&jobtitle="+jobtitle+"&comments="+comments, function(data) {
});
$.ajaxFileUpload({
url:'<%=candidateInterestURL%>',
secureuri : false,
fileElementId : 'fileName',
dataType : 'json',
success : function(data, status) {
alert(fileElementId);
}
});
}
</script>
<div id="candidateInfo">
<div id="candidateInfoBanner">
Connect with Our Consultant
<hr class="hrinJobDetails">
</div>
<form method="post" enctype="multipart/form-data" name="form" id=" " >
<table>
<tr>
<td><aui:input cssClass="textBoxJobDetails" label="" name="fname" id="fname" type="type" placeholder="First Name" size="40" /></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxJobDetails" label="" name="lname" id="lname" type="type" placeholder="Last Name" size="40"/></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxJobDetails" label="" name="email" id="email" type="type" placeholder="Email" size="40"/></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxJobDetails" label="" name="phone" id="phone" type="type" placeholder="Phone No." size="40"/></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxNonMandetory" label="" name="jobtitle" id="jobtitle" type="type" placeholder="Title" size="40"/></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxNonMandetory" label="" type="textarea" id="comments" rows="5" cols="44" name="comments" placeholder="Your Comments"/></td>
</tr>
<tr>
<%-- <td><aui:input inlineField="true" type="file" name="fileName" label="Upload your CV. Supported Formats: doc, docx, rtf, pdf." size="40" accept=".doc,.docx,.rtf,.pdf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/rtf,application/pdf"/></td> --%>
<td><input type="file" name="fileName" id="fileName" value="Browse" /></td>
</tr>
<tr>
<td>
<aui:button type="submit" name="Submit" cssClass="applyJobToConsultant" value="Send" style="width: 160px" onClick="sendToConsultant()"></aui:button>
</td>
</tr>
</table>
</form>
</div>
In the Action class
else if(type.equals("candidateInterestInJob")){
System.out.println("Reached");
String firstName = null;
String lastName = null;
String emailOfCandidate = null;
String phoneNo = null;
String candidateJobTitle = null;
String candidateComments = null;
UploadPortletRequest uploadRequest = PortalUtil.getUploadPortletRequest(resourceRequest);
firstName = ParamUtil.getString(uploadRequest,"fname");
lastName = ParamUtil.getString(uploadRequest,"lname");
emailOfCandidate = ParamUtil.getString(uploadRequest,"email");
phoneNo = ParamUtil.getString(uploadRequest,"phone");
candidateJobTitle = ParamUtil.getString(uploadRequest,"jobtitle");
candidateComments = ParamUtil.getString(uploadRequest,"comments");
//File resume = uploadRequest.getFile("fileName");
System.out.println(firstName+lastName+emailOfCandidate+phoneNo+candidateJobTitle+candidateComments);
InputStream inputStream = uploadRequest.getFileAsStream("fileName");
System.out.println("-------------");
if(Validator.isNotNull(inputStream)){
File file = FileUtil.createTempFile(inputStream);
System.out.println(">>>>>>>>>>>>>>>>>>>>>>>>>>>."+file);
String uploadString = getFileAsString(file);
System.out.println(">>>>>>>"+uploadString);
if (Validator.isNotNull(uploadString)) {
resourceResponse.getWriter().write( "validated_successfully");
}

<script type="text/javascript">
function sendToConsultant(){
var url = "<%=candidateInterestURL%>";
var fname = $('#<portlet:namespace />fname').val();
var lname = $('#<portlet:namespace />lname').val();
var email = $('#<portlet:namespace />email').val();
var phone = $('#<portlet:namespace />phone').val();
var jobtitle = $('#<portlet:namespace />jobtitle').val();
var comments = $('#<portlet:namespace />comments').val();
var type = "candidateInterestInJob";
jQuery.getJSON(url+"&type="+type+"&fname="+fname+"&lname="+lname+"&email="+email+"&phone="+phone+"&jobtitle="+jobtitle+"&comments="+comments, function(data) {
});
$.ajaxFileUpload({
url:'<%=candidateInterestURL%>',
secureuri : false,
fileElementId : 'fileName',
dataType : 'json',
success : function(data, status) {
alert(fileElementId);
}
});
}
</script>
<div id="candidateInfo">
<div id="candidateInfoBanner">
Connect with Our Consultant
<hr class="hrinJobDetails">
</div>
<form method="post" enctype="multipart/form-data" name="form" id=" " >
<table>
<tr>
<td><aui:input cssClass="textBoxJobDetails" label="" name="fname" id="fname" type="type" placeholder="First Name" size="40" /></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxJobDetails" label="" name="lname" id="lname" type="type" placeholder="Last Name" size="40"/></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxJobDetails" label="" name="email" id="email" type="type" placeholder="Email" size="40"/></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxJobDetails" label="" name="phone" id="phone" type="type" placeholder="Phone No." size="40"/></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxNonMandetory" label="" name="jobtitle" id="jobtitle" type="type" placeholder="Title" size="40"/></td>
</tr>
<tr>
<td><aui:input cssClass="textBoxNonMandetory" label="" type="textarea" id="comments" rows="5" cols="44" name="comments" placeholder="Your Comments"/></td>
</tr>
<tr>
<%-- <td><aui:input inlineField="true" type="file" name="fileName" label="Upload your CV. Supported Formats: doc, docx, rtf, pdf." size="40" accept=".doc,.docx,.rtf,.pdf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/rtf,application/pdf"/></td> --%>
<td><input type="file" name="fileName" id="fileName" value="Browse" /></td>
</tr>
<tr>
<td>
<aui:button type="submit" name="Submit" cssClass="applyJobToConsultant" value="Send" style="width: 160px" onClick="sendToConsultant()"></aui:button>
</td>
</tr>
</table>
</form>
</div>
In the Action class
else if(type.equals("candidateInterestInJob")){
System.out.println("Reached");
String firstName = null;
String lastName = null;
String emailOfCandidate = null;
String phoneNo = null;
String candidateJobTitle = null;
String candidateComments = null;
UploadPortletRequest uploadRequest = PortalUtil.getUploadPortletRequest(resourceRequest);
firstName = ParamUtil.getString(uploadRequest,"fname");
lastName = ParamUtil.getString(uploadRequest,"lname");
emailOfCandidate = ParamUtil.getString(uploadRequest,"email");
phoneNo = ParamUtil.getString(uploadRequest,"phone");
candidateJobTitle = ParamUtil.getString(uploadRequest,"jobtitle");
candidateComments = ParamUtil.getString(uploadRequest,"comments");
//File resume = uploadRequest.getFile("fileName");
System.out.println(firstName+lastName+emailOfCandidate+phoneNo+candidateJobTitle+candidateComments);
InputStream inputStream = uploadRequest.getFileAsStream("fileName");
System.out.println("-------------");
if(Validator.isNotNull(inputStream)){
File file = FileUtil.createTempFile(inputStream);
System.out.println(">>>>>>>>>>>>>>>>>>>>>>>>>>>."+file);
String uploadString = getFileAsString(file);
System.out.println(">>>>>>>"+uploadString);
if (Validator.isNotNull(uploadString)) {
resourceResponse.getWriter().write( "validated_successfully");
}
Can you provide the definition for candidateInterestURL?
It's important to understand you cannot upload a file using the serveResource URL, it can only be a post to an action URL.
serveResource is only for returning resources via ajax.
Sorry if this is actually far away from what you're trying to ask, but mixing serve resource with file upload is fairly confusing.
It's important to understand you cannot upload a file using the serveResource URL, it can only be a post to an action URL.
serveResource is only for returning resources via ajax.
Sorry if this is actually far away from what you're trying to ask, but mixing serve resource with file upload is fairly confusing.
Thank for replying my post,I have successfully sended file to the server with the help of you people. But i stuck in some where now,
I can send the file to the server using this ajaxFileUpload ,but i want to send all the data along with it i am getting from the textboxes.How to send all the data to the server along with the file name can anyone help. am doing this
Can anyone help??
I can send the file to the server using this ajaxFileUpload ,but i want to send all the data along with it i am getting from the textboxes.How to send all the data to the server along with the file name can anyone help. am doing this
<portlet:resourceurl var="candidateInterestURL" id="candidateInterestURLID" />
var fname = $('#<portlet:namespace />fname').val();
var lname = $('#<portlet:namespace />lname').val();
$.ajaxFileUpload({
url:'<%=candidateInterestURL%>',
secureuri : false,
fileElementId : 'fileName',
dataType : 'json',
data:{lname:lname},
success : function(data, status) {
alert('hiii');
},
error:function (data, status, e){
alert("There might be some issue with this file.");
}
});
Can anyone help??
If this works it is merely a fluke. The JSR specification never meant for the serve resource request to be used for a file upload.
As far as passing additional data, why not use url parameters?
As far as passing additional data, why not use url parameters?
I did not get you David.Please be more specific i am new to liferay
Jeet Chatterjee:
I did not get you David.Please be more specific i am new to liferay
This has nothing to do with Liferay, this is the basic JSR 286 specification.
In the specification, there are 4 types of methods a portlet can handle: action, render, resource, and event. Each type has a separate purpose, action is for handling user activity, render is for rendering the html fragment that will be part of a page, resource is for serving resources back to the browser (i.e. fetching ajax data, building images, document files, etc.), and event is for IPC based upon event handling.
So you're trying to force the resource type to all of a sudden act like it is another action type, which it is not.
Check out the definition: http://www.oracle.com/technetwork/java/jsr286-2-141964.html#Serving_Resources.
What you're doing is, effectively, misusing serveResource by passing in arguments to build a dynamic resource by giving a file to be uploaded. This is not how the serveResource was meant to be used and if you actually could get it working, it would only work because of a misuse of the specification.
New to liferay is no excuse to be misusing the specification. Instead of just sitting down and try to code something up, I'd suggest learning more about the portal specification and how things should be handled.
Hi all
I'm currently using serveResource to upload files and other AJAX stuff, including sending and receiving data to the server side. The reason is that it's the only way, I think, to send data without triggering a page refresh - re-rendering all portlets in the page. It might not be the intended use of serveResource but it works well and it's fast.
HTH
Fernando
I'm currently using serveResource to upload files and other AJAX stuff, including sending and receiving data to the server side. The reason is that it's the only way, I think, to send data without triggering a page refresh - re-rendering all portlets in the page. It might not be the intended use of serveResource but it works well and it's fast.
HTH
Fernando
Hi Jeet,
Are you not able to send data with - data:{lname:lname,fname:fname} ?
Then you can do what david suggested, add param in your url.
Regards.
Are you not able to send data with - data:{lname:lname,fname:fname} ?
Then you can do what david suggested, add param in your url.
Regards.
Copyright © 2025 Liferay, Inc
• Privacy Policy
Powered by Liferay™