After cropping the image, the page scrolls to the top of the window. The new cropped image doesn’t get focused. Normally .focus() JavaScript method is applies to the form controls. The following way is helped me to solve the problem.
document.getElementById("my-cropped-image").scrollIntoView();
JavaScript Code:
$.ajax({
url: '@Url.Action("CropImage", "CropImage", new { area = "web" })',
type: 'POST',
data: {
imagePath: file,
cropPointX: cropPointX,
cropPointY: cropPointY,
imageCropWidth: imageCropWidth,
imageCropHeight:imageCropHeight
},
success: function (data) {
$("#my-cropped-image")
.attr("src",data.photoPath + "?t=" + new Date().getTime())
.show();
document.getElementById("my-cropped-image").scrollIntoView();// Use this
},
error: function (data) { }
});
Description:
When the user uploads the image and cropped. The cropped image gets focused.It is because of the JavaScript scrollIntoView() method.
Post your comments / questions
Recent Article
- How to hide the ID field from the Django admin?
- It is impossible to add a non nullable field without specifying a default. Django error
- ImportError: cannot import name 'url' from 'django.conf.urls' - Django Error
- How to Enable Virtualization in BIOS Security Settings in Intel Processors For Android Studio?
- Dependency 'androidx.activity:activity:1.8.0' requires libraries and applications that depend on it.
- AttributeError: 'NoneType' object has no attribute 'get_text' - Python
- ModuleNotFoundError: No module named 'openpyxl' - Python
- How to get thumbnail from vimeo video URL in Python?
Related Article