File upload using JForm - joomla

I'm trying to use Joomla's (JForm File Type) form for photo upload. After submiting the form and the file, the field of file remains empty in database. What is missing here ?
My field looks similar to one in jdocs:
<field name="myfilevalue" type="file" label="Enter some text" description="Choose an image from your computer with maximum 100KB" size="10" accept="image/*" />

As far as I know, you need to process the field manually in your models prepareTable function.
You can access the file using this:
$jinput = JFactory::getApplication()->input;
$files = $jinput->files->get('jform');
$file = $files['myfilevalue']
The $file array then holds the following keys:
error
name
size
tmp_name
type
You also need to actually move the uploaded file to the final destination. This can be done using JFile::upload().
Also make sure your form has the enctype="multipart/form-data" set, otherwise it will not work.

Related

How to edit placeholder of search form in LARAVEL

I wanted to edit placeholder in search box in laravel but i can not find the exact location to edit it.
<input type="text" class="form-control" name="q" id="btnItems" placeholder="Find photos: eg. 'Animals'">
Find photos: eg. 'Animals placeholder -- I can not find the directory in laravel web application, please help.
In your routes/web.php file, look for the route serving the URL you requested
Go to the specified controller in app/http/controller,
Check for the function that's specified along with the controller in your route/web.php file
The function should return a view, something like:
return view('view_name')
Search for the name inside the bracket in your resources/views directory

How to hide parameter from url, when need to pass data from one page to another?

Instead of showing ../product/1
$breadcrumbs->push($name,url('/product/'.$id));
I want it to be displayed as ../product
Any method can be used to do this ?
Use hidden input field like:
<input name="id" value="{{$id}}" hidden>
Not a too good practice, But you can hide id parameter from url

Insert image into Primefaces editor

I'm using JSF2.2, Tomcat 8 and MySQL DB to create a simple CMS. In my back pages I use Primefaces p:editor to create/edit my page content. I would like to insert an image somewhere into the text. It would be great if I could upload the image and insert it at the current cursor position. Ideally, the image should be saved as a blob, but if it's easier for the implementation it could instead be stored as a local file.
I can see that p:editor already has an option to insert a URL of an image, resulting in the <img> tag in the text. But I would really like the possibility to upload an image from my local drive. I haven't been able to Google anything useful so far.
this is how i did it:
.xhtml:
<p:editor id="editor"
widgetVar="editWidget"
value="#AnnouncementBean.text}" />
<p:fileUpload id="upload"
fileUploadListener="#{AnnouncementBean.uploadListener}"
label="Insert image"
mode="advanced"
allowTypes="/(\.|\/)(gif|jpe?g|png)$/"
update="editor, growl">
</p:fileUpload>
An in my Backing Bean in the uploadListener after file upload:
String value = FacesContext.getCurrentInstance()
.getExternalContext().getRequestParameterMap().get("editor_input");
setText(value + "<img src=\"/uploads/" + result.getName()+"\" />");
RequestContext.getCurrentInstance().update("editor_input");
where "editor_input" referes to the actual form field submitted for the editor (PF adds the_input to the id of your editor)
Notice how I update the editor_input not the actual editor. Only problem now is that the image is appended to the end of the text. sou you must move it manually within the editor
You can use a string to receive the editor (or textEditor) value, then use regex to find all img elements.
This is my code.
String regex="<img src="data:image/(gif|jpe?g|png);base64,([^"]*")[^<>]*>";
Matcher m = Pattern.compile(regex).matcher(your_textEditor_value);
while(m.find()){
String imageFileType=m.group(1);
String imageDataString=m.group(2);
byte[] imageData=Base64.decodeBase64(imageDataString);
}
The imageFileType is your file type, and imageData is data of the file. You can use it to do other thing.

Paste image URL to html text box instead of 'browsing for file'

How can I convert the following into an editable text box, with a submit button to carry out the code below?
<input type="file" name="image_file" id="image_file" onchange="fileSelectHandler()" />
The use case is that an image URL is in the memory, and just needs to be pasted for submission, instead of choosing a local file. (since the OS grabs the remote file, makes a local copy of it then passes this on)
I'm essentially tweaking this element from a nice jcrop tutorial:
http://www.script-tutorials.com/html5-image-uploader-with-jcrop/
Many thanks!

When creating a FormData object from an existing form, are filenames automatically appended and accessible?

Form
<form id="my_form">
<input type="file" name="my_file">
<input type="text" name="field_one">
<input type="text" name="field_two">
<button>send</button>
</form>
Create FormData Object
var myFormData = new FormData($("#my_form")[0]);
Question
Is the filename of my_file accessible even though it hasn't been specifically defined (for DOM manipulation and inserting into database)?
This states:
You can also append a File or Blob directly to the FormData object,
like this:
data.append("myfile", myBlob, "filename.txt");
But it doesn't specify whether a filename is automatically added when creating the FormData object from an existing form.
If it is not automatically appended, is the only option to manually create a FormData object through multiple append() statements in which case filename definition is possible?
It seems the filename is automatically added (just tested in Chrome and not sure if this differs in other circumstances).
Steps To Reproduce
Go to http://jsfiddle.net/rwone/vsRSf/
Open Network tab in Developer Tools
Select two images and click the button
View the Network tab and you will see the filenames are defined
The image information is only defined with two parameters, and not the third filename parameter:
myFormData.append(name, file);
Original fiddle based on this post:
https://stackoverflow.com/a/21901886/1063287

Resources