将MsDropDown与jQuery Validation Engine一起使用

时间:2013-02-18 11:06:15

标签: jquery drop-down-menu jquery-validation-engine

我正在使用msDropDown 3.3来选择这样的表格:

        <tr><td>Valutanem *</td><td><select name="valutanem" id="valutanem"  style="width:100%;" class="validate[required]" onchange="getvaluta($('#valutanem option:selected').val());">
<option value='0'>Change</option>      
<option value='HUF'>HUF</option>
  <option value='EUR'>EUR</option>
  </td></tr>

<script>

$(document).ready(function() {


var valutanemDropdown = $("#valutanem").msDropdown().data("dd");

});

</script>

以下是该项目的主页:

http://www.marghoobsuleman.com/jquery-image-dropdown

我想使用jQuery Validation Engine确保选择了某些内容!

该文档说,只需添加class="validate[required]"进行选择,但它不起作用!为什么呢?

验证引擎可在此处找到:

https://github.com/posabsolute/jQuery-Validation-Engine

1 个答案:

答案 0 :(得分:0)

            This is because the select element is being wrapped by a div with the class
    "ddOutOfVision" which has overflow:hidden which makes 
    the validation error to not be visible. 

            In order to fix that you can simply do this in javascript:

             if ($('#valutanem').length > 0) {


          if  ($("#valutanem").hasClass('validate[required]'))
          {
            $("#valutanem_msdd").addClass('validate[required]')

            var element  = document.getElementById("valutanem_msdd")

     // need to clone the element because IE does not allow to set the type 
    //only if it is a newly created element
            var newObject = element.cloneNode(true);  
            newObject.type = "ms-dropdown-source";

            element.parentNode.replaceChild(newObject,element)
          }



        $.valHooks['ms-dropdown-source'] = {
          get: function (el) {
            element_id = $.trim($(el).attr('id').split('_msdd')[0])
            return $("#"+element_id).val();
          },
          set: function (el, val) {
            element_id = $.trim($(el).attr('id').split('_msdd')[0])
            return $("#"+element_id).val(val);
          }
        };

    }


       tested with Chrome, Firefox, IE6, IE7 and IE8 and works. NOt sure about other browsers
Sorry if the identation is wrong. I am not very used to Markdown