How to take the path to the image inserted with Insert Image dialog?

6748

[Infragistics]Lyuba posted over 14 years ago

When we click on "Insert Image" Option on the Tool bar of the Infragistics WebHTMLEditor a popup dialog opens.
On that window on the left top the list of files uploaded are displayed and the right top portion displays a preview of those files.
In order to insert an image in the content area of the Editor we need to select the respective files on the top left portion of the window and then click OK. Now as OK is clicked we want to fetch the path of the image that is being inserted in the content area of the Editor. The path is displayed in the TextBox control beside the label "Source" on the window that is popped up.

Please, kindly advise us of how can we read the path of the image that is selected to be inserted in the content area of the Infragistics Editor.

Thank You,

Regards,

820

AniLex posted over 13 years ago in reply to [Infragistics]Lyuba

Is it possible to do the above thing with the file upload also?

<ighedit:ToolbarUploadButton runat="server" Type="Open">
                                <Upload Filter="*.pdf,*.txt,*.xls,*.doc" Mode="Upload" AllowDelete="true" Height="350px" Width="500px">
                                </Upload>
                            </ighedit:ToolbarUploadButton>

Thanks and Regards,

Ani
Cancel
Cancel
6748

[Infragistics]Lyuba posted over 14 years ago

WebHtmlEditor does not support access properties of Upload dialogs like insert image. That dialog is a window generated on server in response on async request from client on a tool-button click.

There are no public options to change fields in that dialog or to get values from them.

However, when upload dialogs are displayed, then they use ig_htmleditor_upload.js file. That means that it is possible to modify those scripts, find references to any elements used by dialogs and use their values.

In order to do that in your application you should create local directory to project (for example ~/js), copy there all js files used by WebHtmlEditor(they are located at /%ProgramFiles%/Infragistics/%InfragisticsVersion%/ASP.NET/CLR3.5/Scripts) and set JavaScriptDirectory of the webhtmleditor to the path to the js folder in your application. So, WebHtmlEditor will use not default (embedded) js files, but those custom files and any new logic in ig_htmleditor_updload.js will be used automatically.

I created a sample that illustrates this suggestion. I added this files to the js folder of the sample and I modified the file ig_htmleditor_upload.js to save this path to a hidden field on your form ( the modified method in the js file is iged_updateImg, and the line that I added is opener.document.getElementById("hidden").value = v;).

After the image is inserted I alert the content of the hidden field to which the path is stored.

Keep in mind that if you decide to use this approach in your real application, you should not use the js files from my sample, but copy the ones from your scripts folder, because they are the ones that correspond to the version that you are using.
Cancel
Cancel