如何在 Orchard CMS 中使用/添加现有媒体库小部件到自定义小部件中? [英] How to use/add existing Media Library widget into a custom widget in Orchard CMS?

查看：43
本文介绍了如何在 Orchard CMS 中使用/添加现有媒体库小部件到自定义小部件中?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在编写一个自定义小部件，我想创建一个包含从现有媒体库中选择图像的图像选择器的表单.我注意到我可以使用现有的媒体库小部件，但我不知道如何将它包含在我的小部件中.我可以以某种方式从 EditPart 视图中导入它吗?

[更新]这是示例代码的一部分.假设您有这个 Edit Part 模板:

@using MediaLibrary.FilePicker//有没有办法添加它做这样的事情??@model Maps.Models.MapPart<字段集><legend>地图字段</legend><div class="editor-label">@Html.LabelFor(model => model.Latitude)

<div class="editor-field">@Html.TextBoxFor(model => model.Latitude)@Html.ValidationMessageFor(model => model.Latitude)

<div class="editor-label">@Html.LabelFor(model => model.Longitude)

<div class="editor-field">@Html.TextBoxFor(model => model.Longitude)@Html.ValidationMessageFor(model => model.Longitude)

</fieldset>

解决方案

我想出了如何去做.

我试图使用我的自定义小部件中的图像选择器.以下是我为实现此目的而遵循的步骤.

1.将 MediaPicker 库的引用添加到我的 Widget 项目中.2.添加如下代码:

@using Orchard.ContentManagement@using Orchard.Utility.Extensions@using Orchard.MediaPicker@model MyWidget.Models.PickerForm<div class="editor-label"><label for="ImageUrl">图片网址</label>

<div class="editor-field">@Html.TextBoxFor(m => m.ImagePath, new { @class = "text single-line", @id = "ImageUrl" })<br/>@Html.ValidationMessageFor(m => m.ImagePath)
<input type="button" class="button" id="PickImageUrl" value="Pick Image"/>

@using (Script.Foot()){<script type="text/javascript">//<![CDATA[jQuery(函数($){var baseUrl = "@HttpContext.Current.Request.ToRootUrlString().TrimEnd('/')";$("#PickImageUrl").click(function () {$("form").trigger("orchard-admin-pickimage-open",{img: $("#ImageUrl").val(),uploadMediaPath: "关于",回调:函数(数据){$("#ImageUrl").val(baseUrl + data.img.src);}});});});//]]>}

瞧.

I'm writing a custom widget, I want to create a form that contains an image picker that selects the image from the existing media library. I've noticed that I could use the existing Media Library widget, but I have no idea how to include it in my widget. Can I import it from the EditPart view somehow ?

[Update] Here is part of a sample code. Assuming you have this Edit Part template:

@using MediaLibrary.FilePicker //Is there a way to add it doing something like this??
@model Maps.Models.MapPart

<fieldset>
  <legend>Map Fields</legend>

   <div class="editor-label">
     @Html.LabelFor(model => model.Latitude)
   </div>
   <div class="editor-field">
      @Html.TextBoxFor(model => model.Latitude)
      @Html.ValidationMessageFor(model => model.Latitude)
   </div>

    <div class="editor-label">
      @Html.LabelFor(model => model.Longitude)
    </div>
    <div class="editor-field">
      @Html.TextBoxFor(model => model.Longitude)
      @Html.ValidationMessageFor(model => model.Longitude)
    </div>

</fieldset>

解决方案

I figured out how to do it.

I was trying to use the image picker from my custom widget. Here are the steps that I followed to accomplish this.

1.Add a reference to the MediaPicker libary into my Widget project. 2.Add the following code: 

@using Orchard.ContentManagement
@using Orchard.Utility.Extensions
@using Orchard.MediaPicker
@model MyWidget.Models.PickerForm
<div class="editor-label">
    <label for="ImageUrl">Image Url</label>
</div>
<div class="editor-field">
    @Html.TextBoxFor(m => m.ImagePath, new { @class = "text single-line", @id = "ImageUrl" })<br />
    @Html.ValidationMessageFor(m => m.ImagePath)<br />
    <input type="button" class="button" id="PickImageUrl" value="Pick Image" />
</div>
@using (Script.Foot())
{
<script type="text/javascript">
    //<![CDATA[
    jQuery(function ($) {
        var baseUrl = "@HttpContext.Current.Request.ToRootUrlString().TrimEnd('/')";
        $("#PickImageUrl").click(function () {
            $("form").trigger("orchard-admin-pickimage-open",
            {
                img: $("#ImageUrl").val(),
                uploadMediaPath: "About",
                callback: function (data) {
                    $("#ImageUrl").val(baseUrl + data.img.src);
                }
            });
        });
    });
//]]>
</script>
}

And voila.

这篇关于如何在 Orchard CMS 中使用/添加现有媒体库小部件到自定义小部件中?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
其他开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