让FreeTextBox控件上传相对路径图片-研究结果

服务器上终于可以正常显示ASP.NET的FreeTextBox控件所展现出来的新闻编辑器了，这下又可以继续对于FreeTextBox的探索了！今天上午到现在，解决了该控件的上传图片一直是绝对路径的问题，并修改成了相对路径。

 

研究成果

• 自定义上传的图片保存文件夹位置
• ~的作用
• 将传入数据库中的图片链接信息，修改为相对路径形式

 

自定义上传的图片保存文件夹位置

没想到出奇的简单，在引用FreeTextBox控件语句中，添加上ImageGalleryPath="保存路径"即可。如下图中，在insert.aspx中引用了该控件，添加亮显部分代码即可。

~的作用

在该控件的相关许多代码中都会看到这个～符号，原来它的意思是根目录，如下图ftb.imagegallery.aspx页中亮显代码(该页是FreeTextBox控件中，上传图片按钮被单击时所响应的一个调用页面）。鉴于在程序中多处出现~，例如再深层次的FTB-ImageGallery.js文件中也有多处，所以，最好是将这个支持文件夹移动到虚拟站点的根目录下。暂时，还没有研究过这个支持文件夹的位置是否可以随意移动。

将传入数据库中的图片链接信息，修改为相对路径形式

从图片上传所调用的深层次页面中找到FTB-ImageGallery.js文件

（在支持文件夹aspnet_client\FreeTextBox内）。然后找到插入图片的函数FTB_InsertImage。修改其中构建图片的核心html代码。原本图片来源img src=..使用的是该函数一开始从文档对象img_preview的src属性值。从下面的FTB_PreviewImage函数截图可以看到src值代表了图片文件名称和一个路径。该路径filePath的值的传入貌似我们控制不了（至少我是没有找到）。那么我们只有用filename去做文章。于是在FTB_InsertImage函数中img src的来源从原本的src修改到alt，再配上一定的硬编码路径，如下图中这里我用的是images/news。从上下文中则不难发现，这个alt即FTB_PreviewImage函数中引入的图片文件名。

下图：FTB_InsertImage函数

－－－－－－－－－－－－－－－－－－－－－－－－－－－－

下图为FTB_PreviewImage函数截图：

 

使用这样的修改来实现相对路径保存，需要注意的一点是，最好将创建FreeTextBox控件的可创建文件夹选项给禁掉。因为图片的HTML来源已经被路径写死了。至于在保留相对路径功能的同时，如何将路径也写活，有空来分析。