2012-04-16 11 views
1

私は、Stripesフレームワークとともにjavascriptクライアントテンプレートを使用しようとしています。これは、ストライプフォームタグライブラリを使用できないことを意味します。デフォルトでは、ストライプがフォームと一緒にレンダリングされたチェックボックスを判別する隠し暗号化フィールドを挿入するため、渡されなかったチェックボックスはチェックされませんフォームパラメータとして。ストライプスタグなしの未チェックのhtmlチェックボックスを送信するにはどうすればよいですか?

この暗号化された隠しフィールドをタグライブラリを使用することができなくてもすべてのフォームとともに含めることは非常に負担になるので、私はグローバルな解決策を探しています。私が思いついたのは、フォームが送信される前にフォームをインターセプトし、チェックされていないチェックボックスの値をfalseに変更し、サーバーに送信されるようにチェックします。これは、フォームの提出が完了する前に、チェックされていないすべてのオプションを再度確認するという副作用を伴います。チェックされたアニメーションを非表示にする方法はありますか?

$("body").delegate("form", "submit", function() { 
    var $this = $(this); 

    $('input:checkbox:not(:checked)', $this).each(function() { 
     var $this = $(this); 
     $this.attr('value', 'false'); 
     $this.attr('checked', 'checked'); 
    }); 
}); 
+0

まあ解決策は、単に代わりに隠しフィールドを追加するために私に来た: $( '入力:チェックボックス:ありません(:チェックする)'、$をここで

は私の現在のソリューションです。これは).each(function(){ \t \t \t $( '').attr( 'type'、 'hidden')。attr( 'name'、$(this).attr( 'name')))。 attr( 'value'、 'false')。appendTo($ this); \t \t}); – user842800

答えて

0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     // This :unchecked custom selecor was created by me. 
     //http://nanoquantumtech.blogspot.in/2012/03/unchecked-selector-matches-all-elements.html 
     $.extend($.expr[':'], { 
      unchecked: function (obj) { 
       return ((obj.type == 'checkbox' || obj.type == 'radio') && !$(obj).is(':checked')); 
      } 
     }); 

     $(document).ready(function() { 
      $('#checkBoxList').find(':checked').addClass('vechicalChecked'); 

      $('#btnCheckedToUncheckedValues').click(function() { 
       var checkedToUncheckedValues = []; 

       $('#checkBoxList').find('.vechicalChecked:unchecked').each(function() { 
        checkedToUncheckedValues.push($(this).val()); 
       }); 

       alert('Checked To Unchecked Values Are : ' + (checkedToUncheckedValues.length == 0 ? 'none' : checkedToUncheckedValues.join(','))); 
      }); 
     }); 
    </script> 
</head> 
<body> 
    <div id="checkBoxList"> 
     <input type="checkbox" value="0" name="Vechical" checked="checked" />0<br /> 
     <input type="checkbox" value="1" name="Vechical" />1<br /> 
     <input type="checkbox" value="2" name="Vechical" checked="checked" />2<br /> 
     <input type="checkbox" value="3" name="Vechical" checked="checked" />3<br /> 
     <input type="checkbox" value="4" name="Vechical" />4<br /> 
     <input type="checkbox" value="5" name="Vechical" checked="checked" />5<br /> 
     <input type="checkbox" value="6" name="Vechical" />6<br /> 
     <input type="checkbox" value="7" name="Vechical" />7<br /> 
     <input type="checkbox" value="8" name="Vechical" checked="checked" />8<br /> 
     <input type="button" id="btnCheckedToUncheckedValues" value="checked To Unchecked Values" /> 
    </div> 
</body> 
</html> 
+0

//これは私が作成したチェックされていないカスタムセレクタです。 //http://nanoquantumtech.blogspot.in/2012/03/unchecked-selector-matches-all-elements.htmlライブデモの – Thulasiram

+0

このリンクを参照してください:http://jsfiddle.net/nanoquantumtech/PbZav/ – Thulasiram