I have a question.
I want to delete image, but if there is sobe error on backend I return sussess:false. But on breakpoint of event onDeleteComplete I see that preview image is always removed from list of thumnail images.
How to prevent remove preview image?
I see that on event onDelete is preview image deleted, but on this event is not any information about backend processes.
I talk about session images. I have defined deleteFileEndpoint which return success:false, but image in preview is gone.
And I see that it is same with fresh uploaded file. In endpoint.php I will hardcoded $result = array("success" => false, "uuid" => '');, soo I expecting to leave image in preview, because is not deleted!
By me is more correct when preview image is deleted after success=true and not before.
I want to delete image, but if there is sobe error on backend I return sussess:false
I assume you mean a JSON response containing "success": false. This is the problem. If you want to declare a delete request to be a failure, you must set the response code appropriately (i.e. 4xx or 5xx). This is explained in the delete feature documentation.
Related
I tried to update my image for category banner using Laravel(v8).
This is my code to update any image, first thing I checked was whether there is any image. If there ware any, I removed them. Then I added the new image.
But it showed me this error, Serialization of 'Illuminate\Http\UploadedFile' is not allowed ,When tried to update image.
Please help me to solve this.
Edit: My image was update without delete the old image.
if($request->hasFile('image') && $request->file('image')->isValid()){
$image = $request->file('image');
$imageName= $image->getClientOriginalName().Str::random(5).'.'.$image->getClientOriginalExtension();
$image->storeAs('category_image', $imageName);
$category = Category::find($id);
if($category->banner !==null){
unlink(public_path().'/allfiles/category_image/'.$category->banner);
}
$category->banner = $imageName;
$category->save();
}
Category::find($id)->update([
'name' => trim($request->category)
]);
Error messages,
This is error detail's
This error showing
I don't know what was the actual problem, I removed old image link manually from the database and then tried to update a new image. Then it got updated successfully. Next, I updated the same image again to confirm whether it works or not, and it worked without any error. Maybe it was the problem with the browser session or the previous database image link.
I need to display an image using a URL that I receive from Push Notification. I tried many docs and blogs but couldn't find the correct solution. I don't want to download and store in DB.
the easiest way that i found to do this...
map the url to an image box and make it visible, set an events event to success, set action to Set property, set component name to what you want to show the image, set property to visibile and value to true leave check box empty as in this image success to html function
In a project I try to give users the option to select images from their personal libraries. Nothing special as such.
This goes perfectly when the user selects the desired image from a local imagelibrary. But when images are selected from OneDrive, an error occurs, and I'm not able to trap the error. The source of the error seems to be in the file.OpenAsync method.
It seems like there may be a relation with the size of the selected image, but I cannot tell, as i'm not able to catch the error.
Here's the codesnippet (it's taken from the XAML image SDK samples in fact)
Dim picker As New FileOpenPicker With {.ViewMode = PickerViewMode.Thumbnail, .SuggestedStartLocation = PickerLocationId.PicturesLibrary}
'picker.SuggestedStartLocation = PickerLocationId.PicturesLibrary
picker.FileTypeFilter.Add(".png")
picker.FileTypeFilter.Add(".jpeg")
picker.FileTypeFilter.Add(".jpg")
picker.FileTypeFilter.Add(".bmp")
Dim wBitMap as new WritableBitmap(200,200)
Dim file As StorageFile = Await picker.PickSingleFileAsync()
' Ensure a file was selected
If file IsNot Nothing Then
Try ' Set the source of the WriteableBitmap to the image stream
Using fileStream As IRandomAccessStream = Await file.OpenAsync(Windows.Storage.FileAccessMode.Read)
Await wBitmap.SetSourceAsync(fileStream)
wBitmap.Invalidate()
vwImage.Source = wBitmap
End Using
Catch e1 As TaskCanceledException
' The async action to set the WriteableBitmap's source may be canceled if the user clicks the button repeatedly
End Try
End If
As you can see, there is a try-catch in place, but nonetheless a non-trapped error pops up, and stepping through, I can detect that it happens in the line
Await file.OpenAsync(Windows.Storage.FileAccessMode.Read)
Now my question is: how do I catch this error? Am I right that the line above is the source of the error? And if not so: what is and how to overcome?
After a lot of experimenting, I think I found the solutoion.
When a StorgeFile is selected to be used as the source for an image, it is wise to check the StorageFile.Attributes.
Files that are selected will carry an Attributes value. In the case of a file from OneDrive, the Attributes value was 544 (the value that you get when combining Archive and LocallyIncomplete. So that file has to be downloaded first, and then it will be available to use.
This is explained here:
Link to the MSDN documentation on StorageFile.Attributes
I have an uploader that has two modes where it uploads different file types. Which one is active depends on what the user is doing. I am using FineUploaderBasic.
Right now to dynamically modify the allowedExtensions I do something like this:
if(type==<?=Campaign_Placement::AD_TYPE_USER_FLASH?>) // SWF
uploader._options.validation.allowedExtensions = ['swf'];
else // Static image
uploader._options.validation.allowedExtensions = ['jpeg', 'jpg', 'gif', 'png'];
uploader.reset(); // Resets with the new extensions
And to modify the acceptFiles:
if(type==<?=Campaign_Placement::AD_TYPE_USER_FLASH?>) // SWF
$('input[name="userfile"]').attr("accept", "application/x-shockwave-flash");
else // Static image
$('input[name="userfile"]').attr("accept", "image/jpeg, image/jpg, image/gif, image/png");
Both are ugly ways to do this, would appreciate a simple way to do both of these through the API, or some other elegant solution. Thanks!
You have 3 other options to solve this problem:
Don't set the allowedExtensions validation value at all. Then contribute a validate event handler that returns false if the user has submitted an invalid file, based on the value of the select you have provided.
Simply construct or re-construct the uploader instance whenever the user changes their selection.
Consider using the relatively new extraButtons feature, where you can connect additional upload buttons to a single Fine Uploader with varying validation options. For example, you can contribute some default allowed extensions (tied to the default upload button), and then provide an extraButtons button with alternate allowedExtensions. Simply display the appropriate button via JavaScript when the user changes their selection.
I need to upload the photo of a user with his details from asp.net mvc3 razor view. The image selected by the user has to be shown as thumbnail before submitting the form.
The model of the view contains a byte array property called Photo. On page load i am converting this byte array to base 64 string and showing it in . this is working properly .
Now i need to show the thumbnail of the image selected by the user. And when he clicks on submit button i need to bind the selected image to the model property Photo.
After googling , i came to know that showing thumbnail is not possible until I upload that image. I tried Uploadify but its UI behavior is not what i am expecting. I also tried the article http://www.dustinhorne.com/post/2011/11/16/AJAX-File-Uploads-with-jQuery-and-MVC-3.aspx, but it is also not suitable in our scenario.
can anyone help me by sharing their experience achieving this scenario.
Thanks in advance.
You could achieve this using HTML5 File API. Take a look at the following article and more specifically the Showing thumbnails of user-selected images section which illustrates an example of how you could achieve that without uploading the image to the server.
And if you want to support legacy browsers that do not yet support the HTML5 File API you could use the jQuery.form plugin which allows you to easily send the contents of a given form to the server using AJAX and it also supports file uploads. So basically you could subscribe to the .change() event of the file input or the .click() event of some see thumbnail ... button and then submit the form to a controller action using AJAX:
$('#myform').ajaxSubmit({
url: '#Url.Action("thumbnail")',
success: function(result) {
// the result variable will contain the result of
// the execution of the Thumbnail action.
// could be a BASE64 encoded representation of
// the thumbnail you generated on the server and then
// simply set it to the src property of your preview `<img>`
// element using the Data Uri scheme
}
});