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);
            }
        }
    });
});

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

更改时jQuery隐藏的输入值不会触发

1 个答案: