Forstå dataformularer i Microsoft PowerAppsUnderstand data forms in Microsoft PowerApps

Tilføj tre typer kontrolelementer, så brugeren kan søge efter en post, få vist oplysninger om posten og redigere eller oprette en post:Add three types of controls so that the user can browse for a record, display details about that record, and edit or create a record:

AktivitetActivity KontrolelementControl BeskrivelseDescription
Søg efter en postBrowse for a record GallerikontrolelementGallery control Filtrer, sortér, søg i og rul gennem posterne i en datakilde, og vælg en bestemt post.Filter, sort, search, and scroll through records in a data source, and select a specific record. Du kan få vist alt lige fra nogle få felter fra hver post til adskillige poster ad gangen, selv på en lille skærm.Display only a few fields from each record to show several records at a time, even on a small screen.
Vis detaljer for en postShow details of a record Kontrolelementet til visning af en formularDisplay form control Få vist mange eller alle felter i den pågældende post for en enkelt post.For a single record, display many or all fields in that record.
Rediger eller opret en postEdit or create a record Kontrolelementet til redigering af en formularEdit form control Opdater et eller flere felter i en enkelt post (eller opret en post, der starter med standardværdier), og gem ændringerne i den underliggende datakilde.Update one or more fields in a single record (or create a record starting with default values), and save those changes back to the underlying data source.

Placer hvert kontrolelement på en anden skærm for at gøre det lettere at skelne mellem dem:Put each control on a different screen to make them easier to distinguish:

Gennemse, få vist og rediger poster på tværs af tre skærme

I dette emne beskrives, hvordan du kan kombinere disse kontrolelementer med formler til at oprette den overordnede brugeroplevelse.As this topic describes, combine these controls with formulas to create the overall user experience.

ForudsætningerPrerequisites

Udforsk en oprettet appExplore a generated app

PowerApps kan automatisk oprette en app, der er baseret på en datakilde, som du angiver.PowerApps can automatically generate an app based on a data source that you specify. Hver app indeholder tre skærme med de kontrolelementer, der er beskrevet tidligere, og formler, der sammenkæder dem.Each app contains three screens with the controls described earlier and formulas that connect them. Kør disse apps med det samme, tilpas dem til dine specifikke mål, eller undersøg, hvordan de fungerer, så du kan lære nyttige begreber at kende, der gælder for dine egne apps.Run these apps "out of the box," customize them for your specific goals, or examine how they work so that you can learn useful concepts that apply to your own apps. Undersøg de skærmbilleder, kontrolelementer og formler, der fører til, at en app oprettes, i de følgende afsnit.In the following sections, inspect the screens, controls, and formulas that drive a generated app.

GennemgangsskærmBrowse screen

Gennemgangsskærm med kontrolelementer

Dette skærmbillede indeholder disse vigtige formler:This screen features these key formulas:

KontrolelementControl Understøttet funktionsmådeSupported behavior FormelFormula
BrowseGallery1BrowseGallery1 Få vist poster fra datakilden Assets (Aktiver).Display records from the Assets data source. Egenskaben Items for galleriet er angivet til en formel, der er baseret på datakilden Assets (Aktiver).The Items property of the gallery is set to a formula that's based on the Assets data source.
ImageNewItem1ImageNewItem1 Få vist skærmen Edit and Create (Rediger og opret), hvor hvert felt er angivet til en standardværdi, så brugeren nemt kan oprette en post.Display the Edit and Create screen with each field set to a default value, so that the user can easily create a record. Egenskaben OnSelect for billedet er angivet til denne formel:The OnSelect property of the image is set to this formula:
NewForm( EditForm1 );
Navigate( EditScreen1, None )
NewForm( EditForm1 );
Navigate( EditScreen1, None )
NextArrow1 (i galleriet)NextArrow1 (in the gallery) Få vist skærmen Details (Detaljer) for at få vist mange eller alle felter for den aktuelt valgte post.Display the Details screen to view many or all fields of the currently selected record. Egenskaben OnSelect for pilen er angivet til denne formel:The OnSelect property of the arrow is set to this formula:
Navigate( DetailScreen1, None )Navigate( DetailScreen1, None )

Det primære kontrolelement på dette skærmbillede, BrowseGallery1, dækker det meste af skærmens område.The primary control on this screen, BrowseGallery1, covers most of the area of the screen. Brugeren kan rulle gennem galleriet for at finde en bestemt post for at få vist flere felter eller for at opdatere.The user can scroll through the gallery to find a specific record to display more fields or to update.

Angiv egenskaben Items for et galleri for at få vist poster fra en datakilde i galleriet.Set the Items property of a gallery to show records from a data source in it. Du kan f.eks. angive egenskaben til Assets (Aktiver) for at få vist poster fra en datakilde med det pågældende navn.For example, set that property to Assets to show records from a data source of that name.

Bemærk! I en oprettet app angives Items som standard til en betydeligt mere kompliceret formel, så brugeren kan sortere og søge efter poster.Note: In a generated app, Items is set to a significantly more complicated formula by default so that the user can sort and search for records. Du lærer at opbygge formlen senere i dette emne. Den enkle version er nok for nu.You'll learn how to build that formula later in this topic; the simpler version is enough for now.

I stedet for at søge efter en post til visning eller redigering, kan brugeren oprette en post ved at vælge "+"-symbolet over galleriet.Instead of finding a record to display or edit, the user can create a record by selecting the "+" symbol above the gallery. Opnå denne effekt ved at tilføje et billedkontrolelement, få vist et "+"-symbol i det og angive dets egenskab OnSelect til denne formel:Create this effect by adding an Image control, showing a "+" symbol in it, and setting its OnSelect property to this formula:
NewForm( EditForm1 ); Navigate( EditScreen1, None )NewForm( EditForm1 ); Navigate( EditScreen1, None )

