j查询更改时隐藏的输入值不会触发

Question

Concrete5 有一个图像选择器，在选择图片后，它会使用图片 ID 更新隐藏的输入值，例如：

<input name="pictureID" value="22" type="hidden">

选择图像后，我需要将所选图像加载到"添加块"表单上。也就是说，在隐藏的输入使用 ID 更新后加载图像(我可以通过 ID 获取图像 URL(。

仅当图像在以下之前被选择并保存时，这才有效：

$('input[name=pictureID]').on('change', function() {
...
}).trigger('change');

但是，如果清除了图像选取器并选择了新图像，则上述操作不起作用，因为在选择图像后会动态添加隐藏的输入。好吧，好吧，我试过这个：

$(document).on('change', 'input[name=pictureID]', function() {
...
}).trigger('change');

但这也行不通。可能是因为必须触发隐藏元素才能获得新值的更改。如果我自己更改值，我会触发它。但是，如果我首先需要知道系统何时更改隐藏的输入值更改，我该如何触发它？

如何在更新隐藏输入值时加载图像？

Answer 1

这是在选择
文件时触发的 javascript 代码+
我添加了一个函数(handleCustomImageChoice(，用于接收所选文件的所有数据。

$(document).ready(function(){
function handleCustomImageChoice(result){
console.log(result);
//check the result object to get the url of the file
//EXAMPLES :
//get thumbnail url =
console.log(result.files[0].resultsThumbnailImg);
//get full size url =
console.log(result.files[0].url);
}
$(document).on('change', 'form', function(){
//when a file is selected in the file manager, then the nearest form is triggered to 'change'...
//first check if the form that is triggered has the required input
let closestForm = $('input[name=pictureID]').closest('form').attr('action');
let currentForm = $(this).attr('action');
if(closestForm == currentForm){
//here your action when the hidden input value is changed
console.log($('input[name=pictureID]').val());
let fileID = $('input[name=pictureID]').val();
if(fileID != 0){
// ConcreteFileManager.getFileDetails(fileID , callback);
ConcreteFileManager.getFileDetails(fileID, handleCustomImageChoice);
}
}
});
});

在我研究解决这个问题的过程中，我还遇到了一个名为"ConcreteEvent"的javascript对象......该对象处理来自核心的 JS 事件...但是，我无法订阅"文件管理器选择文件"事件。所以我不能给你那个代码...但是上面的代码应该能满足你的需求。