Ibm mobilefirst 如何从worklight应用程序中使用sql/http适配器从现有数据库检索图像
我有一个现有的数据库,我必须向用户显示worklight应用程序中的图像列表,以便他们可以选择并添加到购物车中 数据库中的图像列在服务器上只有图像路径。 i、 e记忆/配料/坚果/榛子果.jpg 记忆/配料/坚果/澳洲坚果.jpgIbm mobilefirst 如何从worklight应用程序中使用sql/http适配器从现有数据库检索图像,ibm-mobilefirst,worklight-adapters,Ibm Mobilefirst,Worklight Adapters,我有一个现有的数据库,我必须向用户显示worklight应用程序中的图像列表,以便他们可以选择并添加到购物车中 数据库中的图像列在服务器上只有图像路径。 i、 e记忆/配料/坚果/榛子果.jpg 记忆/配料/坚果/澳洲坚果.jpg 因此,如何获取所有这些图像并在我的worklight应用程序上显示。您应该做的是在从数据库检索后连接服务器URL和图像路径 假设我在数据库中存储了这个:/uploads/original/6/63935/1570735-master_chief.jpg,因此连接如下:
因此,如何获取所有这些图像并在我的worklight应用程序上显示。您应该做的是在从数据库检索后连接服务器URL和图像路径 假设我在数据库中存储了这个:/uploads/original/6/63935/1570735-master_chief.jpg,因此连接如下:
var url = "http://static.comicvine.com" + response.invocationResult.resultSet[0].profileimg;
$("#img1").attr("src", url);
下面是一个工作示例
单击按钮后,将调用SQL适配器过程并返回存储在数据库中的URL。此URL插入到预先存在的img标记的src属性中,然后显示该属性
您需要采用此实现并对其进行修改以满足您的需要
HTML:
备选JS:
此代码片段显示如何将多个图像添加到动态创建的img标记中
适配器XML:
在数据库中:
显然,您需要实现一个FOR循环,该循环将使用数据库中不同的图像URL更新每个img标记。但只显示最后一张图像。
<input type="button" value="insert image" onclick="getImageURL();"/><br>
<img id="img1" src=""/>
function getImageURL() {
var invocationData = {
adapter : 'retrieveImage',
procedure : 'retrieveImageURL',
parameters : []
};
WL.Client.invokeProcedure(invocationData,{
onSuccess : retrieveSuccess,
onFailure : retrieveFailure,
});
}
function retrieveSuccess(response) {
var url = "http://static.comicvine.com" + response.invocationResult.resultSet[0].profileimg;
$("#img1").attr("src", url);
}
function retrieveFailure() {
alert ("failure");
}
function retrieveSuccess(response) {
var url, i;
for (i = 0; i < response.invocationResult.resultSet.length; i++) {
url = "http://static.comicvine.com" + response.invocationResult.resultSet[i].profileimg;
$("#imgholder").append("<li><img src='" + url + "'/></li>");
// imgholder is a UL in the HTML where the img tags will be appended to.
};
}
var procedure1Statement = WL.Server.createSQLStatement("select profileimg from users");
function retrieveImageURL() {
return WL.Server.invokeSQLStatement({
preparedStatement : procedure1Statement
});
}
<procedure name="retrieveImageURL"/>
table (users)
|
-- column (profileimg)
------ row contents: some URL pointing to an image, for example: /myimg.png