响应式文件管理器回调函数

Responsive filemanager callback function

本文关键字:函数 回调 文件管理器 响应      更新时间:2023-09-26

我在<input>#image_link。

responsive_filemanager_callback函数应在何处以及如何使用?

我正在努力让它按照RFM文档和下面的代码中提到的那样工作。这是更新<img>#image_preview在RFM9中选择图像后。

这是我的代码:

<input id="image_link" name="link" type="text" value="">
<a class="btn iframe-btn" type="button" href="<?=FILEMANAGER_PATH;?>/dialog.php?type=1&field_id=image_link">Select</a>
<img id="image_preview" src="" />;
<script>
$('.iframe-btn').fancybox({ 
    'width'     : 900,
    'height'    : 600,
    'type'      : 'iframe',
    'autoScale' : false
});
$('#image_link').on('change',function(){
  alert('change triggered');
});
function responsive_filemanager_callback(field_id){ 
    console.log(field_id);
    var url=jQuery('#'+field_id).val();
    alert('update '+field_id+" with "+url); 
    //your code
} 
</script>

上的$('#image_link')。("更改")函数无法识别RFM的更改。

感谢您的投入!

创建链接:

<a href='Address_Of_dialog.php?type=0&field_id=name'>open_fancybox</a>

请注意href属性中的最后一部分,field_id参数,即输入字段的id

<input id='name'>

现在,如果你点击链接,fancybox将打开,你应该写以下代码来打开fancybox:

$('a').fancybox({
        type: 'iframe',
        minHeight: '600'
    });

然后,如果您单击Responsive filemanager中的任何图像,该图像的url将打印在输入字段上,fancybox将自动关闭。

因此,您不需要任何功能来从响应式文件管理器中获取信息,但如果您想在这之后做任何事情(如预览所选图像),您可以添加以下功能:

function responsive_filemanager_callback(field_id){ 
   //write whatever you want
   //you can change the src of an <img> using the <input> value
}

该功能将在选择图像并关闭fancybox后立即触发,因此它非常方便且易于使用。

如果您想要一个干净的文件地址,您可以将relative_url=1添加到href地址,如下所示:

<a href='Address_Of_dialog.php?type=0&field_id=name&relative_url=1'>open_fancybox</a>

我的解决方案是修改filemanager/js directory.. (or include.min.js.中的include.js文件,它在dialog.php 246行中定义)

因此,在第500行的include.js文件中,您可以找到function apply_img(file,external)

在函数末尾添加以下行:

 if (typeof **parent.**responsive_filemanager_callback == 'function')
    { parent.responsive_filemanager_callback(external);  } 
    }

"父母"是最重要的。。我想,这是因为iFrame。。因此,如果您在html文档中添加.aresponsive_filemanager_callback函数,它就会运行它。

On change事件用于跨域示例的演示,因此您可以删除。您必须编辑responsive_filemanager_callback函数。剩下的代码还可以,请参阅我的自定义示例

我现在找到了另一个通过javascript检测输入更改的解决方案。

按间隔检查可能不是很漂亮,但简单、快速、可靠。感谢@kikito!

https://github.com/splendeo/jquery.observe_field

<input id="image_link" name="link" type="text" value="">
<a class="btn iframe-btn" type="button" href="<?=FILEMANAGER_PATH;?>/dialog.php?type=1&field_id=image_link">Select</a>
<img id="image_preview" src="" style="display:none;" />;
<script type="text/javascript" src="/jquery.observe_field.js"></script>
<script>
$('.iframe-btn').fancybox({ 
    'width'     : 900,
    'height'    : 600,
    'type'      : 'iframe',
    'autoScale' : false
});
$(function() {
    // Executes a callback detecting changes with a frequency of 1 second
    $("#image_link").observe_field(1, function( ) {
        // alert('Change observed! new value: ' + this.value );
        $('#image_preview').attr('src',this.value).show();
    });
});
</script>       

设法解决了问题。遵循代码:

HTML:

     <input id="image_link" name="link" type="text" value="">
        <a class="btn iframe-btn" type="button" href="<?=$filemanager_path;?>/dialog.php?type=1&field_id=image_link">Select</a>
        <div id="cont-img"><img id="image_preview" src="" style="display:none;" width="303" /></div>

JAVAscript:

        <script>
        function responsive_filemanager_callback(field_id){ 
            console.log(field_id);
            var url=jQuery('#'+field_id).val();
            //alert('update '+field_id+" with "+url); 
            //your code
            $('#image_preview').attr('src',document.getElementById("image_link").value).show();
            parent.$.fancybox.close();
        } 
        </script>

我使用fanybox打开和关闭弹出