原来代码：
var uploadFile = (['$stateParams', 'mzServer', function ($stateParams, mzServer) {
return {
restrict: 'EA',
require: "ngModel",
link: function (scope, element, attrs, ngModelController) {
scope.$watch(attrs.ngModel, function (data) {
if (attrs.required) {
ngModelController.$setValidity('uploadFile', false);
}
if (mzServer.isEmptyOrNull(data) || angular.isUndefined(data))
{
$(element).fileinput('refresh', { initialPreview: ["/images/no_img.jpg"], initialPreviewAsData: true, });
}
else
{
var arrimg = [];
arrimg.push(attrs.readimg + "/" + data);
$(element).fileinput('refresh', { initialPreview: arrimg, initialPreviewAsData: true, });
if ($stateParams.OpType.toLowerCase() == "query")
{
$('.file-caption-main').hide();
}
ngModelController.$setValidity('uploadFile', true);
}
});
$(element).fileinput({
language: 'zh', //设置语言
uploadUrl: "/form/FileUpload/" + $stateParams.ConfigName + "/" + $stateParams.OpType + "/" + attrs.uploadFile || null, //上传的地址
autoReplace: true,
allowedFileExtensions: ['jpg', 'gif', 'png', 'jpeg','bmp'],//接收的文件后缀
showUpload: true, //是否显示上传按钮
showCancel: false,
showRemove: true,
showCaption: true,//是否显示标题
browseClass: "btn btn-primary", //按钮样式
dropZoneEnabled: false,//是否显示拖拽区域
//minImageWidth: 50, //图片的最小宽度
//minImageHeight: 50,//图片的最小高度
//maxImageWidth: 1000,//图片的最大宽度
//maxImageHeight: 1000,//图片的最大高度
//maxFileSize: 0,//单位为kb，如果为0表示不限制文件大小
//minFileCount: 0,
maxFileCount: 1, //表示允许同时上传的最大文件个数
validateInitialCount: true,
enctype: 'multipart/form-data',
previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}！"
}
).on('fileuploaded', function (event, data, previewId, index) {
if (data.response.ResponseMessage.Success) {
//ngModelController.$setViewValue(data.response.Status);
ngModelController.$setValidity('uploadFile', true);
} else {
ngModelController.$setValidity('uploadFile', false);
mzServer.error(data.response.ResponseMessage.ErrorMessage);
}
})
.on('filebatchuploadcomplete', function (event, files, extra) {
// console.log('File batch upload complete');
//$(this).closest('.file-input .btn-file').attr('disabled', 'disabled');
//$(this).closest('.file-input .btn-file input').attr('disabled', 'disabled');
angular.element('.file-input .fileinput-remove-button').removeAttr('disabled');
}).on("fileclear", function (event) {//移除调用事件
ngModelController.$setViewValue();
if (attrs.required)
ngModelController.$setValidity('uploadFile', false);
else
ngModelController.$setValidity('uploadFile', true);
$(this).closest('.file-input .btn-file').removeAttr('disabled');
$(this).closest('.file-input .btn-file input').removeAttr('disabled');
});
}
}
}]);一次修改：
//上传图片按钮
var uploadFile = (['$stateParams', 'mzServer', function ($stateParams, mzServer) {
return {
restrict: 'EA',
require: "ngModel",
link: function (scope, element, attrs, ngModelController) {
scope.$watch(attrs.ngModel, function (data) {
if (attrs.required) {
ngModelController.$setValidity('uploadFile', false);
}
if (mzServer.isEmptyOrNull(data) || angular.isUndefined(data))
{
$(element).fileinput('refresh', { initialPreview: ["/images/no_img.jpg"], initialPreviewAsData: true, });
}
else
{
if ($stateParams.OpType.toLowerCase() == "query" || $stateParams.OpType.toLowerCase() == "edite") {
debugger
if (data.indexOf(",") > 0) {
var arrimg = [];
darray = data.split(",");
for (var i = 0; i < darray.length; i++) {
arrimg.push(attrs.readimg + "/" + darray[i]);
}
}
$(element).fileinput('refresh', { initialPreview: arrimg, initialPreviewAsData: true, });
}
if ($stateParams.OpType.toLowerCase() == "query")
{
$('.file-caption-main').hide();
}
ngModelController.$setValidity('uploadFile', true);
}
});
$(element).fileinput({
language: 'zh', //设置语言
uploadUrl: "/form/FileUpload/" + $stateParams.ConfigName + "/" + $stateParams.OpType + "/" + attrs.uploadFile || null, //上传的地址
autoReplace: true,
allowedFileExtensions: ['jpg', 'gif', 'png', 'jpeg','bmp'],//接收的文件后缀
showUpload: true, //是否显示上传按钮
showCancel: false,
showRemove: true,
showCaption: true,//是否显示标题
browseClass: "btn btn-primary", //按钮样式
dropZoneEnabled: false,//是否显示拖拽区域
//minImageWidth: 50, //图片的最小宽度
//minImageHeight: 50,//图片的最小高度
//maxImageWidth: 1000,//图片的最大宽度
//maxImageHeight: 1000,//图片的最大高度
//maxFileSize: 0,//单位为kb，如果为0表示不限制文件大小
//minFileCount: 0,
maxFileCount: 3, //表示允许同时上传的最大文件个数
validateInitialCount: true,
enctype: 'multipart/form-data',
previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}！"
}
).on('fileuploaded', function (event, data, previewId, index) {
if (data.response.ResponseMessage.Success) {
var rrr = scope;
if (data.files.length >= 1) {
if (!scope.object[attrs.name]) {
scope.object[attrs.name] = data.response.Status;
} else {
scope.object[attrs.name] = scope.object[attrs.name] + "," + data.response.Status;
}
}
ngModelController.$setValidity('uploadFile', true);
} else {
ngModelController.$setValidity('uploadFile', false);
mzServer.error(data.response.ResponseMessage.ErrorMessage);
}
})
.on('filebatchuploadcomplete', function (event, files, extra) {
if (!$(this).closest('.file-input .btn-file input').attr('multiple')) {
$(this).closest('.file-input .btn-file').attr('disabled', 'disabled');
$(this).closest('.file-input .btn-file input').attr('disabled', 'disabled');
}
angular.element('.file-input .fileinput-remove-button').removeAttr('disabled');
}).on("fileclear", function (event) {//移除调用事件
ngModelController.$setViewValue();
if (attrs.required)
ngModelController.$setValidity('uploadFile', false);
else
ngModelController.$setValidity('uploadFile', true);
$(this).closest('.file-input .btn-file').removeAttr('disabled');
$(this).closest('.file-input .btn-file input').removeAttr('disabled');
});
}
}
}]);结果集：
//上传图片按钮
var uploadFile = (['$stateParams', 'mzServer', function ($stateParams, mzServer) {
return {
restrict: 'EA',
require: "ngModel",
link: function (scope, element, attrs, ngModelController) {
scope.$watch(attrs.ngModel, function (data) {
if (attrs.required) {
ngModelController.$setValidity('uploadFile', false);
}
if (mzServer.isEmptyOrNull(data) || angular.isUndefined(data))
{
$(element).fileinput('refresh', { initialPreview: ["/images/no_img.jpg"], initialPreviewAsData: true, });
}
else
{
if ($stateParams.OpType.toLowerCase() == "query" || $stateParams.OpType.toLowerCase() == "edite") {
//debugger
if ($stateParams.OpType.toLowerCase() == "query")
{
$('.file-caption-main').hide();
}
var urlhead = attrs.readimg.replace(/\/wwwroot/, "") + "/";
var arrimg = [];
if (data.indexOf(",") > 0) {
darray = data.split(",");
for (var i = 0; i < darray.length; i++) {
arrimg.push(urlhead + darray[i]);
}
} else {
arrimg.push(urlhead + data);
}
$(element).fileinput('refresh', { initialPreview: arrimg, initialPreviewAsData: true, });
}
ngModelController.$setValidity('uploadFile', true);
}
});
$(element).fileinput({
language: 'zh', //设置语言
uploadUrl: "/form/FileUpload/" + $stateParams.ConfigName + "/" + $stateParams.OpType + "/" + attrs.uploadFile || null, //上传的地址
autoReplace: true,
allowedFileExtensions: ['jpg', 'gif', 'png', 'jpeg','bmp'],//接收的文件后缀
showUpload: true, //是否显示上传按钮
showCancel: false,
showRemove: true,
showCaption: true,//是否显示标题
browseClass: "btn btn-primary", //按钮样式
dropZoneEnabled: false,//是否显示拖拽区域
//minImageWidth: 50, //图片的最小宽度
//minImageHeight: 50,//图片的最小高度
//maxImageWidth: 1000,//图片的最大宽度
//maxImageHeight: 1000,//图片的最大高度
//maxFileSize: 0,//单位为kb，如果为0表示不限制文件大小
//minFileCount: 0,
maxFileCount: 3, //表示允许同时上传的最大文件个数
validateInitialCount: true,
enctype: 'multipart/form-data',
previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}！"
}
).on('fileuploaded', function (event, data, previewId, index) {
if (data.response.ResponseMessage.Success) {
var rrr = scope;
if (data.files.length >= 1) {
if (!scope.object[attrs.name]) {
scope.object[attrs.name] = data.response.Status;
} else {
scope.object[attrs.name] = scope.object[attrs.name] + "," + data.response.Status;
}
}
ngModelController.$setValidity('uploadFile', true);
} else {
ngModelController.$setValidity('uploadFile', false);
mzServer.error(data.response.ResponseMessage.ErrorMessage);
}
})
.on('filebatchuploadcomplete', function (event, files, extra) {
if (!$(this).closest('.file-input .btn-file input').attr('multiple')) {
$(this).closest('.file-input .btn-file').attr('disabled', 'disabled');
$(this).closest('.file-input .btn-file input').attr('disabled', 'disabled');
}
angular.element('.file-input .fileinput-remove-button').removeAttr('disabled');
}).on("fileclear", function (event) {//移除调用事件
ngModelController.$setViewValue();
if (attrs.required)
ngModelController.$setValidity('uploadFile', false);
else
ngModelController.$setValidity('uploadFile', true);
$(this).closest('.file-input .btn-file').removeAttr('disabled');
$(this).closest('.file-input .btn-file input').removeAttr('disabled');
});
}
}
}]); "ConnectionStrings": {
//"DefaultConnection": "Data Source=MARVIN-PC\\MSSQL2008;Initial Catalog=PPGDB;User Id=sa;Password=Password01!;",
"DefaultConnection": "Data Source=192.168.0.210;Initial Catalog=PPGDB;User Id=sa;Password=Password01!;",
//"DefaultConnection": "Data Source=192.168.0.210;Initial Catalog=WyethMDM0727_Live_2016;User Id=mdm;Password=Password01!;",
//"DefaultConnection": "Data Source=192.168.0.210;Initial Catalog=WyethMDM718_Live;User Id=mdm;Password=Password01!;",
//"DefaultConnection": "Data Source=TOBY-PC;Initial Catalog=WyethMDM_816Live;User Id=sa;Password=Password01!;",
"ConnectionStringHistory": "Data Source=192.168.0.246\\KENMSSQLSERVER;Initial Catalog=KenTestDB;User Id=sa;Password=Password01!;"
},
"CustemConfig": {
"GlobalConfigFilePath": "wwwroot/Configuration/GlobalConfigFilePath.xml,wwwroot/Configuration/GlobalConfigFilePathForForm.xml,wwwroot/Configuration/GlobalConfigFilePathForGridView.xml",
//批量导入上传目录
"ImportDirectory": "./wwwroot/uploads/image/excel",
//图片上传目录
"ImageDirectory": "./wwwroot/uploads/image",
"": null,
//图片是否上传微软云
"UploadMicrosoftAzure": true,
//微软云密钥
"StorageConnectionString": "DefaultEndpointsProtocol=https;AccountName=ppgblob;AccountKey=/Yx4JrlbZGrlvT2BAFN9XVH7JbW4g0EbWJLiByQwvYYWtLnnlB4jsfLg0EFxINIbFYLVNYw/SeXnC7ZGTb1oGw==;EndpointSuffix=core.chinacloudapi.cn",
//图片读取目录
"ImageReadDirectory": "", //https: //ppgblob.blob.core.chinacloudapi.cn/image
//版本号，更新任何版本，请更新此版本号，主要是服务器主动清除客户端的JS/CSS缓存问题
"VersionNumber": "20160708_03",
//调试模式，调试模式Form表示会出现调试数据，调试模式会无版本缓存
"DebugMode": true,
//跳转登录的用户名是否是加密
"LoginPageUserNameIsEncrypt": true, function imgBindFn(mzServer) {
return {
restrict: "A",
require: "ngModel",
link: function ($scope, ele, attrs, ngModelController) {
$scope.$watch(attrs.ngModel, function (viewValue) {
if (!ngModelController.$isEmpty(viewValue)) {
var urlhead = attrs.readimg.replace(/\/wwwroot/, "") + "/";
if (viewValue.indexOf(",") > 0) {
var arrimg = [];
var darray = viewValue.split(",");
var content = "";
for (var i = 0; i < darray.length; i++) {
arrimg.push(urlhead + darray[i]);
var imgsrc = arrimg[i];
content += " <a data-gallery='' href='" + imgsrc + "'><img class='img-rounded' style='width:210px;height:160px;' src='" + imgsrc + "' /> </a>";
}
} else {
var imgsrc = urlhead + viewValue;
var content = " <a data-gallery='' href='" + imgsrc + "'><img class='img-rounded' style='width:210px;height:160px;' src='" + imgsrc + "' /> </a>"
}
$(ele).html(content);
}
})
}
}
}
//读取图片路径
var readImg = ConfigManage.GetSystecmConfigValue("CustemConfig:ImageReadDirectory");
if (string.IsNullOrWhiteSpace(readImg))
{
readImg = ConfigManage.GetSystecmConfigValue("CustemConfig:ImageDirectory");
}
<div class="@itemElement.Class.ModeClass" @Html.Raw(display)>
@*<div class="form-group form-group-sm">*@
<div class="@itemElement.Class.LabelBeforeClass">@itemElement.TextInfo.LableBeforeText</div>
<div class="@itemElement.Class.InputParentClass " ng-model="object.@(itemElement.Model)" readimg="@readImg" img-bind="">
</div>
@*</div>*@
</div>
}
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
