【问题标题】:Changing the Kendo UI upload widget's text更改 Kendo UI 上传小部件的文本
【发布时间】:2013-01-03 07:43:23
【问题描述】:

我想将Select 的默认文本更改为更适合上下文的内容。我正在使用基于 HtmlHelper 类构建的 Kendo Fluent API,但我没有找到在基本功能和本地化中更改文本的方法。

我的代码很简单,看起来像这样:

@(Html.Kendo().Upload()
      .Name("FilesToUpload")
)

thread 中有一个关于更改文本的 jQuery 函数的建议,如果我使用 Upload 小部件的 javascript API,它可以完美运行,但当我通过 Html.Kendo().Upload 创建小部件时它不起作用。

使用 javascript API 更好的是:

localization: {
    select: 'any text'
}

您可以使用的设置,但这对我也没有帮助。

如果有人以前遇到过这个问题并解决了它,我将非常感谢他的帮助。

【问题讨论】:

    标签: c# asp.net-mvc kendo-ui


    【解决方案1】:

    我刚刚在这个thread 的剑道论坛上收到了答复。解决方案也很简单,只是在流畅的界面中隐藏了一些功能:

    @(Html.Kendo().Upload()
          .Name("FilesToUpload")
          .Messages( m => m.Select("Select unit bulk upload file"))
    )
    

    【讨论】:

    • 您还可以使用 UploadSelectedFiles 更改默认“上传文件”按钮的文本。
    【解决方案2】:

    对于 AngularJS 用法,这是一个使用本地化的示例,请注意 k-localization 属性:

    <input name="Images" type="file" kendo-upload
            k-multiple="true"
            k-upload="inventoryProductDetail.uploadImage"
            k-success="inventoryProductDetail.uploadedImage"
            k-async="{ saveUrl: '/API/UploadFile/.json', autoUpload: true }"
            k-localization="{ select: 'SELECT ME!' }" />
    

    【讨论】:

      【解决方案3】:

      不幸的是,您必须遵循on that post 的建议。以下是根据您的情况执行此操作的方法。

      @(Html.Kendo().Upload()
            .Name("FilesToUpload")
      )
      <script type="text/javascript">
          $(document).ready(function () {
              $("#FilesToUpload").closest(".k-upload").find("span").text("my text");
          });
      </script>
      

      我尽量不要认为剑道控制会让我达到 100%,因为那样我会感到失望。相反,假设他们会让你快速到达你想去的地方的 90%。然后用jQuery和一些侦探工作来完善。

      【讨论】:

      • 如果您尝试一下并在 javascript 代码中放置一个断点,您可以看到,即使加载了文档,上传小部件也没有。因此 $("#FilesToUpload").closest(".k-upload").find("span") 代码将返回空结果。将 javascript 代码放在 html 文档的末尾也无济于事。
      • 您必须在不加载所有库的局部视图中执行此操作。在发布此代码之前,我在自己的项目中对其进行了测试。因此,您的问题实际上可能并不直接与此控件有关。在您的 _Layout 页面上进行测试,以确保所有内容都应该加载到哪里,然后将其移动到您需要的位置。
      猜你喜欢
      • 2023-04-03
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-12-05
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多