Как получить изображение на @ Html.RadioButtonFor - PullRequest
Новая
       17

Как получить изображение на @ Html.RadioButtonFor

0 голосов
/ 04 ноября 2019

Если есть: 

<radio class="js-payment-method js-debit-card" type="button" title="Credit/Debit Card"><img src="~/_common/img/payment-options/card.png"><span>Credit / Debit Card</span></radio>

Я получаю желаемый результат. Тем не менее, мне нужно прикрепить это к моей модели. поэтому, начиная с: 

@Html.RadioButtonFor(model => model.PaymentMethodSelected, Enums.PaymentMethod.Card, new { @class = "radio__input js-payment-method", @type = "button", @title="Credit/Debit Card" })

Как мне изменить это, чтобы получить мое изображение и охватить его?

Используя приведенное ниже предложение @the_lotus, код отображается как: 

<label class="js-payment-method js-debit-card" type="button" title="Credit/Debit Card">
    <input checked="checked" class="js-payment-method" data-val="true" data-val-required="The PaymentMethodSelected field is required." id="PaymentMethodSelected" name="PaymentMethodSelected" type="button" value="Card"> 
   <img src="/_common/img/payment-options/card.png">
   <span>Credit / Debit Card</span>
</label>

Таким образом, проблема заключается в том, что отображается значение 'card' из элемента input, потому что это type = "button", если я установил для него тип radio, тогда значение уходит, но вместо этого я получаю переключатель. Я не хочу, чтобы значение отображалось, но это требуется для случаев, когда модель отправляется обратно на сервер

Ответы [ 2 ]

1 голос
/ 04 ноября 2019

RadioButtonFor не генерирует тег , а вместо этогоtag.

Может быть, вместо этого обратите внимание на использование меток. 

<label class="js-payment-method js-debit-card" type="button" title="Credit/Debit Card">@Html.RadioButtonFor(...) <img src="~/_common/img/payment-options/card.png"><span>Credit / Debit Card</span></label>
0 голосов
/ 04 ноября 2019

, если вы хотите вложить тег img в элемент span и radio. Я бы предпочел сделать foreach и выписать html.

Для того, чтобы переключатели работали как группа, свойства имени должны быть одинаковыми. Идентификаторы и значения могут быть разными. 

@foreach(var x in model){
    <input type="radio" name="rad1" Value="@x.PaymentMethodSelected">
    <label>@x.PaymentMethod.Card</label>
    <img src="~/_common/img/payment-options/card.png"><!-- you can pass this uri from the model also-->
}
...