Widgets du contrôle de grille JS
Dernière modification : vendredi 30 avril 2010
S’applique à : SharePoint Foundation 2010
Le Contrôle Grille JS comprend une bibliothèque de composants de widgets. Ces widgets fournissent des fonctionnalités telles qu’un sélecteur de dates ou un sélecteur de liens hypertexte.
Widgets du contrôle de grille JS
Sélecteur de dates
Sélecteur de liens hypertexte
Implémentation des widgets
Pour ajouter un widget de sélecteur de dates à une grille
Établissez une correspondance entre le type de propriété de la colonne entrante et le champ de grille sortante. Le sélecteur de dates est ajouté à la grille lorsque vous définissez la propriété PropertyTypeID sur « JSDateTime ».
else if (dc.DataType == typeof(DateTime)) { gf.PropertyTypeId = "JSDateTime"; gf.Localizer = (ValueLocalizer)delegate(DataRow row, object toConvert) { return toConvert == null ? "" : toConvert.ToString(); }; gf.EditMode = EditMode.ReadWrite; gf.SerializeDataValue = true; gf.SerializeLocalizedValue = true; }
ElseIf dc.DataType Is GetType(DateTime) Then gf.PropertyTypeId = "JSDateTime" gf.Localizer = CType(Function(row As DataRow, toConvert As Object) As String Return If(toConvert Is Nothing, Nothing, toConvert.ToString) End Function, ValueLocalizer) gf.EditMode = EditMode.ReadWrite gf.SerializeDataValue = True gf.SerializeLocalizedValue = True
Dans cet exemple, notez que le paramètre EditMode est défini sur ReadWrite et que les paramètres SerializeDataValue et SerializeLocalizedValue sont définis sur true.
Ajoutez une colonne de date ayant le type DateTime.
data.Columns.Add(new DataColumn("Start Date", typeof(DateTime)));
data.Columns.Add(New DataColumn("Start Date", GetType(Datetime)))
Définissez les données de la colonne de date. Cet exemple crée des dates aléatoires pour la colonne Start Date.
dr["Start Date"] = DateTime.Now.AddSeconds(rand.Next(60 * 60 * 24 * 20));
dr("Start Date") = DateTime.Now.AddSeconds(rand.Next(60 * 60 * 24 * 20))
Cliquez sur l’une des cellules de date pour la sélectionner. La cellule est entourée d’une bordure et une petite icône apparaît près de la cellule. Si la cellule est modifiable et que vous cliquez sur la cellule proprement dite, vous pouvez modifier la date directement. Si vous cliquez sur le symbole adjacent à la cellule, le sélecteur de dates apparaît.
Pour ajouter un sélecteur de liens hypertexte à une grille
Établissez une correspondance entre le type de propriété de la colonne entrante et le champ de grille sortante. Le sélecteur de liens hypertexte est ajouté à la grille lorsque vous définissez la propriété PropertyTypeID sur « Hyperlink ».
else if (dc.DataType == typeof(Hyperlink)) { gf.PropertyTypeId = "Hyperlink"; gf.Localizer = (ValueLocalizer)delegate(DataRow row, object toConvert) { return toConvert == null ? "" : toConvert.ToString(); }; gf.SerializeLocalizedValue = false; gf.SerializeDataValue = true; }
ElseIf dc.DataType Is GetType(Hyperlink) Then gf.PropertyTypeId = "Hyperlink" gf.Localizer = CType(Function(row As DataRow, toConvert As Object) As String Return If(toConvert Is Nothing, Nothing, toConvert.ToString) End Function, ValueLocalizer) gf.SerializeLocalizedValue = False gf.SerializeDataValue = True
Ajoutez la colonne de lien hypertexte à la grille.
data.Columns.Add(new DataColumn("Hyperlink", typeof(Hyperlink)));
data.Columns.Add(New DataColumn("Hyperlink", GetType(Hyperlink)))
Définissez les données de la colonne de lien hypertexte. Cet exemple définit le texte affiché sur « Contoso » et l’URL sur https://www.contoso.com.
dr["Hyperlink"] = new Hyperlink() { Display = "Contoso", Address = "https://www.contoso.com" };
dr("Hyperlink") = New Hyperlink() With {.Display = "Contoso", .Address = "https://www.contoso.com"}
Cliquez sur une cellule de lien hypertexte pour la sélectionner. La cellule est entourée d’une bordure et une petite icône apparaît près de la cellule. Si vous cliquez sur la cellule proprement dite, le lien est ouvert dans une autre fenêtre de navigateur. Si vous cliquez sur le symbole à gauche de la cellule, une boîte de dialogue s’ouvre, dans laquelle vous pouvez modifier le nom d’affichage et l’URL.