Comment utiliser plusieurs models pour une seule vue

Version imprimable

07/01/2015, 15h07
jérémyp8

Comment utiliser plusieurs models pour une seule vue

Bonjour à tous :D

J'ai plusieurs tables de données/Entities (ABRICOTS, BANANE, CITRON) dans le même EDMX et chaque table a plusieurs colonnes (Name, Quantité, Date, Tri)

Dans une vue, j'ai une liste déroulante (DropDownList) qui contient ("A","B" et "C")

Ce que je veux faire :

Dans ma liste déroulante :
Quand je sélectionne la valeur A j'affiche en bas de ma liste déroulante (dans la même vue) les données de la table ABRICOTS
Ou
Quand je sélectionne la valeur B j'affiche en bas de ma liste déroulante (dans la même vue) les données de la table BANANE
Ou
Quand je sélectionne la valeur C j'affiche en bas de ma liste déroulante (dans la même vue) les données de la table BANANE

Merci beaucoup pour votre aide
Jeremy
07/01/2015, 15h56
yonpo

Bonjour,

En général, on rassemble les trois types dans une nouvelle class. Par exemple, FruitsViewModel.
07/01/2015, 16h01
jérémyp8

Bonjour Yonpo

Merci de me répondre mais es ce que tu peux me donner un extrait de code cette classe, le controller et la vue ?

Désolé je suis un débutant ! :(

Merci :D

Code:

1
2
3
4
5
6
7
8
public class FruitsViewModel
{
	public List<Abricot> Abricots { get; set; }
 
	public List<Banane> Bananes { get; set; }
 
	public List<Citron> Citrons { get; set; }
}

Code:

1
2
3
4
5
6
7
8
9
public ActionResult ActionController()
{
	var vm = new FruitsViewModel();
	vm.Abricots = // Récupère les abricots depuis la base de données
	vm.Bananes = // Récupère les bananes depuis la base de données
	vm.Citrons = // Récupère les citrons depuis la base de données
 
	return View(vm);
}

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
@model namespace de FruitsViewModel
 
@foreach(var abricot in Model.Abricots)
{
	<!-- Affiche les propriétés d'un abricot -->
}
 
@foreach(var banane in Model.Bananes)
{
	<!-- Affiche les propriétés d'une banane -->
}
 
@foreach(var citron in Model.Citrons)
{
	<!-- Affiche les propriétés d'un citron -->
}

07/01/2015, 16h29
jérémyp8

Re yonpo

Merci énormément pour votre aide :D

Mais ce qui manque dans le code c'est la partie la plus difficile pour moi c'est-à-dire comment faire quand :

j'ai une liste déroulante (DropDownList) qui contient ("A","B" et "C")

Quand Je sélectionne la valeur A j'affiche en bas de ma liste déroulante (dans la même vue) les données de la table ABRICOTS
Ou
Quand Je sélectionne la valeur B j'affiche en bas de ma liste déroulante (dans la même vue) les données de la table BANANE
Ou
Quand Je sélectionne la valeur C j'affiche en bas de ma liste déroulante (dans la même vue) les données de la table CITRON

Merc :D
07/01/2015, 17h03
yonpo

Avec un peu de javascript, on devrait y arriver.
On écoute le changement d'élément de la liste qui contient A, B, C et fonction de l'élément sélectionné, on affiche la bonne liste.

On pourrait aussi allez plus loin, en utilisant de l'ajax qui récupèrerait les bons éléments en fonction de l'élément choisie.
07/01/2015, 17h08
jérémyp8

Merci infiniment Yonpo de prendre un peu de temps pour me répondre

Je vais t’embêter une dernière, enfin j’espère :D

Je suis vraiment nul de chez nul en JS je n'ai jamais fait donc si tu peux me donner un extrait de code ça sera vraiment génial de ta part dans le cas contraire je comprendrai cra jusqu'à la tu as fait déjà beaucoup pour moi ;)

