bootstrap-radio.js 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145
  1. /* =============================================================
  2. * flatui-radio v0.0.3
  3. * ============================================================ */
  4. !function ($) {
  5. /* RADIO PUBLIC CLASS DEFINITION
  6. * ============================== */
  7. var Radio = function (element, options) {
  8. this.init(element, options);
  9. }
  10. Radio.prototype = {
  11. constructor: Radio
  12. , init: function (element, options) {
  13. var $el = this.$element = $(element)
  14. this.options = $.extend({}, $.fn.radio.defaults, options);
  15. $el.before(this.options.template);
  16. this.setState();
  17. }
  18. , setState: function () {
  19. var $el = this.$element
  20. , $parent = $el.closest('.radio');
  21. $el.prop('disabled') && $parent.addClass('disabled');
  22. $el.prop('checked') && $parent.addClass('checked');
  23. }
  24. , toggle: function () {
  25. var d = 'disabled'
  26. , ch = 'checked'
  27. , $el = this.$element
  28. , checked = $el.prop(ch)
  29. , $parent = $el.closest('.radio')
  30. , $parentWrap = $el.closest('form').length ? $el.closest('form') : $el.closest('body')
  31. , $elemGroup = $parentWrap.find(':radio[name="' + $el.attr('name') + '"]')
  32. , e = $.Event('toggle')
  33. if ($el.prop(d) == false) {
  34. $elemGroup.not($el).each(function () {
  35. var $el = $(this)
  36. , $parent = $(this).closest('.radio');
  37. if ($el.prop(d) == false) {
  38. $parent.removeClass(ch) && $el.removeAttr(ch).trigger('change');
  39. }
  40. });
  41. if (checked == false)
  42. $parent.addClass(ch) && $el.prop(ch, true);
  43. $el.trigger(e);
  44. if (checked !== $el.prop(ch)) {
  45. $el.trigger('change');
  46. }
  47. }
  48. }
  49. , setCheck: function (option) {
  50. var ch = 'checked'
  51. , $el = this.$element
  52. , $parent = $el.closest('.radio')
  53. , checkAction = option == 'check' ? true : false
  54. , checked = $el.prop(ch)
  55. , $parentWrap = $el.closest('form').length ? $el.closest('form') : $el.closest('body')
  56. , $elemGroup = $parentWrap.find(':radio[name="' + $el['attr']('name') + '"]')
  57. , e = $.Event(option)
  58. $elemGroup.not($el).each(function () {
  59. var $el = $(this)
  60. , $parent = $(this).closest('.radio');
  61. $parent.removeClass(ch) && $el.removeAttr(ch);
  62. });
  63. $parent[checkAction ? 'addClass' : 'removeClass'](ch) && checkAction ? $el.prop(ch, ch) : $el.removeAttr(ch);
  64. $el.trigger(e);
  65. if (checked !== $el.prop(ch)) {
  66. $el.trigger('change');
  67. }
  68. }
  69. }
  70. /* RADIO PLUGIN DEFINITION
  71. * ======================== */
  72. var old = $.fn.radio
  73. $.fn.radio = function (option) {
  74. return this.each(function () {
  75. var $this = $(this)
  76. , data = $this.data('radio')
  77. , options = $.extend({}, $.fn.radio.defaults, $this.data(), typeof option == 'object' && option);
  78. if (!data)
  79. $this.data('radio', (data = new Radio(this, options)));
  80. if (option == 'toggle')
  81. data.toggle()
  82. if (option == 'check' || option == 'uncheck')
  83. data.setCheck(option)
  84. else if (option)
  85. data.setState();
  86. });
  87. }
  88. $.fn.radio.defaults = {
  89. template: '<span class="icons"><span class="first-icon fa fa-circle-o"></span><span class="second-icon fa fa-dot-circle-o"></span></span>'
  90. }
  91. /* RADIO NO CONFLICT
  92. * ================== */
  93. $.fn.radio.noConflict = function () {
  94. $.fn.radio = old;
  95. return this;
  96. }
  97. /* RADIO DATA-API
  98. * =============== */
  99. $(document).on('click.radio.data-api', '[data-toggle^=radio], .radio', function (e) {
  100. var $radio = $(e.target);
  101. e && e.preventDefault() && e.stopPropagation();
  102. if (!$radio.hasClass('radio'))
  103. $radio = $radio.closest('.radio');
  104. $radio.find(':radio').radio('toggle');
  105. });
  106. $(function () {
  107. $('[data-toggle="radio"]').each(function () {
  108. var $radio = $(this);
  109. $radio.radio();
  110. });
  111. });
  112. }(window.jQuery);