2017-06-18 2 views
1

J'ai intégré la Bootstrap Dual Listbox, sur mon site web aspnet, mais je ne sais pas comment récupérer les valeurs sélectionnées dans la liste de droite (valeurs multiples).Comment récupérer les valeurs sélectionnées de la double liste avec aspnet core C#

Sur mon site web, j'ai une boîte de dépôt de langue, et une liste double, qui sont chargées de différentes quêtes chaque fois que je change de langue.

Mes ViewModel.cs

public class QuestViewModel 
{ 
    public IEnumerable<string> QuestIds { get; set; } 
    public string Language { get; set; } 
    public List<SelectListItem> Quests { set; get; } 
} 

Mon cshtml

<form asp-action="add" role="form"> 
    <div class="form-group"> 
     <label>Language</label> 
     <select asp-for="Language" class="form-control m-b" id="idLanguage"> 
      <option value="PT">PT</option> 
      <option value="FR">FR</option> 
      <option value="UK">UK</option> 
      <option value="ES">ES</option> 
     </select> 
    </div> 


    <div class="form-group"> 
     <select asp-for="QuestIds" asp-items="@Model.Quests" class="form-control dual_select" multiple="multiple" name="duallistbox_quest"> 
     </select> 
    </div> 
</form> 

Mon javascript ajax avec, appeler mon apicontroller pour remplir à nouveau la double zone de liste

$(document).ready(function() { 
    $('[name=duallistbox_quest]').bootstrapDualListbox({ 
     selectorMinimalHeight: 200 
    }); 

    $("#idLanguage").on("change", function() { 
     $.ajax({ 
      url: "/Quest/GetAllQuests", 
      type: "GET", 
      dataType: "JSON", 
      data: { Id: $("#idLanguage").val() }, //id of the language 
      traditional: true, 
      success: function (result) { 
       $('[name=duallistbox_quest]').empty(); 
       $.each(result, function (i, item) { 
        $('[name=duallistbox_quest]').append($('<option value="' + item["value"] + '"> ' + item["text"] + ' </option>')); 
       }); 
       $('[name=duallistbox_quest]').bootstrapDualListbox('refresh', true); 
      }, 
      error: function() { 
       alert("Error oops."); 
      } 
     }); 
    }); 
}); 

My Post

[HttpPost] 
[ValidateAntiForgeryToken] 
public async Task<IActionResult> add(QuestViewModel model) 
{ 
    return View();//just to test 
} 

Ici, dans ma publication, viewmodel a model.QuestIds toujours null.

Ce qui manque ici.

Merci d'avance.

Cordialement.

Jolynice.

Répondre

0

J'ai trouvé la solution,

Je dois changer le nom de la double listbox par la propriété viewmodel, comme celui-ci.

<div class="form-group"> 
    <select asp-for="QuestIds" asp-items="@Model.Quests" class="form-control dual_select" multiple="multiple" name="QuestIds"> 
    </select> 
</div> 

Ensuite, n'oubliez pas de mettre à jour le script javascript.