2013-12-11 76 views
1

我嘗試使用香菜進行驗證與流星關注此問題使用JavaScript流星工作:Using Parsley.js with Meteor using HTML Code無法獲得parsley.js與渲染的

我在Ubuntu 13.10運行流星0.6.6.3,加入包jQuery和從大氣中添加歐芹1.1.7與隕石(https://atmosphere.meteor.com/package/parsleyjs)。

我也用client/lib的parsley的當前版本1.2.2(用mrt刪除parsleyjs後)測試過。

知道我不能使用的HTML標記驗證我創建了最後一行渲染模板這樣

<template name="new_customer"> 
    <form id="new_customer_form"> 
    <div class="newCustomer">   
     <div class="lookupcell"> 
     <input type="text" size="1" 
       name="new-customer-name" 
       id="new-customer-name" 
       class="new-customer-name" 
       placeholder="neue Firma/Person" 
       parsley-notblank="true" /> 
     </div> 
     <div class="lookupcell"> 
     <input type="text" size="1" id="new-customer-email" 
       name="new-customer-email" 
       id="new-customer-email" 
       parsley-type="email" 
       parsley-trigger="keyup" 
       class="new-customer-email" placeholder="Email" /> 
     </div> 
    </div> 
    <div style="text-align: right;"> 
     <button type="submit">Add</button> 
     </div> 
    </form> 
</template> 

和設置以下JavaScript

Template.new_customer.rendered = function() { 
    console.log("rendered new_customer"); 
    $new_customer_form = $('#new_customer_form'); 
    if (! $new_customer_form) { 
     console.log("form not found."); 
     return; 
    } 
    $new_customer_form.parsley(); 
    $new_customer_form.parsley('addItem', '#new_customer_name'); 
}; 

流星墜落當我嘗試添加以下堆棧跟蹤字段#new_customer_name時

[09:44:11.969] "Exception from Deps afterFlush function: [email protected]://localhost:3000/packages/parsleyjs.js?ed9f338553f590de7edeb7b3e5ca8cb568f2e74d:1152 
[email protected]://localhost:3000/packages/parsleyjs.js?ed9f338553f590de7edeb7b3e5ca8cb568f2e74d:1295 
[email protected]://localhost:3000/packages/parsleyjs.js?ed9f338553f590de7edeb7b3e5ca8cb568f2e74d:1305 
[email protected]://localhost:3000/client/X4Lizenzen.js?7d0644137e559b675577266ad6e2f78f087b3453:151 
Template.__define__/partial/html</html<[email protected]://localhost:3000/packages/templating.js?5944cd5e16b26fbf83959a0fe92d7754029a624d:181 
scheduleOnscreenSetup/</<@http://localhost:3000/packages/spark.js?3a050592ceb34d6c585c70f1df11e353610be0ab:443 
[email protected]://localhost:3000/packages/underscore.js?13ab483e8a3c795d9991577e65e811cd0b827997:130 
scheduleOnscreenSetup/<@http://localhost:3000/packages/spark.js?3a050592ceb34d6c585c70f1df11e353610be0ab:441 
[email protected]://localhost:3000/packages/deps.js?5ac28feec1f3e0539889ecde598dd9d01e408b41:265 
" 

堆棧並沒有告訴我實際的問題是什麼(或者說我不明白:-) 所以我想知道鏈接問題的作者如何通過render()中的設置讓他的設置工作。任何想法的人?

更新:事實證明,我犯了一個簡單的錯誤,直到今天早上我才發現。 我在模板中有id="new-customer-name",並嘗試使用#new_customer_name註冊歐芹字段。這不能工作,更重要的是,連字符不能用於id字符串。糾正錯誤後,它的工作。

+0

嘗試在頁面加載完成後運行JavaScript控制檯中'.rendered'回調中的代碼並查看錯誤是否存在。它應該給出更多的細節 – Akshat

+0

感謝您的提示。當我運行$('#new_customer_form').parsley();在控制檯中,我找回了一個「parsleyForm」類型的對象,這對我來說很好。輸入$('#new_customer_form').parsley('addItem','#new_customer_name');我得到'TypeError:a是null'。我不知道這應該是什麼意思。 –

回答

0

我想你需要添加data-parsley-validate,如下所示。如果它的工作沒有使用,讓我知道。我想知道它是如何呈現與在表單中使用數據 - 香芹 - 驗證。

form id="new_customer_form" data-parsley-validate