Denne formel åbner skærmen Edit and Create (Rediger og opret), der indeholder et kontrolelement til redigering af en formular med navnet EditForm1.This formula opens the Edit and Create screen, which features an Edit form control named EditForm1. Formlen skifter også den pågældende formular til tilstanden New (Ny), hvor formularen viser standardværdier fra datakilden, så brugeren nemt kan oprette en post fra bunden.The formula also switches that form into New mode, in which the form shows default values from the data source so that the user can easily create a record from scratch.

Hvis du vil undersøge kontrolelementerne i BrowseGallery1, skal du vælge det pågældende kontrolelement i første sektion af galleriet, der fungerer som en skabelon for alle andre sektioner.To examine any control that appears in BrowseGallery1, select that control in the first section of that gallery, which serves as a template for all other sections. Du kan f.eks. vælge det midterste etiketkontrolelement på venstre kant:For example, select the middle Label control on the left edge:

Gennemgangsskærm med kontrolelementer

I dette eksempel angives kontrolelementets egenskab Text til ThisItem.AssignedTo, som er et felt i datakilden Assets (Aktiver).In this example, the control's Text property is set to ThisItem.AssignedTo, which is a field in the Assets data source. Egenskaben Text for de andre tre etiketkontrolelementer i galleriet angives til lignende formler, og hvert kontrolelement viser et forskelligt felt i datakilden.The Text property of the other three Label controls in the gallery are set to similar formulas, and each control shows a different field in the data source.

Vælg figurkontrolelementet (pilen), og bekræft dets egenskab OnSelect til denne formel:Select the Shape control (the arrow), and confirm that its OnSelect property is set to this formula:
Navigate( DetailScreen1, None )Navigate( DetailScreen1, None )

Hvis brugeren søger efter en post i BrowseGallery1, kan vedkommende vælge pilen for den pågældende post for at få vist yderligere oplysninger om den i DetailScreen1.If the user finds a record in BrowseGallery1, the user can select the arrow for that record to show more information about it in DetailScreen1. Når brugeren vælger en pil, ændres værdien for egenskaben Selected for BrowseGallery1.By selecting an arrow, the user changes the value of the Selected property of BrowseGallery1. I denne app bestemmer denne egenskab, hvilken post der vises på DetailScreen1 og på skærmen Edit and create (Rediger og opret), hvis brugeren beslutter at opdatere posten.In this app, that property determines which record appears in not only DetailScreen1 but also, if the user decides to update the record, the Edit and Create screen.

Skærmen Details (Detaljer)Detail screen

Kontrolelementer på skærmen Details (Detaljer)

Dette skærmbillede indeholder disse vigtige formler:This screen features these key formulas:

KontrolelementControl Understøttet funktionsmådeSupported behavior FormelFormula
DetailForm1DetailForm1 Viser en post i datakilden Assets (Aktiver).Displays a record in the Assets data source Angiv egenskaben DataSource til Assets (Aktiver).Set the DataSource property to Assets.
DetailForm1DetailForm1 Bestemmer, hvilken post der vises.Determines which record to display. Viser den post, som brugeren har valgt i galleriet, i en oprettet app.In a generated app, displays the record that the user selected in the gallery. Angiv egenskaben Item for dette kontrolelement til denne værdi:Set the Item property of this control to this value:
BrowseGallery1.SelectedBrowseGallery1.Selected
KortkontrolelementerCard controls Viser et enkelt felt i en post i et kontrolelement til visning af en formular.In a Display form control, displays a single field in a record. Angiv egenskaben DataField til navnet på et felt, der er omsluttet af dobbelte anførselstegn (f.eks. "Name").Set the DataField property to the name of a field, enclosed in double quotation marks (for example, "Name").
ImageBackArrow1ImageBackArrow1 Når brugeren vælger dette kontrolelement, åbnes BrowseScreen1.When the user selects this control, opens BrowseScreen1. Angiv egenskaben OnSelect til denne formel:Set the OnSelect property to this formula:
Back()Back()
ImageDelete1ImageDelete1 Når brugeren vælger dette kontrolelement, slettes en post.When the user selects this control, deletes a record. Angiv egenskaben OnSelect til denne formel:Set the OnSelect property to this formula:
Remove( Assets, BrowseGallery1.Selected )Remove( Assets, BrowseGallery1.Selected )
ImageEdit1ImageEdit1 Når brugeren vælger dette kontrolelement, åbnes skærmen Edit and create (Rediger og opret) for den aktuelle post.When the user selects this control, opens the Edit and Create screen to the current record. Angiv egenskaben OnSelect til denne formel:Set the OnSelect property to this formula:
Navigate( EditScreen1, None )Navigate( EditScreen1, None )

Øverst på skærmen ses tre billeder uden for DetailForm1, der fungerer som knapper, og som samordner de tre skærme i appen.At the top of the screen, three images sit outside of DetailForm1 and act as buttons, orchestrating between the three screens of the app.

