форма yesod устанавливает выбранные значения в поле множественного выбора с помощью jquery

Временно я использую Monadic Form of Yesod для создания своих форм, но мне трудно установить для него значения с помощью jquery. Поскольку Монадическая форма генерирует форму за вас, у нее есть собственный способ установки значений в поле выбора/множественного выбора.

eg :

sampleForm :: Html -> MForm Handler (FormResult (Maybe [Text]), Widget)
sampleForm = renderBootstrap bConfig $ (,)
    <$> aopt (multiSelectFieldList $ colors) "Color" Nothing
  where
    colors :: [(Text, Color)]
    colors = [("Red", Red), ("Blue", Blue), ("Gray", Gray), ("Black", Black)]

Выход:

   <select multiselect>
       <option value="1">Red</option>
       <option value="2">Blue</option>
       <option value="3">Gray</option>
      <option value="4">Black</option>
   </select>

Я хочу быть таким:

<select id="colors" multiselect>
     <option value="Red">Red</option>
     <option value="Blue">Blue</option>
     <option value="Gray">Gray</option>
     <option value="Black">Black</option>
</select>

Так что в моем коде jquery:

var selectedValues = "Red,Black,Gary";
$.each(selectedValues.split(","), function(i,e){
  $("#colors option[value='" + e.replace(/\s/g, '') + "']").prop("selected", true);
});

надеюсь вы мне поможете, заранее спасибо


person Ryan Monreal    schedule 04.12.2015    source источник


Ответы (1)


Вы можете заменить свой код jQuery следующим.

var selectedValues = ["Red", "Black", "Gray"];
$("option").removeAttr('selected');
$.each(selectedValues, function (idx, val) {
    $("option").filter(":contains(" + val + ")").attr('selected', true);
});
person Oliver    schedule 05.12.2015