2016-11-02 3 views
1

Я использую select2 на моем веб-сайте asp.net mvc и получил его для работы с html <select>. Однако мне трудно получить способ получения значений, введенных пользователем при попадании в submit. Когда-то внутри элемента @using (Html.BeginForm) select2 больше не работает и просто отображается как значение по умолчанию. Я попробовал этот учебник, но это не работает для меня: http://www.datahaunting.com/mvc/select2-simple-example-in-asp-net-mvc/Select2 внесение значений, которые были введены

Вот что я имею в минуту, и то, что я пробовал:

@model AssignerWebTool.Models.CreateUserModel 
@{ 
ViewBag.Title = "Create User"; 
} 
<select id="select" class="select" multiple="multiple"> //This works but I have no way of getting the values entered 
<option></option> 
</select> 

<h2>Create User</h2> 
@using (Html.BeginForm("Create", "user", FormMethod.Post, new { @class = "select", role = "form" })) 
{ 
@Html.AntiForgeryToken() 
<h4>Create a new account.</h4> 
<hr/> 
@Html.ValidationSummary("", new {@class = "text-danger"}) 
<div class="form-group"> 
    @Html.LabelFor(m => m.Email, new {@class = "col-md-2 control-label"}) 
    <div class="col-md-10"> 
     @Html.TextBoxFor(m => m.Email, new {id = "select" }) //This does not work and does not select2 

     <select id="select" class="select" multiple="multiple"> //Also does not work now inside of here 
      <option></option> 
     </select> 
    </div> 
</div> 

<div class="form-group"> 
    <div class="col-md-offset-2 col-md-10"> 
     <input type="submit" class="btn btn-default" value="Create User"/> 
    </div> 
</div> 


} 

@section scripts 
{ 
<link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css" rel="stylesheet" /> 
<script src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js"></script> 
<script> 
    $(function() { 

     $("#select").select2({ 
      placeholder: "Email address(es)", 
      tags: true, 
      tokenSeparators: [',', ' '] 
     }); 
    }); 
</script> 
} 
+0

Когда вы пытаетесь использовать код выше, вы избавляетесь от попыток выбора, отличных от того, который вы пытаетесь сделать в то время? У вас есть 3 элемента с id = «select», а jquery для запуска select2 будет работать только с первым, который он найдет. Повторите попытку, комментируя сначала выбор, и посмотрите, работает ли следующий. – jolyeons

+0

Это решение одной из проблем, которые я имел и имеет смысл. Я все еще не могу заставить его работать для элемента @ Html.TextBoxFor, хотя даже когда я просто использую id = "select" на нем. Какие-либо предложения? – Spitfire5793

+0

Я попытался дублировать, и я понимаю, что я не уверен, какая проблема у вас есть с TextBoxFor. Единственная проблема, с которой я столкнулся, была решена, когда я использовал Full js lib: select2.full.min.js - не уверен, что вы хотите попробовать. В чем проблема, она безмолвно терпит неудачу на вас, не оказывая управление jquery или не возникает ошибка? – jolyeons

ответ

1

Из комментариев мы скорректировали следующее:

-Когда есть только один элемент с id = "select", который выбирается через JQuery для включения функции Select2.

-Используйте select2.full.js Lib для v4.0.x для полной обратной совместимости с v3.5.x

Оказывается, что для <input type="text"> (генерируется с помощью @ Html.TextBoxFor() в вопрос кода), которое должно использоваться в Select2 v4.0.x, что есть ограничения (https://github.com/select2/select2/releases перечисляет ограниченную поддержку для v4.0.0 RC1), которые не работают с тегами и разделителями токенов.

Вместо использования поля ввода, генерируемого html-помощником, используйте поле выбора, так как это рекомендуется использовать с Select2 (см. Примечания к выпуску для версии 4.0) и убедитесь, что оно находится внутри формы и имеет атрибут name установить свойство модели, и если вы хотите загрузить в значении, передаваемое контроллер через модель затем цикл через эти, а также:

<select id ="select" name="Email" class="select" multiple="multiple"> 
    @{foreach (var item in Model.Email) 
     { 
      <option>@item </option> 
     } 
    } 
</select> 

Кроме того, если почта это просто строка, то это будет только получить первый выбранный элемент из элемента select, когда форма отправлена ​​(если полагается, по крайней мере, на привязку модели), чтобы получить больше, вы можете сделать свойство IEnumerable<string> или SelectList, и в этот момент вы можете вернуться к использованию справки html но с DropDownFor, чтобы получить сгенерированный элемент select (хотя вам и не нужно, сгенерированный html в основном идентичен выше).

@Html.DropDownListFor(m => m.Email, Model.Email, new { multiple = "multiple" }) 

и вы также можете позвонить ВЫБ.2 непосредственно на автогенерируемой ID:

$("#Email").select2({ 

и обработку отправила форму в вашем UserController:

[HttpPost] 
public ActionResult Create(CreateUserModel model) 
{ 
    ... 

с помощью модели привязки, который ISN» t единственный способ, но я бы порекомендовал.

Надеюсь, это все поможет!

+0

. Смотрите, что im не очень беспокоился о фактическом прохождении значений для выпадающего списка, я больше искал значения, которые должны быть маркированы, поскольку они были введены, как в этом примере: https://select2.github.io /examples.html#tokenizer Кажется, это может быть невозможно, но если я чего-то не упущу? – Spitfire5793

+0

Если я использую