DetailForm1 dominerer denne skærm og viser den post, som brugeren har valgt i galleriet (fordi formularens egenskab Items er angivet til BrowseGallery1.Selected).DetailForm1 dominates this screen and displays the record that the user selected in the gallery (because the form's Item property is set to BrowseGallery1.Selected). Egenskaben DataSource for formularen indeholder også metadata om datakilden, f.eks. et brugervenligt visningsnavn for hvert felt.The DataSource property of the form also provides metadata about the data source, such as a user-friendly display name for each field.

DetailForm1 indeholder adskillige kortkontrolelementer.DetailForm1 contains several Card controls. Du kan vælge enten selve kortkontrolelementet eller det kontrolelement, der er indeholdt i dette kontrolelement, for at få flere oplysninger.You can select either the Card control itself or the control that it contains to discover additional information.

Detaljeret kort og kortkontrolelementer, som er blevet valgt under udviklingen

Egenskaben DataField for et kortkontrolelement afgør, hvilket felt kortet viser.The DataField property of a Card control determines which field the card displays. I dette tilfælde er denne egenskab angivet til AssetID.In this case, that property is set to AssetID. Kortet indeholder et etiketkontrolelement, hvis egenskab Text er angivet til Parent.Default.The card contains a Label control for which the Text property is set to Parent.Default. Dette kontrolelement viser standardværdien for kortet, der er angivet via egenskaben DataField.This control shows the Default value for the card, which is set through the DataField property.

I en oprettet app er kortkontrolelementer låst som standard.In a generated app, Card controls are locked by default. Når et kort er låst, kan du ikke ændre bestemte egenskaber som f.eks. DataField, og formellinjen er ikke tilgængelig for disse egenskaber.When a card is locked, you can't modify some properties, such as DataField, and the formula bar is unavailable for those properties. Denne begrænsning sikrer, at dine tilpasninger ikke ødelægger de grundlæggende funktioner i den oprettede app.This restriction helps ensure that your customizations don't break the basic functionality of the generated app. Du kan dog ændre nogle egenskaber for et kort og dets kontrolelementer i højre rude:However, you can change some properties of a card and its controls in the right-hand pane:

Skærmen Details (Detaljer) med ruden med indstillinger åben

I ruden til højre kan du vælge, hvilke felter der skal vises, og i hvilken type kontrolelement hvert felt skal vises.In the right-hand pane, you can select which fields to display and in which kind of control each field displays.

Redigerings-/oprettelsesskærmEdit/Create screen

Kontrolelementer på skærmen Edit (Rediger)

Dette skærmbillede indeholder disse vigtige formler:This screen features these key formulas:

KontrolelementControl Understøttet funktionsmådeSupported behavior FormelFormula
EditForm1EditForm1 Viser en post i datakilden Assets (Aktiver).Displays a record in the Assets data source. Angiv egenskaben DataSource til Assets (Aktiver).Set the DataSource property to Assets.
EditForm1EditForm1 Bestemmer, hvilken post der vises.Determines which record to display. Viser den post, som brugeren har valgt i BrowseScreen1, i en oprettet app.In a generated app, displays the record that the user selected in BrowseScreen1. Angiv egenskaben Items til denne værdi:Set the Item property to this value:
BrowseGallery1.SelectedBrowseGallery1.Selected
KortkontrolelementerCard controls Indeholder kontrolelementer i et kontrolelement til redigering af en formular, så brugeren kan redigere et eller flere felter i en post.In a Edit form control, provides controls so that the user can edit one or more fields in a record. Angiv egenskaben DataField til navnet på et felt, der er omsluttet af dobbelte anførselstegn (f.eks. "Name").Set the DataField property to the name of a field, enclosed in double quotation marks (for example, "Name").
ImageCancel1ImageCancel1 Når brugeren vælger dette kontrolelement, annulleres igangværende ændringer, og skærmen Details (Detaljer) åbnes.When the user selects this control, discards any changes in progress, and opens the Details screen. Angiv egenskaben OnSelect til denne formel:Set the OnSelect property to this formula:
ResetForm( EditForm1 ); Back()ResetForm( EditForm1 ); Back()
ImageAccept1ImageAccept1 Når brugeren vælger dette kontrolelement, sendes ændringerne til datakilden.When the user selects this control, submits changes to the data source. Angiv egenskaben OnSelect til denne formel:Set the OnSelect property to this formula:
SubmitForm( EditForm1 )SubmitForm( EditForm1 )
EditForm1EditForm1 Hvis ændringerne accepteres, vender du tilbage til det forrige skærmbillede.If changes are accepted, returns to the previous screen. Angiv egenskaben OnSuccess til denne formel:Set the OnSuccess property to this formula:
Back()Back()
EditForm1EditForm1 Hvis ændringerne ikke accepteres, forlades det aktuelle skærmbillede ikke, så brugeren kan løse eventuelle problemer og prøve at sende igen.If changes aren't accepted, remain on the current screen so that the user can fix any issues and try to submit again. Lad egenskaben OnFailure stå tom.Leave the OnFailure property blank.
LblFormError1LblFormError1 Hvis ændringerne ikke accepteres, vises en fejlmeddelelse.If changes aren't accepted, shows an error message. Angiv egenskaben Text til denne værdi:Set the Text property to this value:
EditForm1.ErrorEditForm1.Error

På samme måde som på skærmen Details (Detaljer) dominerer et formularkontrolelement ved navn EditForm1 skærmen Edit and Create (Rediger og opret).As in the Details screen, a form control, named EditForm1, dominates the Edit and Create screen. Desuden angives egenskaben Item for EditForm1 til BrowseGallery1.Selected, så formularen viser den post, som brugeren valgte i BrowseScreen1.In addition, the Item property of EditForm1 is set to BrowseGallery1.Selected, so the form displays the record that the user selected in BrowseScreen1. Hvert felt vises som skrivebeskyttet på skærmen Details (Detaljer), men brugeren kan opdatere værdien af et eller flere felter ved hjælp af kontrolelementerne i EditForm1.While the Details screen shows each field as read-only, the user can update the value of one or more fields by using the controls in EditForm1. Den gør også brug af egenskaben DataSource til at få adgang til metadata om denne datakilde, f.eks. brugervenlige visningsnavne for hvert felt og det sted, hvor ændringer skal gemmes.It also uses the DataSource property to access metadata about this data source, such as the user-friendly display name for each field and the location where changes should be saved.

Hvis brugeren vælger ikonet "X" for at annullere en opdatering, sletter funktionen ResetForm ændringer, der ikke er blevet gemt, og funktionen Back åbner skærmen Details (Detaljer).If the user selects the "X" icon to cancel an update, the ResetForm function discards any unsaved changes, and the Back function opens the Details screen. Både skærmen Details (Detaljer) og skærmen Edit and Create (Rediger og opret) viser den samme post, indtil brugeren vælger en anden i BrowseScreen1.Both the Details screen and the Edit and Create screen show the same record until the user selects a different one on BrowseScreen1. Felterne i den pågældende post forbliver angivet til de værdier, der senest blev gemt, ikke de ændringer, som brugeren har foretaget og derefter afbrudt.The fields in that record remain set to the values that were most recently saved, not any changes that the user made and then abandoned.

Hvis brugeren ændrer en eller flere værdier i formularen og derefter vælger fluebensikonet i funktionen SubmitForm, sendes brugerens ændringer til datakilden.If the user changes one or more values in the form and then selects the "checkmark" icon, the SubmitForm function sends the user's changes to the data source.

  • Hvis ændringerne gemmes, kører formularens formel OnSuccess, og funktionen Back() åbner skærmen Details (Detaljer) for at vise den opdaterede post.If the changes are successfully saved, the form's OnSuccess formula runs, and the Back() function opens the detail screen to show the updated record.
  • Hvis ændringerne ikke gemmes, kører formularens formel OnFailure, men det ændrer ikke noget, fordi den er tom.If the changes aren't successfully saved, the form's OnFailure formula runs, but it doesn't change anything because it's blank. Skærmen Edit and create (Rediger og opret) forbliver åben, så brugeren enten kan annullere ændringerne eller rette fejlen.The Edit and Create screen remains open so that the user can either cancel the changes or fix the error. LblFormError1 viser en brugervenlig fejlmeddelelse, som formularens egenskab Error er angivet til.LblFormError1 shows a user-friendly error message, to which the form's Error property is set.

På samme måde som en kontrolelement til visning af en formular indeholder et kontrolelement til redigering af en formular kortkontrolelementer, som indeholder andre kontrolelementer, der viser forskellige felter i en post:As with a Display form control, an Edit form control contains Card controls, which contain other controls that show different fields in a record:

Kontrolelementer til redigering af et kort og kortkontrolelementer, som er blevet valgt under udviklingen

På det forrige billede viser det valgte kort feltet AssetID og indeholder et tekstinputkontrolelement, så brugeren kan redigere værdien i dette felt.In the previous image, the selected card shows the AssetID field and contains a Text input control so that the user can edit the value of that field. (I modsætning hertil viser den detaljerede skærm det samme felt i et etiketkontrolelement, som er skrivebeskyttet). Tekstinputkontrolelementet har en egenskab af typen Default, der er angivet til Parent.Default.(In contrast, the detail screen shows the same field in a Label control, which is read-only.) The Text input control has a Default property, which is set to Parent.Default. Hvis brugeren var ved at oprette en post i stedet for at redigere en, ville dette kontrolelement vise en indledende værdi, som brugeren kan ændre for den nye post.If the user were creating a record instead of editing one, that control would show an initial value that the user can change for the new record.

I ruden til højre kan du få vist eller skjule hvert kort, flytte rundt på dem eller konfigurere dem til at vise felter i forskellige typer kontrolelementer.In the right-hand pane, you can show or hide each card, rearrange them, or configure them to show fields in different types of controls.

Skærmen Edit (Rediger) med ruden med indstillinger åben

Opret en app fra bundenBuild an app from scratch

Når du forstår, hvordan PowerApps opretter en app, kan du bygge en selv, der bruger de samme grundsten og formler, der blev beskrevet tidligere i dette emne.By understanding how PowerApps generates an app, you can build one yourself that uses the same building blocks and formulas discussed earlier in this topic.

Identificer testdataIdentify test data

For at få mest muligt ud af dette emne kan du starte med en datakilde, som du kan prøve dig frem med.To get the most from this topic, start with a data source with which you can experiment. Den skal indeholde testdata, som du kan læse og opdatere uden problemer.It should contain test data that you can read and update without concern.

Bemærk! Hvis du bruger en SharePoint-liste eller en Excel-tabel, der indeholder kolonnenavne med mellemrum, som datakilde, erstatter PowerApps mellemrummene med "_x0020_".Note: If you use a SharePoint list or an Excel table that contains column names with spaces as your data source, PowerApps will replace the spaces with "_x0020_". "Kolonnenavn" i SharePoint eller Microsoft Excel vises f.eks. som "Kolonne_x0020_Navn" i PowerApps, når det vises i datalayoutet eller bruges i en formel.For example, "Column Name" in SharePoint or Excel will appear as "Column_x0020_Name" in PowerApps when displayed in the data layout or used in a formula.

Følg resten af dette emne helt ved at oprette en SharePoint-liste, der hedder "Ice Cream", der indeholder disse data:To follow the rest of this topic exactly, create a SharePoint list named "Ice Cream" that contains this data:

SharePoint Ice Cream-liste

  • Opret en app fra bunden til telefoner, og slut den til din datakilde.Create an app from blank, for phones, and connect it to your data source.

    Bemærk! Tabletapps er meget lig telefonapps, men du kan vælge et andet skærmlayout for at få mest muligt ud af den ekstra skærmplads.Note: Tablet apps are very similar, but you may want a different screen layout to make the most of the extra screen space.

    Eksemplerne i resten af emnet er baseret på en datakilde med navnet Ice Cream.The examples in the rest of the topic are based on a data source named Ice Cream.

Gennemse posterBrowse records

Hent nogle oplysninger fra en post ved at finde dem i et galleri på en gennemgangsskærm.Get a quick piece of information from a record by finding it in a gallery on a browse screen.

  1. Tilføj et lodret galleri, og rediger layoutet til kun at indeholde en titel.Add a Vertical gallery, and change the layout to Title only.

    Galleri tilsluttet datakilden Ice Cream

  2. Angiv galleriets egenskab Items til Ice Cream.Set the gallery's Items property to Ice Cream.
  3. Angiv egenskaben Text for den første etiket i galleriet til ThisItem.Title, hvis den ikke er angivet til noget andet.Set the Text property of the first label in the gallery to ThisItem.Title if it's set to something else.

    Etiketten viser nu værdien i feltet Title (Titel) for hver post.The label now shows the value in the Title field for each record.

    Galleri tilsluttet datakilden Ice Cream

  4. Rediger størrelsen på galleriet for at fylde hele skærmen, og angiv dets egenskab TemplateSize til 60.Resize the gallery to fill the screen, and set its TemplateSize property to 60.

    Skærmbilledet ligner dette eksempel, der viser alle posterne i datakilden:The screen resembles this example, which shows all records in the data source:

    Galleri tilsluttet datakilden Ice Cream

Se detaljerView details

Hvis galleriet ikke viser de oplysninger, du vil have vist, kan du vælge pilen for en post for at åbne skærmen med detaljer.If the gallery doesn't show the information that you want, select the arrow for a record to open the details screen. Et kontrolelement til visning af en formular på skærmbilledet viser flere og eventuelt alle felter for den valgte post.A Display form control on that screen shows more, possibly all, fields for the record that you selected.

Kontrolelementet til visning af en formular bruger to egenskaber til at vise posten:The Display form control uses two properties to display the record:

  • Egenskaben DataSource.DataSource property. Navnet på den datakilde, der indeholder posten.The name of the data source that holds the record. Denne egenskab udfylder det højre panel med felter og bestemmer visningsnavn og datatype (streng, nummer, dato osv.) for hvert felt.This property populates the right-hand panel with fields and determines the display name and data type (string, number, date, etc.) of each field.
  • Egenskaben Item.Item property. Den post, der skal erstattes.The record to display. Denne egenskab er ofte forbundet med egenskaben Selected for gallerikontrolelementet, så brugeren kan vælge en post i gallerikontrolelementet og derefter undersøge denne post nærmere.This property is often connected to the Selected property of the Gallery control so that the user can select a record in the Gallery control and then drill into that record.

Når egenskaben DataSource er angivet, kan du tilføje og fjerne felter i ruden til højre og ændre, hvordan de vises.When the DataSource property is set, you can add and remove fields through the right-hand pane and change how they're displayed.

På dette skærmbillede kan brugerne bevidst eller utilsigtet ændre værdier for posten.On this screen, users can't intentionally or accidentally change any values of the record. Kontrolelementet til visning af en formular er et skrivebeskyttet kontrolelement, så det ændrer ikke en post.The Display form control is a read-only control, so it won't modify a record.

Sådan tilføjes et kontrolelement til visning af en formular:To add a Display form control:

  1. Tilføj en skærm, og føj derefter et kontrolelement til visning af en formular til skærmen.Add a screen, and then add a Display form control to it
  2. Angiv egenskaben DataSource for kontrolelementet til 'Ice Cream'.Set the DataSource property of the form control to 'Ice Cream'.

Du kan vælge de felter, der vises på skærmen, og hvilken type kort der skal vises for hvert felt, i ruden til højre.In the right-hand pane, you can select the fields to display on your screen and which type of card to display for each field. Når du foretager ændringer i ruden til højre, angives egenskaben DataField for hvert kortkontrolelement til det felt, som brugeren vil arbejde med.As you make changes in the right-hand pane, the DataField property on each Card control is set to the field that the user will interact with. Skærmen skal ligne dette eksempel:Your screen should resemble this example:

Få vist formular for Ice Cream-datakilde

Til sidst skal vi oprette forbindelse mellem kontrolelementet til visning af en formular og gallerikontrolelementet, så vi kan se detaljerne om en bestemt post.Finally, we need to connect the Display form control to the Gallery control so that we can look at details for a specific record. Når egenskaben Items er blevet angivet, vises den første post fra galleriet i vores formular.As soon as we complete setting the Item property, the first record from the gallery will appear in our form.

  1. Angiv egenskaben Item for kontrolelementet til visning af en formular til Gallery1.Selected.Set the Item property of the Display form control to Gallery1.Selected.

    Detaljerne for det valgte element vises i formularen.The details for the selected item appear in the form.

    Få vist formular for Ice Cream-datakilde, der er tilsluttet gallerikontrolelementet

Fint.Great! Vi går nu til navigationen: Sådan åbner en bruger skærmen med detaljer fra galleriskærmen og åbner galleriskærmen fra skærmen med detaljer.We now turn to navigation: how a user opens the details screen from the gallery screen and opens the gallery screen from the details screen.

  1. Føj et knapkontrolelement til skærmen, angiv dets egenskab Text til at vise Back, og angiv dets egenskab OnSelect til Back().Add a Button control to the screen, set its Text property to show Back, and set its OnSelect property to Back().

    Denne formel tager brugeren tilbage til galleriet, når vedkommende er færdig med at få vist detaljer.This formula returns the user back to the gallery when they finish viewing details.

Få vist formular for Ice Cream-datakilde med tilbage-knap

Lad os nu gå tilbage til gallerikontrolelementet og føje navigation til vores skærm med detaljer.Now, let's return to the Gallery control and add some navigation to our detail screen.

  1. Skift til det første skærmbillede, som er vært for vores gallerikontrolelement, og vælg pilen i det første element i galleriet.Switch to the first screen, which is hosting our Gallery control, and select the arrow in the first item in the gallery.
  2. Angiv egenskaben OnSelect for figuren til denne formel:Set the OnSelect property of the shape to this formula:
    Navigate( Screen2, None )Navigate( Screen2, None )

    Få vist formular for Ice Cream-datakilde med tilbage-knap

  3. Tryk på F5, og vælg derefter en pil i galleriet for at få vist detaljerne for et element.Press F5, and then select an arrow in the gallery to show the details for an item.
  4. Vælg tilbage-knappen for at vende tilbage til galleriet med produkter, og tryk derefter på Esc.Select the Back button to return to the gallery of products, and then press Esc.

Redigering af detaljerEditing details

Vores sidste vigtige aktivitet er at ændre indholdet i en post, hvilket gøres via et kontrolelement til redigering af en formular.Finally, our last core activity is changing the contents of a record, which users accomplish in an Edit form control.

Kontrolelementet til redigering af en formular bruger to egenskaber til at vise og redigere posten:The Edit form control uses two properties to display and edit the record:

  • Egenskaben DataSource.DataSource property. Navnet på den datakilde, der indeholder posten.The name of the data source that holds the record. På samme måde som kontrolelementet til visning af en formular udfylder denne egenskab det højre panel med felter og bestemmer visningsnavn og datatype (streng, nummer, dato osv.) for hvert felt.Just as with the Display form control, this property populates the right-hand panel with fields and determines the display name and data type (string, number, date, etc.) for each field. Denne egenskab bestemmer også, om hvert felts værdi er gyldig, før de sendes til den underliggende datakilde.This property also determines whether each field's value is valid before submitting it to the underlying data source.
  • Egenskaben Item.Item property. Den post, der skal redigeres, og som ofte er knyttet til egenskaben Selected for gallerikontrolelementet.The record to edit, which is often connected to the Selected property of the Gallery control. På denne måde kan du vælge en post i gallerikontrolelementet, få vist posten på skærmen med detaljer og redigere den på skærmen Edit and Create (Rediger og opret).That way, you can select a record in the Gallery control, show it in the details screen, and edit it in the Edit and Create screen.

Sådan tilføjes et kontrolelement til redigering af en formular:To add an Edit form control:

  1. Tilføj en skærm, tilføj et kontrolelement til redigering af en formular, og angiv dets egenskab DataSource til 'Ice Cream'.Add a screen, add an Edit form control, and then set the form's DataSource property to 'Ice Cream'.
  2. Angiv egenskaben Item til Gallery1.Selected.Set the Item property to Gallery1.Selected.

Du kan nu vælge de felter, der skal vises på skærmen.You can now select the fields to display on your screen. Du kan også vælge, hvilken type kort der skal vises for hvert felt.You can also select which type of card to display for each field. Når du foretager ændringer i ruden til højre, angives egenskaben DataField for hvert kortkontrolelement til det felt, som brugeren vil arbejde med.As you make changes in the right-hand pane, the DataField property on each Card control is set to the field your user will interact with. Skærmen skal ligne dette eksempel:Your screen should resemble this example:

Få vist formular for Ice Cream-datakilde

Disse to egenskaber er de samme som egenskaberne i kontrolelementet til visning af en formular.These two properties are the same as the properties on the Display form control. Og med disse alene kan vi få vist detaljerne for en post.And with these alone, we can display the details of a record.

Kontrolelementet til redigering af en formular tilbyder også, at funktionen SubmitForm skriver ændringer tilbage til datakilden.The Edit form control goes further by offering the SubmitForm function to write back changes to the data source. Dette bruger du sammen med et knap- eller billedkontrolelement til at gemme en brugers ændringer.You use this with a button or image control to save a user's changes.

  • Tilføj et knapkontrolelement, angiv dets egenskab Text til at vise Save (Gem) og dets egenskab OnSelect til denne formel:Add a Button control, set its Text property to show Save, and set its OnSelect property to this formula:
    SubmitForm( Form1 ) SubmitForm( Form1 )

Redigering af formular for Ice Cream-datakilde

Sådan føjes navigation til og fra dette skærmbillede:To add navigation to and from this screen:

  1. Tilføj endnu et knapkontrolelement, angiv dets egenskab Text til at vise Cancel (Annuller), og angiv dets egenskab OnSelect til denne formel:Add another Button control, set its Text property to show Cancel, and set its OnSelect property to this formula:
    ResetForm( Form1 ); Back()ResetForm( Form1 ); Back()

    Denne formel sletter ændringer, der ikke er blevet gemt, og åbner det forrige skærmbillede.This formula discards any unsaved edits and opens the previous screen.

    Få vist formular for Ice Cream-datakilde

  2. Angiv egenskaben OnSuccess til Back().Set the OnSuccess property of the form to Back().

    Når opdateringer er blevet gemt, åbnes det forrige skærmbillede (i dette tilfælde skærmen med detaljer) automatisk.When updates are successfully saved, the previous screen (in this case, the details screen) opens automatically.

    Redigering af formular med reglen "OnSuccess" tilføjet

  3. Tilføj en knap på skærmen Display (Vis), angiv dens egenskab Text til at vise Edit (Rediger), og angiv dens egenskab OnSelect til denne formel:On the Display screen, add a button, set its Text property to show Edit, and set its OnSelect property to this formula:
    Navigate( Screen3, None )Navigate( Screen3, None )

    Visning af formular med knappen "Edit" (Rediger) tilføjet

Du har nu bygget en grundlæggende app med tre skærmbilleder til visning og indtastning af data.You've built a basic app with three screens for viewing and entering data. Du kan prøve den ved at få vist galleriskærmbilledet og trykke på F5 (eller vælge pil fremad til visning af et eksempel øverst til venstre på skærmbilledet).To try it out, show the gallery screen, and then press F5 (or select the forward arrow "Preview" button near the upper-left corner of the screen). Den lyserøde prik angiver, hvor brugeren klikker eller trykker på skærmen på hvert trin.The pink dot indicates where the user clicks or taps the screen at each step.

Prøv Ice Cream-appen

Opret en postCreate a record

Brugeren arbejder med den samme redigeringsformular til både opdatering og oprettelse af poster.The user interacts with the same Edit form to both update and create records. Når brugeren vil oprette en post, skifter funktionen NewForm til tilstanden New (Ny).When the user wants to create a record, the NewForm function switches the form to New mode.

Når formularen er i tilstanden New (Ny), angives værdien for hvert felt til standardværdierne for datakilden.When the form is in New mode, the value of each field is set to the defaults of the data source. Den post, der er angivet for formularens egenskab Item, ignoreres.The record that's provided to the form's Item property is ignored.

Når brugeren er klar til at gemme den nye post, kører SubmitForm.When the user is ready to save the new record, SubmitForm runs. Når formularen er blevet sendt, skifter den tilbage til EditMode.After the form is successfully submitted, the form is switched back to EditMode.

På det første skærmbillede skal du tilføje en knap af typen New (Ny):On the first screen, you'll add a New button:

  1. Tilføj et knapkontrolelement på skærmen med galleriet.On the screen with the gallery, add a Button control.
  2. Angiv knappens egenskab Text til New (Ny) og dens egenskab OnSelect til denne formel:Set the button's Text property to New and its OnSelect property to this formula:
    NewForm( Form1 ); Navigate( Screen3, None ) NewForm( Form1 ); Navigate( Screen3, None )

    Formlen skifter til kontrolelementet til redigering af en formularScreen3 til tilstanden New (ny) og åbner det pågældende skærmbillede, så brugeren kan udfylde det.This formula switches the Edit form control on Screen3 to New mode and opens that screen so that the user can fill it in.

Visning af formular med knappen "Edit" (Rediger) tilføjet

Når skærmbilledet Edit and create (Rediger og opret) åbnes, er formularen tom, så brugeren kan tilføje en vare.When the Edit and Create screen opens, the form is empty, ready for the user to add an item. Når brugeren vælger knappen Save (Gem), sikrer funktionen SubmitForm, at der oprettes en post, i stedet for at den opdateres.When the user selects the Save button, the SubmitForm function ensures that a record is created instead of being updated. Hvis brugeren vælger knappen til annullering skifter funktionen ResetForm formularen tilbage til redigeringstilstand, og funktionen Back åbner skærmen til gennemsyn af galleriet.If the user selects the Cancel button, the ResetForm function switches the form back to Edit mode, and the Back function opens the screen for browsing the gallery.

Slet en postDelete a record

  1. På skærmen Display (Vis) skal du tilføje en knap og angive dens egenskab Text til at vise Delete (Slet).On the Display screen, add a button, and set its Text property to show Delete..
  2. Angiv knappens egenskab OnSelect til denne formel:Set the button's OnSelect property to this formula:
    Remove( 'Ice Cream', Gallery1.Selected ); Back()Remove( 'Ice Cream', Gallery1.Selected ); Back()

    Visning af formular med knappen "Edit" (Rediger) tilføjet

Håndtering af fejlHandling errors

I denne app opstår der en fejl, når værdien af et felt ikke er gyldigt, når et obligatorisk felt er tomt, når du ikke har forbindelse til netværket eller andre problemer, der måtte opstå.In this app, an error occurs when the value of a field is not valid, a required field is blank, you're disconnected from the network, or any number of other problems pop up.

Hvis SubmitForm af en eller anden grund mislykkes, indeholder egenskaben Error for kontrolelementet til redigering af en formular en fejlmeddelelse, som brugeren får vist.If SubmitForm fails for any reason, the Error property of the Edit form control contains an error message to show the user. Brugeren skal kunne løse problemet og gensende ændringen eller annullere opdateringen med disse oplysninger.With this information, the user should be able to correct the issue and resubmit the change, or they can cancel the update.

  1. Tilføj et etiketkontrolelement på skærmbilledet Edit and create (Rediger og Opret), og flyt det ned under knappen Gem.On the Edit and Create screen, add a Label control, and move it just below the Save button.

    En fejl vil være let at se, når brugeren vælger dette kontrolelement for at gemme ændringerne.Any error will be easy to see after the user selects this control to save changes.

  2. Angiv egenskaben Text for etiketkontrolelementet for at få vist Form1.Error.Set the Text property of the Label control to show Form1.Error.

Visning af formular med knappen "Edit" (Rediger) tilføjet

I en app, der oprettes fra data af PowerApps, angives egenskaben AutoHeight for dette kontrolelement til true, så der ikke bruges noget plads, hvis der ikke opstår nogen fejl.In an app that PowerApps generates from data, the AutoHeight property on this control is set to true so that no space is consumed if no error occurs. Egenskaberne Height og Y for kontrolelementet til redigering af en formular justeres også dynamisk for at tage højde for, at dette kontrolelement bliver større, når der opstår en fejl.The Height and Y properties of the Edit form control are also adjusted dynamically to account for this control growing when an error occurs. Du kan få flere oplysninger ved at oprette en app fra eksisterende data og undersøge disse egenskaber.For more details, generate an app from existing data, and inspect these properties. Tekstfeltkontrolelementet til fejl er meget kort, når der ikke er opstået nogen fejl, og det kan være nødvendigt at åbne visningen Advanced (Avanceret) (tilgængelig på fanen View (Vis)) for at vælge dette kontrolelement.The text-box control for errors is very short when no error has occurred, you may need to open the Advanced view (available on the View tab) to select this control.

App fra formularen til redigering af data med kontrolelementet til fejltekst markeret

App fra formularen til redigering af data med formularkontrolelementet markeret

Opdater dataRefresh data

Datakilden opdateres, hver gang brugeren åbner appen, men brugeren vil muligvis opdatere posterne i galleriet uden at lukke appen.The data source is refreshed whenever the user opens the app, but the user might want to refresh the records in the gallery without closing the app. Tilføj en knap af typen Refresh (Opdater), så brugeren kan vælge at opdatere dataene manuelt:Add a Refresh button so that the user can select it to manually refresh the data:

  1. På skærmbilledet med gallerikontrolelementet skal du tilføje et knapkontrolelement og angive dets egenskab Text til at vise Refresh (Opdater).On the screen with the Gallery control, add a Button control and set its Text property to show Refresh.
  2. Angiv egenskaben OnSelect for dette kontrolelement til denne formel:Set the OnSelect property of this control to this formula:
    Refresh( 'Ice Cream' )Refresh( 'Ice Cream' )

Opdater datakilden

I den app, PowerApps oprettede fra data, udelod vi i første omgang to kontrolelementer øverst på gennemgangsskærmen.In the app that PowerApps generated from data, we neglected to discuss two controls at the top of the Browse screen. Brugeren kan ved hjælp af disse kontrolelementer søge efter en eller flere poster, sortere listen med poster i stigende eller faldende rækkefølge eller begge dele.By using these controls, the user can search for one or more records, sort the list of records in ascending or descending order, or both.

Sorterings- og søgningskontrolelementer på gennemgangsskærmen

Når brugeren vælger knappen til sortering, ændres sorteringsrækkefølgen i galleriet.When the user selects the sort button, the sort order of the gallery reverses. Til denne funktionsmåde bruger vi en kontekstvariabel til at spore den retning, galleriet sorteres i.To create this behavior, we use a context variable to track the direction in which the gallery is sorted. Når brugeren vælger knappen, opdateres variablen, og retningen ændres.When the user selects the button, the variable is updated, and the direction reverses. Egenskaben OnSelect for sorteringsknappen angives til denne formel: UpdateContext( {SortDescending1: !SortDescending1} )The OnSelect property of the sort button is set to this formula: UpdateContext( {SortDescending1: !SortDescending1} )

Funktionen UpdateContext opretter kontekstvariablen SortDescending1, hvis den ikke allerede findes.The UpdateContext function creates the SortDescending1 context variable if it doesn't already exist. Funktionen læser værdien for variablen og angiver den til den logiske modsatte værdi ved hjælp af operatoren !The function will read the value of the variable and set it to the logical opposite by using the ! .operator. Hvis værdien er true, bliver den false.If the value is true, it becomes false. Hvis værdien er false, bliver den true.If the value is false, it becomes true.

Formlen for egenskaben Items for gallerikontrolelementet bruger denne kontekstvariabel sammen med teksten i kontrolelementet TextSearchBox1:The formula for the Items property of the Gallery control uses this context variable, along with the text in the TextSearchBox1 control:

Gallery1.Items = Sort( If( IsBlank(TextSearchBox1.Text),
                           Assets,
                           Filter( Assets,
                                   TextSearchBox1.Text in Text(ApproverEmail) ) ),
                        ApproverEmail,
                        If(SortDescending1, Descending, Ascending) )

Lad os gennemgå det trin for trin:Let's break this down:

  • På ydersiden har vi funktionen Sort med tre argumenter: En tabel, et felt, der skal sorteres, og den retning, der skal sorteres i.On the outside, we have the Sort function, which takes three arguments: a table, a field on which to sort, and the direction in which to sort.

    • Sorteringsretningen stammer fra kontekstvariablen, der skifter, når brugeren vælger kontrolelementet ImageSortUpDown1.The sort direction is taken from the context variable that toggles when the user selects the ImageSortUpDown1 control. Værdien true/false oversættes til konstanterne Descending (Faldende) og Ascending (Stigende).The true/false value is translated to the constants Descending and Ascending.
    • Det felt, der skal sorteres i, fastsættes til ApproverEmail.The field to sort on is fixed to ApproverEmail. Hvis du ændrer de felter, der vises i galleriet, skal du også ændre dette argument.If you change the fields that appear in the gallery, you'll need to change this argument too.
  • På indersiden har vi funktionen Filter med en tabel som et argument og et udtryk, der skal evalueres for hver post.On the inside, we have the Filter function, which takes a table as an argument and an expression to evaluate for each record.

    • Tabellen er den rå datakilde Assets (Aktiver), som er udgangspunktet inden filtrering eller sortering.The table is the raw Assets data source, which is the starting point before filtering or sorting.
    • Udtrykket søger efter en instans af strengen i TextSearchBox1 inden for feltet ApproverEmail.The expression searches for an instance of the string in TextSearchBox1 within the ApproverEmail field. Hvis du ændrer de felter, der vises i galleriet, skal du igen opdatere dette argument.Again, if you change the fields that appear in the gallery, you'll also need to update this argument.
    • Hvis TextSearchBox1 er tom, vil brugeren have vist alle poster, og funktionen Filter tilsidesættes.If TextSearchBox1 is empty, the user wants to show all records, and the Filter function is bypassed.

Dette er blot ét eksempel: Du kan udforme din egen formel for egenskaben Items, afhængigt af behovene i din app, ved at sætte Filter, Sort og andre funktioner og operatorer sammen.This is but one example; you can craft your own formula for the Items property, depending on the needs of your app, by composing Filter, Sort, and other functions and operators together.

SkærmbilleddesignScreen design

Vi har endnu ikke gennemgået andre måder til fordeling af kontrolelementer på tværs af skærmene.So far, we haven't discussed other ways to distribute controls across screens. Det skyldes, at du har mange muligheder, og det bedste valg afhænger af behovene i forbindelse med din app.That's because you have many options, and the best selection depends on your specific app's needs.

Da der er så mange begrænsninger forbundet med at få vist ejendomme på telefonskærme, vil du sandsynligvis gennemgå, få vist og redigere/oprette på forskellige skærmbilleder.Because real estate on phone screens is so limited, you probably want to browse, display, and edit/create on different screens. I dette emne åbner funktionerne Navigate og Back hvert skærmbillede.In this topic, the Navigate and Back functions open each screen.

På en tablet kan du gennemse, få vist og redigere/oprette på to eller endda én skærm.On a tablet, you can browse, display, and edit/create on two or even one screen. Sidstnævnte kræver hverken funktionen Navigate eller Back.For the latter, no Navigate or Back function would be required.

Hvis brugeren arbejder på samme skærmbillede, skal du være opmærksom på, at brugeren ikke kan ændre valget i galleriet og potentielt kan miste ændringer i kontrolelementet til redigering af en formular.If the user is working on the same screen, you need to be careful that the user can't change the selection in the Gallery and potentially lose edits in the Edit form control. Hvis du vil forhindre brugeren i at vælge en anden post, når ændringer af en anden post endnu ikke er blevet gemt, kan du angive egenskaben Disabled for galleriet til denne formel:To keep the user from selecting a different record when changes to another record haven't been saved yet, set the Disabled property of the gallery to this formula:
EditForm.Unsaved EditForm.Unsaved