Merci d'avance

J'ai modifié la vue :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
@model namespace de FruitsViewModel
 
<select id="select">
	<option>A</option>
	<option>B</option>
	<option>C</option>
</select>
 
@foreach(var abricot in Model.Abricots)
{
	<div id="abricots">
		<!-- Affiche les propriétés d'un abricot -->
	</div>	
}
 
@foreach(var banane in Model.Bananes)
{
	<div id="bananes">
		<!-- Affiche les propriétés d'une banane -->
	</div>
}
 
@foreach(var citron in Model.Citrons)
{
	<div id="citrons">
		<!-- Affiche les propriétés d'un citron -->
	</div>
}

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
$("#select").change(function() {
	var $selectedItem = $(this).find(":selected"); // Obtient l'élément sélectionné		
	if ($selectedItem != null) {
		var value = $selectedItem.val(); // Obtient la valeur de l'élément sélectionné		
		if (value == "A") {
			$("#abricots").show();
			$("#bananes").hide();
			$("#citrons").hide();			
		} else if (value == "B") {
			$("#abricots").hide();
			$("#bananes").show();
			$("#citrons").hide();		
		} else if (value == "C") {
			$("#abricots").hide();
			$("#bananes").hide();
			$("#citrons").show();		
		}		
	}	
});

Fait vite fait mais tu as l'idée. Il te faut jquery comme lib javascript.

07/01/2015, 18h04
jérémyp8

Yesssss ! tout fonctionne bien et comme je le voulais......... Bravo :bravo: Yonpo

Un grannnnnd :merci: pour toi encore une fois

Bonne fin de journée
09/01/2015, 15h35
jérémyp8

Bonjour yonpo

Désolé de te déranger encore une fois. :?...promis ça sera pour la dernière fois cette fois :D

Enfaîte, Je pense que le plus dure reste a faire pour moi afin de compléter et boucler mon projet avec succès, c'est :

Comment modifier ou supprimer une ligne de donnée dans la table que je viens d'afficher ?

Je te remercie infiniment
09/07/2020, 14h44
amall515

Dans ce cas Comment je peux modifier des donnés de l'un des vues qui inclut dans la vue mère

Dans ce cas Comment je peux modifier des donnés de l'un des vues qui inclut dans la vue mère

Citation:

Envoyé par yonpo

J'ai modifié la vue :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
@model namespace de FruitsViewModel
 
<select id="select">
	<option>A</option>
	<option>B</option>
	<option>C</option>
</select>
 
@foreach(var abricot in Model.Abricots)
{
	<div id="abricots">
		<!-- Affiche les propriétés d'un abricot -->
	</div>	
}
 
@foreach(var banane in Model.Bananes)
{
	<div id="bananes">
		<!-- Affiche les propriétés d'une banane -->
	</div>
}
 
@foreach(var citron in Model.Citrons)
{
	<div id="citrons">
		<!-- Affiche les propriétés d'un citron -->
	</div>
}

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
$("#select").change(function() {
	var $selectedItem = $(this).find(":selected"); // Obtient l'élément sélectionné		
	if ($selectedItem != null) {
		var value = $selectedItem.val(); // Obtient la valeur de l'élément sélectionné		
		if (value == "A") {
			$("#abricots").show();
			$("#bananes").hide();
			$("#citrons").hide();			
		} else if (value == "B") {
			$("#abricots").hide();
			$("#bananes").show();
			$("#citrons").hide();		
		} else if (value == "C") {
			$("#abricots").hide();
			$("#bananes").hide();
			$("#citrons").show();		
		}		
	}	
});

Fait vite fait mais tu as l'idée. Il te faut jquery comme lib javascript.

Bonjour yonopo

SVP je voulais savoir comment faire des modification ou suppression sur la vue FruitViewModel par edit async si je veux modifier le modele abricot ;svp aidez moi