2013-09-24 105 views
0

嗨即時嘗試驗證jQuery驗證一些jquery星星。我已經在這裏找到了一些關於這個的答案,但是兩次都沒有運氣。驗證jQuery評級明星

下面是HTML中查看源代碼的原因IM上軌

但其沒有工作,我如何可以驗證該評級明星,讓他們強制要求,XD! thanks..i一直在尋找到這天,請幫助 -

,正如我說,我曾嘗試在其他問題的答案,但他們不是爲我工作

<div id="pasescortos"> 
    <label for="attribute">Short passes</label> 
<span class="star-rating-control"> 
<div class="rating-cancel"><a title="Cancel Rating"></a></div> 
<div class="star-rating rater-0 star star-rating-applied star-rating-live" id="player_short_passes_1"> 

<a title="1">1</a></div><div class="star-rating rater-0 star star-rating-applied star-rating-live" id="player_short_passes_2"> 

<a title="2">2</a></div><div class="star-rating rater-0 star star-rating-applied star-rating-live" id="player_short_passes_3"> 

<a title="3">3</a></div><div class="star-rating rater-0 star star-rating-applied star-rating-live" id="player_short_passes_4"> 

<a title="4">4</a></div><div class="star-rating rater-0 star star-rating-applied star-rating-live" id="player_short_passes_5"> 

<a title="5">5</a></div></span> 

<input class="star star-rating-applied" id="player_short_passes_1" name="player[short_passes]" type="radio" value="1" style="display: none;"> 

<input class="star star-rating-applied" id="player_short_passes_2" name="player[short_passes]" type="radio" value="2" style="display: none;"> 

<input class="star star-rating-applied" id="player_short_passes_3" name="player[short_passes]" type="radio" value="3" style="display: none;"> 

<input class="star star-rating-applied" id="player_short_passes_4" name="player[short_passes]" type="radio" value="4" style="display: none;"> 

<input class="star star-rating-applied" id="player_short_passes_5" name="player[short_passes]" type="radio" value="5" style="display: none;"> 

    </div> 

這裏是JS。

$().ready(function() { 

    // validate signup form on keyup and submit 
$(".edit_player").validate({ 
ignore:'', // initialize the plugin 
     errorElement: 'div'}); 




$("#player_position").rules("add", { required: true, messages: { required: "<%= t('generales.camporequerido') %>"}}); 

$("#player_short_passes_1").rules("add", { required: true, messages: { required: "<%= t('generales.camporequerido') %>"}}); 


$("#player_dominant_leg").rules("add", { required: true, messages: { required: "<%= t('generales.camporequerido') %>"}}); 

}); 





jQuery.extend(jQuery.validator.messages, { 
    required: "<%= t('generales.camporequerido') %>", 
    remote: "Please fix this field.", 
    email: "Ingresa un correo electrónico válido.", 
    url: "Please enter a valid URL.", 
    date: "Please enter a valid date.", 
    dateISO: "Please enter a valid date (ISO).", 
    number: "Please enter a valid number.", 
    digits: "Please enter only digits.", 
    creditcard: "Please enter a valid credit card number.", 
    equalTo: "Please enter the same value again.", 
    accept: "Please enter a value with a valid extension.", 
    maxlength: jQuery.validator.format("Please enter no more than {0} characters."), 
    minlength: jQuery.validator.format("Please enter at least {0} characters."), 
    rangelength: jQuery.validator.format("Please enter a value between {0} and {1} characters long."), 
    range: jQuery.validator.format("Please enter a value between {0} and {1}."), 
    max: jQuery.validator.format("Please enter a value less than or equal to {0}."), 
    min: jQuery.validator.format("Please enter a value greater than or equal to {0}.") 
}); 

EDIT1:

我有我的形式有這個NOVALIDATE的HTML收視源= 「」

<form accept-charset="UTF-8" action="/player_steps/skills?locale=en" class="edit_player" id="edit_player_17" method="post" novalidate="novalidate"> 

奇怪的是,我沒有在Rails的意見NOVALIDATE標籤通知,這是在jquery.validate.js中產生的嗎?

這是我在鋼軌中的形式。

<%= form_for @player, :url => wizard_path do |f| %> 

在關於doble id問題的jquery.rating.js我發現這個..我該如何解決它?

// insert rating star 
      var star = $('<div class="star-rating rater-'+ control.serial +'"><a title="' + (this.title || this.value) + '">' + this.value + '</a></div>'); 
      rater.append(star); 

      // inherit attributes from input element 
      if(this.id) star.attr('id', this.id); 
      if(this.className) star.addClass(this.className); 
+0

,什麼是問題? –

+0

如果即時通訊試圖驗證,我不能,無論如何..我會編輯的問題,謝謝! –

回答

1

你是在正確的軌道上,但你有一些小錯誤。

首先,你有兩件具有相同ID的東西 - 每個星星一個,每個無線電一個。每個元素只能有一個唯一的ID。當在這種情況下調用$("#player_short_passes_1")時會發生什麼情況,變得未定義(最有可能的是,您獲得了具有該ID的第一個創建的元素)。一個更好的辦法來設置這些規則將僅僅通過增加一個rules選項將調用validate:

$(".edit_player").validate({ 
    ignore:'', // initialize the plugin 
    errorElement: 'div', 
    rules: { 
     'player[short_passes]': { 
     required:true 
     } 
    } 
}); 

請記住,規則由輸入定義,而不是ID。請注意,player[short_passes]鍵必須在規則對象中引用,否則JavaScript將引發錯誤。

另一件事就是確保.edit_player實際上是一種形式。 jQuery驗證只適用於表單,不像div。

工作示例(ISH - 我沒有得到明星的插件,所以你只需要點擊一個號碼):http://jsfiddle.net/ryleyb/RghSK/

+0

好吧,只是想指出這一點,該雙ID是由我的評級js文件生成的,導致在RAils vies中,我只是生成單選按鈕......這些div不在html中,它們在您運行該站點後出現..我如何改變這個ID? im lost there –

+0

我只是編輯問題的底部 –

+0

老實說,你不需要修正它 - 只需按照我的建議,按名稱引用輸入。在我的例子中你會看到我留下了雙ID。誰寫的插件應該可能會通知:) – Ryley