Javascript RadImageEditor onSaving事件不允许发送响应脚本
我正在使用2013.1.220.40版本的Telerik RadImageEditor控件,该控件放在页面上,页面显示在一个窗口中。我只想传递一个url或不传递(分别用于更新和添加场景),当用户单击图像编辑器中的保存按钮时,在弹出窗口中剪切图像后,我想通过向Ajax管理器添加响应脚本将路径发送回页面。所有这些都工作正常,但响应脚本不工作。我试图在OnSave事件中放置一个隐藏字段来保存值,然后捕获Image Editor的onClientSaved事件,但是隐藏字段的值总是返回空的。似乎所有的值在离开onSaving事件后都会重置。图像成功保存在目录中时。 我不知道我遗漏了什么导致了这个错误。请帮帮我 这是服务器端代码Javascript RadImageEditor onSaving事件不允许发送响应脚本,javascript,asp.net,telerik,Javascript,Asp.net,Telerik,我正在使用2013.1.220.40版本的Telerik RadImageEditor控件,该控件放在页面上,页面显示在一个窗口中。我只想传递一个url或不传递(分别用于更新和添加场景),当用户单击图像编辑器中的保存按钮时,在弹出窗口中剪切图像后,我想通过向Ajax管理器添加响应脚本将路径发送回页面。所有这些都工作正常,但响应脚本不工作。我试图在OnSave事件中放置一个隐藏字段来保存值,然后捕获Image Editor的onClientSaved事件,但是隐藏字段的值总是返回空的。似乎所有的值
public void RadImageEditor1_ImageSaving(object sender, Telerik.Web.UI.ImageEditorSavingEventArgs e)
{
string filename = e.FileName;
//If Derectory not exist, creat new
if (!Directory.Exists(Server.MapPath(ConfigurationManager.AppSettings["TempImagePath"])))
Directory.CreateDirectory(Server.MapPath(ConfigurationManager.AppSettings["TempImagePath"]));
//Set Image Path
Path = ConfigurationManager.AppSettings["TempImagePath"] + "/" + filename.Trim() + Extention;
if (File.Exists(Path))
File.Delete(Path);
//Save image to temp directory
e.Image.Image.Save(Server.MapPath(Path));
//Send image path back to the page where this popup Appeared
RadAjaxManager1.ResponseScripts.Add("CloseAndSendPath('" + Path +"')");
//ClientScript.RegisterStartupScript(this.Page.GetType(), "CloseAndRebind", "<script>CloseAndRebind('" + Path + "');</script>");
//Cancel built in Saving.
e.Cancel = true;
}
public string Path
{
get
{
if (ViewState["Path"] == null)
return string.Empty;
else
return ViewState["Path"].ToString();
}
set
{
ViewState["Path"] = value;
}
}
public string Extention
{
get
{
if (ViewState["Extention"] == null)
return string.Empty;
else
return ViewState["Extention"].ToString();
}
set
{
ViewState["Extention"] = value;
}
}
public void BtnDeleteClick(object sender, EventArgs e)
{
Context.Cache.Remove(Session.SessionID + "UploadedFile");
Path = string.Empty;
Extention = string.Empty;
imgUploaded.ImageUrl = string.Empty;
}
public void BtnCropClick(object sender, EventArgs e)
{
panelCrop.Visible = panelUpload.Visible;
panelUpload.Visible = !panelCrop.Visible;
}
public void BtnUploadClick(object sender, EventArgs e)
{
imgUploaded.ImageUrl = Path;
}
public void RadAsyncUpload1_FileUploaded(object sender, Telerik.Web.UI.FileUploadedEventArgs e)
{
//Clear changes and remove uploaded image from Cache
RadImageEditor1.ResetChanges();
Context.Cache.Remove(Session.SessionID + "UploadedFile");
using (Stream stream = e.File.InputStream)
{
byte[] imgData = new byte[stream.Length];
stream.Read(imgData, 0, imgData.Length);
MemoryStream ms = new MemoryStream();
ms.Write(imgData, 0, imgData.Length);
Context.Cache.Insert(Session.SessionID + "UploadedFile", ms, null, DateTime.Now.AddMinutes(20), TimeSpan.Zero);
}
//Save to Temp Folder as well
string fileExt = e.File.GetExtension().ToLower();
if (fileExt != ".jpg" && fileExt != ".png" && fileExt != ".jpeg" && fileExt != ".bmp" && fileExt != ".gif")
{
lblError.Text = "Please upload photo only in .jpg, .jpeg, .png, .bmp or .gif format";
return;
}
string filename = e.File.FileName;
Extention = fileExt;
if (!Directory.Exists(Server.MapPath(ConfigurationManager.AppSettings["TempImagePath"])))
Directory.CreateDirectory(Server.MapPath(ConfigurationManager.AppSettings["TempImagePath"]));
Path = ConfigurationManager.AppSettings["TempImagePath"] + "/" + filename.Trim();
e.File.SaveAs(Server.MapPath(Path));
}
public void RadImageEditor1_ImageLoading(object sender, Telerik.Web.UI.ImageEditorLoadingEventArgs e)
{
//Handle Uploaded images
if (!Object.Equals(Context.Cache.Get(Session.SessionID + "UploadedFile"), null))
{
using (EditableImage image = new EditableImage((MemoryStream)Context.Cache.Get(Session.SessionID + "UploadedFile")))
{
e.Image = image.Clone();
e.Cancel = true;
}
}
}
protected void Page_Init(object sender, EventArgs e)
{
if (!IsPostBack)
{
if (!string.IsNullOrEmpty(Request.QueryString["usertype"]))
{
string usertype = Request.QueryString["usertype"];
switch (usertype)
{
case "employee":
case "customer":
RadImageEditor1.ExternalDialogsPath = "~/Controls/Crop/Employee/ImageEditorDialogs";
break;
case "company":
RadImageEditor1.ExternalDialogsPath = "~/Controls/Crop/Company/ImageEditorDialogs";
break;
}
}
}
}
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
Context.Cache.Remove(Session.SessionID + "UploadedFile");
if (!string.IsNullOrEmpty(Request.QueryString["path"]))
{
Path = Request.QueryString["path"];
imgUploaded.ImageUrl = Path;
System.IO.FileInfo file = new FileInfo(Path);
if (file != null)
{
Extention = file.Extension;
using (FileStream stream = new FileStream(Server.MapPath(Path), FileMode.Open))
{
byte[] imgData = new byte[stream.Length];
stream.Read(imgData, 0, imgData.Length);
MemoryStream ms = new MemoryStream();
ms.Write(imgData, 0, imgData.Length);
Context.Cache.Insert(Session.SessionID + "UploadedFile", ms, null, DateTime.Now.AddMinutes(20), TimeSpan.Zero);
}
}
}
}
}
public void RadImageEditor1\u图像保存(对象发送方,Telerik.Web.UI.imageeditorsavingeventagrs e)
{
字符串文件名=e.filename;
//如果目录不存在,请创建新目录
如果(!Directory.Exists(Server.MapPath(ConfigurationManager.AppSettings[“TempImagePath”]))
CreateDirectory(Server.MapPath(ConfigurationManager.AppSettings[“TempImagePath”]);
//设置图像路径
Path=ConfigurationManager.AppSettings[“TempImagePath”]+“/”+文件名.Trim()+扩展名;
if(File.Exists(Path))
删除(路径);
//将映像保存到临时目录
e、 Image.Image.Save(Server.MapPath(Path));
//将图像路径发送回出现此弹出窗口的页面
RadAjaxManager1.ResponseScripts.Add(“CloseAndSendPath(““+Path+”)”);
//RegisterStartupScript(this.Page.GetType(),“CloseAndRebind”,“CloseAndRebind(““+Path+”);”);
//取消内置保存。
e、 取消=真;
}
公共字符串路径
{
得到
{
如果(视图状态[“路径”]==null)
返回字符串。空;
其他的
返回ViewState[“Path”].ToString();
}
设置
{
视图状态[“路径”]=值;
}
}
公共字符串扩展
{
得到
{
if(视图状态[“扩展”]==null)
返回字符串。空;
其他的
返回ViewState[“扩展”].ToString();
}
设置
{
ViewState[“扩展”]=值;
}
}
public void btndeleteck(对象发送者,事件参数e)
{
Remove(Session.SessionID+“UploadedFile”);
Path=string.Empty;
Extention=string.Empty;
imgUploaded.ImageUrl=string.Empty;
}
public void BtnCropClick(对象发送者,事件参数e)
{
panelCrop.Visible=panelUpload.Visible;
panelUpload.Visible=!panelCrop.Visible;
}
public void BtnUploadClick(对象发送方,事件参数e)
{
imgUploaded.ImageUrl=路径;
}
public void RadAsyncUpload1_FileUploaded(对象发送方,Telerik.Web.UI.FileUploadedEventArgs e)
{
//清除更改并从缓存中删除上载的图像
RadImageEditor1.ResetChanges();
Remove(Session.SessionID+“UploadedFile”);
使用(Stream-Stream=e.File.InputStream)
{
byte[]imgData=新字节[stream.Length];
读取(imgData,0,imgData.Length);
MemoryStream ms=新的MemoryStream();
ms.Write(imgData,0,imgData.Length);
Context.Cache.Insert(Session.SessionID+“UploadedFile”,ms,null,DateTime.Now.AddMinutes(20),TimeSpan.Zero);
}
//也保存到临时文件夹
字符串fileExt=e.File.GetExtension().ToLower();
如果(fileExt!=”.jpg“&&fileExt!=”.png“&&fileExt!=”.jpeg“&&fileExt!=”.bmp“&&fileExt!=”.gif”)
{
lblError.Text=“请仅上传.jpg、.jpeg、.png、.bmp或.gif格式的照片”;
返回;
}
字符串文件名=e.File.filename;
扩展=文件扩展;
如果(!Directory.Exists(Server.MapPath(ConfigurationManager.AppSettings[“TempImagePath”]))
CreateDirectory(Server.MapPath(ConfigurationManager.AppSettings[“TempImagePath”]);
Path=ConfigurationManager.AppSettings[“TempImagePath”]+“/”+filename.Trim();
e、 File.SaveAs(Server.MapPath(Path));
}
public void RadImageEditor1_ImageLoading(对象发送方,Telerik.Web.UI.ImageEditorLoadingEventArgs e)
{
//处理上传的图像
如果(!Object.Equals(Context.Cache.Get(Session.SessionID+“UploadedFile”),则为null)
{
使用(EditableImage=neweditableimage((MemoryStream)Context.Cache.Get(Session.SessionID+“UploadedFile”))
{
e、 Image=Image.Clone();
e、 取消=真;
}
}
}
受保护的无效页_Init(对象发送方,事件参数e)
{
如果(!IsPostBack)
{
如果(!string.IsNullOrEmpty(Request.QueryString[“usertype”]))
{
字符串usertype=Request.QueryString[“usertype”];
开关(用户类型)
{
案例“雇员”:
案例“客户”:
RadImageEditor1.ExternalDialogsPath=“~/Controls/Crop/Employee/ImageEditorDialogs”;
<form id="form1" runat="server">
<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
<Scripts>
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js">
</asp:ScriptReference>
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js">
</asp:ScriptReference>
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js">
</asp:ScriptReference>
</Scripts>
</telerik:RadScriptManager>
<telerik:RadAjaxLoadingPanel ID="loadingPanel1" runat="server">
</telerik:RadAjaxLoadingPanel>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" LoadingPanelID="loadingPanel1">
<AjaxSettings>
</AjaxSettings>
</telerik:RadAjaxManager>
<asp:Panel ID="panelUpload" runat="server" DefaultButton="btnUpload">
<telerik:RadAsyncUpload ID="RadAsyncUpload1" runat="server" OnFileUploaded="RadAsyncUpload1_FileUploaded"
MaxFileSize="5242880" OnClientValidationFailed="validationFailed" AllowedFileExtensions="jpg,png,gif,bmp"
AutoAddFileInputs="false" OnClientFileUploadRemoved="fileRemoved" MaxFileInputsCount="1"
HideFileInput="true" Localization-Select="Browse">
</telerik:RadAsyncUpload>
<asp:Label ID="lblError" runat="server" ForeColor="Red" ViewStateMode="Disabled"></asp:Label>
<asp:Panel ID="PanelButtons" runat="server">
<asp:Button ID="btnUpload" Text="Upload Image" runat="server" CausesValidation="False"
OnClick="BtnUploadClick"></asp:Button>
<asp:Button ID="btnCrop" runat="server" Text="Crop" OnClick="BtnCropClick" />
<asp:Button ID="btnDelete" runat="server" Text="Delete" OnClick="BtnDeleteClick" />
<asp:Image ID="imgUploaded" runat="server" Width="150px" Height="150px" />
</asp:Panel>
</asp:Panel>
<asp:Panel ID="panelCrop" runat="server" Visible="false">
<telerik:RadImageEditor ID="RadImageEditor1" runat="server" Width="750px" Height="480px"
ToolsFile="~/Utilities/Tools/ImageUploadToolsFile.xml" OnImageLoading="RadImageEditor1_ImageLoading"
OnImageSaving="RadImageEditor1_ImageSaving" OnClientLoad="ImageEditorLoad">
<Tools>
<telerik:ImageEditorToolGroup>
<telerik:ImageEditorTool Text="SaveImage" CommandName="SaveImage" ImageUrl="~/images/toolBarSprite.png" />
</telerik:ImageEditorToolGroup>
</Tools>
</telerik:RadImageEditor>
</asp:Panel>
<telerik:RadScriptBlock ID="RadScriptBlock" runat="server">
<script type="text/javascript">
function validationFailed(sender, eventArgs) {
$telerik.$("#asyncUpload").html("Validation failed for '" + eventArgs.get_fileName() + "'.").fadeIn("slow");
}
function fileRemoved(sender, eventArgs) {
$telerik.$("#asyncUpload").html('').fadeOut("slow");
}
function waitForCommand(imageEditor, commandName, callback) {
var timer = setInterval(function () {
var widget = imageEditor.get_currentToolWidget();
if (widget && widget.get_name() == commandName) {
clearInterval(timer);
callback(widget);
}
}, 100);
}
Telerik.Web.UI.ImageEditor.CommandList["SaveImage"] = function (imageEditor, commandName, args) {
var dt = new Date();
var year = dt.getFullYear();
var month = dt.getMonth();
var day = dt.getDate(); var hour = dt.getHours();
var min = dt.getMinutes();
var newdate = year + "-" + month + "-" + day + " " + hour + "-" + min;
imageEditor.saveImageOnServer(newdate, true); //saves the image on the server - it either overwrites the file or keeps both files
};
function ImageEditorLoad(imgEditor, args) {
//open the Crop tool dialog with a little timeout
setTimeout(function () {
imgEditor.fire("Crop");
}, 0);
}
function CloseAndSendPath(arg) {
GetRadWindow().BrowserWindow.UpdateImageUrl(arg);//a method from page where this popup appeared
GetRadWindow().close();
}
function GetRadWindow() {
var oWindow = null;
if (window.radWindow) oWindow = window.radWindow; //Will work in Moz in all cases, including clasic dialog
else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow; //IE (and Moz as well)
return oWindow;
}
</script>
</telerik:RadScriptBlock>
</form>