JQuery проверки и JQuery Mobile выберите список конфликтов

Question

Сначала я использую ASP.Net MVC4 и последний JQuery 2.0.3, JQuery мобильный 1.3.1, JQuery UI 1.10.3 и JQuery Unobstrusive Validation Plugin 1.11.1

У меня возникла проблема с проверкой jQuery .. он смешивает текст отображения списка выбора и сообщение об ошибке ...

Таким образом, проверка jQuery добавляет класс «ошибка ввода-проверки» в этот элемент html при возникновении ошибки. Моя проблема в том, что, когда я выбираю действительное значение и отправляю (с другими ошибками в форме), jquery добавляет стиль = "display: none" к этому диапазону! Так что мой список выбора появляется, как будто ничего был выбран ...

Пролет элементу:

<span>Select a card</span> 

код Html ниже генерируется с:

@Html.LabelFor(model => model.CardType) 
    @Html.DropDownListFor(model => model.CardType, Model.CardList) 

и кнопка отправки:

<button type="submit" data-transition="flip" data-theme="e" data-role="button">Buy</button> 

Образец примера:

Исходное состояние формируемого списка выбора:

<div class="ui-select"> 
    <div data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-icon="arrow-d" data-iconpos="right" data-theme="c" class="ui-btn ui-btn-up-c ui-shadow ui-btn-corner-all ui-btn-icon-right"> 
     <span class="ui-btn-inner"> 
      <span class="ui-btn-text"> 
       <span>Select a card</span> 
      </span> 
      <span class="ui-icon ui-icon-arrow-d ui-icon-shadow">&nbsp;</span> 
     </span> 
     <select data-val="true" data-val-required="Please select a payment card" id="CardType" name="CardType"> 
      <option value="">Select a card</option> 
      <option value="Visa">Visa</option> 
      <option value="AmericanExpress">American Express</option> 
      <option value="MasterCardPrepago">MasterCard Prepago</option> 
      <option value="EuroCardMasterCard">EuroCard/MasterCard</option> 
      <option value="CarteBleue">Carte bleue nationale</option> 
      <option value="VisaDebit">Visa Debit</option> 
      <option value="VisaElectron">Visa Electron</option> 
     </select> 
    </div> 
</div> 

Так как я говорю JQuery Validate, чтобы не использовать промежуток, созданный Jquery мобильны, как поле ошибки?!

Благодаря

Answer 1

я нашел небольшую помощь в другом посте я сделал на Jquery форумах (http://forum.jquery.com/topic/conflict-with-jquery-validate)

http://api.jquerymobile.com

JQuery Mobile 1.3 поддерживает JQuery 1.7.0 до 1.9.1

Кроме того, в то время как команды jQuery Mobile и jQuery UI работают в сторону совместимости (в 1.4 и более поздних версиях), jQuery Mo bile is не совместим с jQuery UI. Они не были предназначены для совместимости. Некоторые разработчики получили некоторые функции для совместной работы, или получили некоторые сторонние плагины для работы. (И есть некоторые плагины jQuery U12 , которые явно предназначены для работы с обоими jQuery UI и jQuery Mobile - например, jquery.ui.maps доходит до ), это почти всегда будет иметь некоторые изменения или обман.

Вы по крайней мере, разрешить конфликты между CSS JQuery UI и JQuery Mobile, а это значит, вам придется использовать редко используется функцию, чтобы добавить префикс для всех ваших JQuery Mobile CSS.

Так решил использовать CSS, чтобы исправить это, и решение действительно просто, как:

.ui-select .input-validation-error { display: block !important;} 

Готово!