KendoUI移动链接给点击“对象没有方法”错误

问题描述：

我在我的Kendo Mobile应用程序中使用来自Thomas j Bradley的奇妙Signature Pad。

我是相当新的KendoUI和HTML5一般所以也许我已经被忽视的东西，但继承人的问题...

我有以下链接：

<a href="signaturepad.html" data-role="button" class="details-link">Parcel Delivered</a>

当我点击链接，但是，它给了我“Uncaught TypeError：Object [object Object]没有方法'signaturePad'”错误。

这是我的signaturepad.html页面，任何人都可以查看是否有某些我在signaturepad.html页面中忽略的内容？

<body> 
<div id="signaturePad" data-role="view" data-layout="default" align="center"> 
    <form method="post" action="" class="sigPad"> 
     <label for="name">Print your name</label> 
     <input type="text" name="name" id="name"/> 
     <p class="typeItDesc">Review your signature</p> 
     <p class="drawItDesc">Draw your signature</p> 
     <ul class="sigNav"> 
      <li class="typeIt"><a href="#type-it" class="current">Type It</a></li> 
      <li class="drawIt"><a href="#draw-it">Draw It</a></li> 
      <li class="clearButton"><a href="#clear">Clear</a></li> 
     </ul> 
     <div class="sig sigWrapper"> 
      <div class="typed"></div> 
      <canvas class="pad" width="198" height="55"></canvas> 
      <input type="hidden" name="output" class="output" /> 
     </div> 
     <button type="submit">I accept delivery of this parcel.</button> 
    </form> 
</div> 
<script src="js/kendo.all.min.js"></script> 
<script> 
    $(document).ready(function() { 
     $('.sigPad').signaturePad(); 
    }); 
</script>

如果我手动导航到signaturepad.html它显示但不显示KendoUI造型。

我已将这些类添加到“kendo.mobile.all.min.css”文件。

任何帮助将不胜感激！

答

您不必在signaturepad.html中再次添加Kendo参考文件，因为此html文件将使用ajax加载到父视图中。还有$（'。sigPad'）。signaturePad（）;需要在视图的data-init方法中调用，而不是在document.ready事件中调用。永远记住，Kendo Mobile应用程序是一个单页面应用程序，不应在应用程序内发生回传。所以你不应该在移动应用中使用表单发布...你应该使用调用你的服务方法使用Ajax发送数据到服务器。在这种情况下，您可以将签名的图像作为数据通过ajax发送到服务器。

更改你的代码是这样的：

div id="signaturePad" data-init="initView" data-role="view" data-layout="default" align="center"> 
    <form method="post" action="" class="sigPad"> 
     <label for="name">Print your name</label> 
     <input type="text" name="name" id="name"/> 
     <p class="typeItDesc">Review your signature</p> 
     <p class="drawItDesc">Draw your signature</p> 
     <ul class="sigNav"> 
      <li class="typeIt"><a href="#type-it" class="current">Type It</a></li> 
      <li class="drawIt"><a href="#draw-it">Draw It</a></li> 
      <li class="clearButton"><a href="#clear">Clear</a></li> 
     </ul> 
     <div class="sig sigWrapper"> 
      <div class="typed"></div> 
      <canvas class="pad" width="198" height="55"></canvas> 
      <input type="hidden" name="output" class="output" /> 
     </div> 
     <button type="submit">I accept delivery of this parcel.</button> 
    </form> 
</div> 

<script> 
function initView(e){ 
     $('.sigPad').signaturePad(); 
} 

</script>

你的先生，是一个绅士和学者！ – 2013-05-08 10:52:29

KendoUI移动链接给点击“对象没有方法”错误

相关推荐