Comment utiliser plusieurs models pour une seule vue

**j�r�myp8** · 07/01/2015, 15h07

Bonjour � tous

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

**yonpo** · 07/01/2015, 15h56

Bonjour,

En g�n�ral, on rassemble les trois types dans une nouvelle class. Par exemple, FruitsViewModel.

**j�r�myp8** · 07/01/2015, 16h01

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

**yonpo** · 07/01/2015, 16h24

Code c# :

S�lectionner tout - Visualiser dans une fen�tre � part

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 c# :

S�lectionner tout - Visualiser dans une fen�tre � part

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 html :

S�lectionner tout - Visualiser dans une fen�tre � part

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 -->
}

**j�r�myp8** · 07/01/2015, 16h29

Re yonpo

Merci �norm�ment pour votre aide

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

**yonpo** · 07/01/2015, 17h03

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.

**j�r�myp8** · 07/01/2015, 17h08

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

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

**yonpo** · 07/01/2015, 17h24

J'ai modifi� la vue :

Code html :

S�lectionner tout - Visualiser dans une fen�tre � part

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 javascript :

S�lectionner tout - Visualiser dans une fen�tre � part

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.

**j�r�myp8** · 07/01/2015, 18h04

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

Yonpo

Un grannnnnd

pour toi encore une fois

Bonne fin de journ�e

**j�r�myp8** · 09/01/2015, 15h35

Bonjour yonpo

D�sol� de te d�ranger encore une fois.

...promis �a sera pour la derni�re fois cette fois

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

**amall515** · 09/07/2020, 14h44

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

**amall515** · 09/07/2020, 23h22

Envoy� par yonpo

J'ai modifi� la vue :

Code html :

S�lectionner tout - Visualiser dans une fen�tre � part

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 javascript :

S�lectionner tout - Visualiser dans une fen�tre � part

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

Comment utiliser plusieurs models pour une seule vue

ASP.NET MVC

Discussions similaires

Partager

Partager