ASP.Net MVC驗證不與Bootstrap Select Picker一起使用

我遇到ASP.NET MVC驗證問題，不能使用Bootstrap Select Picker，如果我從下拉列表中刪除selectpicker類，驗證工作正常，如果我添加了它驗證不工作，任何幫助，請ASP.Net MVC驗證不與Bootstrap Select Picker一起使用

的MVC代碼：

@Html.DropDownListFor(m => m.SelectedLocationID, Model.lstOfLocations, "Select Delivery Location", new { @class = " selectpicker", @placeholder = "" }) 
      @Html.ValidationMessageFor(m => m.SelectedLocationID)

jQuery代碼隨着Valida-min.js

$(".SearchForm").validate({ 
     ignore: ':not(select:hidden, input:visible, textarea:visible)', 
     rules: { 
      SelectedLocationID: { 
       required: true 
      } 
     }, 
     errorPlacement: function (error, element) { 
      if ($(element).is('Select Delivery Location')) { 
       element.next().after(error); 
      } else { 
       error.insertAfter(element); 
      } 
     } 
    })

感謝

來源

2014-09-29 Mohammed Magdy

請告訴我們你的代碼，否則我現在不怎樣，我們要能夠幫你！ – jbutler483 2014-09-29 16:11:38

好吧，我添加了我的代碼，請你幫我。謝謝 – 2014-09-29 17:06:59

你也可以發佈你的viewmodel？ – Jamie 2014-09-29 20:13:13

我在尋找修復相同問題時偶然發現了這個問題。

問題來自事實，即Bootstrap隱藏原始選擇元素並創建它自己的元素來處理下拉列表的UI。同時，默認情況下，jQuery驗證會忽略不可見字段。

我解決了這個問題，該解決方案結合了changing validation ignore list和finding parent form。在我的情況下，最後的代碼段看起來像這樣

 if ($(".selectpicker")[0]) { 
 
      $(".selectpicker").selectpicker(); 
 
      $('.selectpicker').parents('form:first').validate().settings.ignore = ':not(select:hidden, input:visible, textarea:visible)'; 
 
     }

有可能仍然是潛在的問題，但我需要這個解決方案的工作不夠好。

來源

2014-10-01 10:15:41 PiRX

感謝他現在工作正常。 – 2014-10-02 10:54:14

-1

我想，編輯bootstrap-select.js可能會永久性地解決這個問題。我已經試過這樣的事情：

$(document) 
     .data('keycount', 0) 
     .on('keydown.bs.select', '.bootstrap-select [data-toggle=dropdown], .bootstrap-select [role="listbox"], .bs-searchbox input', Selectpicker.prototype.keydown) 
     .on('focusin.modal', '.bootstrap-select [data-toggle=dropdown], .bootstrap-select [role="listbox"], .bs-searchbox input', function (e) { 
      //Validation handler: Kartik 
      var $thisParent = $(this).parent(".bootstrap-select"); 
      if ($thisParent.find("ul").find("li:first").hasClass("selected")) { 
       if ($thisParent.next("span").length > 0) 
        $thisParent.next("span").css("display", "block"); 
      } 
      else { 
       if ($thisParent.next("span").length > 0) 
        $thisParent.next("span").css("display", "none"); 
      } 
      e.stopPropagation(); 
     });

其工作沒什麼問題。

來源

2017-02-18 17:10:59

這個問題是由顯示引起的：none從bootstrap select皮膚選擇原始選擇（jQuery驗證忽略隱藏的字段）。它可以避免只使用CSS背部保持可見原來的選擇，但給它一些屬性，以避免可視性

select.bs-select-hidden, select.selectpicker 
{ 
    display:block !important; opacity:0; height:1px; width:1px; 
}

來源

2017-02-22 11:17:23 Boston2058

ASP.Net MVC驗證不與Bootstrap Select Picker一起使用

回答

相關問題