Question

我有一个无法呈现的Kendo UI Core下拉列表。如果我将kendodropdownlist放在index.html文件中就可以了。此外，如果我将其放在具有div的本地index.html（仍在data-role="view"）中，则可以使用。但是，如果我将它放在我用作视图的另一个HTML文件中，它将不会呈现为kendodropdownlist。 Kendo JS不适用于该文件。索引文件正在使用<script src="js/kendo.ui.core.min.js"></script>。在阅读Kendo UI文档时，一旦我在index.html文件中初始化CSS和JS，就不需要在任何视图中再次调用它。所以JS文件只在index.html文件中调用。为什么我无法在KendoDropdownList中呈现views/drowndownview.html？我创建了一个github，如果有人想运行它并查看更多信息，所有文件都可以正常工作。 https://github.com/jacquelineflemming/kendodropdownlist

文件结构

index.html
views/
  drowndownview.html

在index.html内，我在select的本地div中有一个data-role="view"，也是在初始视图中。 select这里的两个都按预期工作和渲染：

<div id="welcome" data-role="view" data-layout="default" data-title="Welcome" class="buttonAppearance">
    <h1>DropDownList Demo</h1>
    <p>
    Kendo Drop Down List View Demo
    </p>

    <br />
    <br />
  <select id="sizes" class=".k-dropdown" >
    <option>S - 6 3/4"</option>
    <option>M - 7 1/4"</option>
    <option>L - 7 1/8"</option>
    <option>XL - 7 5/8"</option>
  </select>

  <p>
    <a href="#list" class="" id="dropdownreflocal" data-role="button" >KendoDropDown Localview</a>
  </p>
  <p>
    <a href="views/dropdownview.html" class="" id="dropdownref" data-role="button" >KendoDropDown View</a>
  <p>
</div>

<div id="list" data-role="view" data-layout="default">
  <select id="churchselect" class=".k-dropdown" >
    <option>S - 6 3/4"</option>
    <option>M - 7 1/4"</option>
    <option>L - 7 1/8"</option>
    <option>XL - 7 5/8"</option>
  </select>
</div>

<script src="js/jquery.min.js"></script>
<script src="js/kendo.ui.core.min.js"></script>

<script>
  // Add a default transition for all views, to get a native
  // feel
  var app = new kendo.mobile.Application( $(document.body),{
    transition:'slide'
  });

  $('#sizes').kendoDropDownList();
  $('#churchselect').kendoDropDownList();

</script>

在文件views/dropdownview.html中，我有一个类似select的{{1}}。其实我有3个不同的版本，但为了简洁起见，我只会粘贴一个：

id

2014年11月7日更新：

我在评论中指出，使用属性<!DOCTYPE html> <html> <head> <title>Drop Down List View</title> </head> <body> <div id="dropdownview" data-role="view" data-layout="default" data-title="Drop Down List"> <div class="container" > <div class="appname" > <h1>Drop Down List</h1> </div> <form action="#" id="form-dropdownview">  <select id="churchselect" class=".k-dropdown" > <option>S - 6 3/4"</option> <option>M - 7 1/4"</option> <option>L - 7 1/8"</option> <option>XL - 7 5/8"</option> </select>  </form> <script> $("#churchselect").kendoDropDownList(); </script> </div> </body>更新select，它确实有效。但我无法使用data-role="dropdownlist"设置kendoDropDownList()或其他任何内容。

KendoDropDownList在外部视图中不呈现

0 个答案: