Pre-enter text in a textfield in SwiftUI

Viewed 197

I was able to solve my problem i had earlier on how to update data in Firestore via UI. Now the next problem: I would like to have my Firebase-Stored Data pre-entered in a text field so you can just !edit! the text in the fields you want instead of writing all data new in every single field. As you can see, the only thing i was able to do, is getting the stored data in the text field as placeholder, which means you have to re-write all data in case you want to update just 1 field.

CODE:

import SwiftUI
import Firebase

struct ContentViewVier: View {
    
    @ObservedObject var dataDrei = getDataZwei()
    
    var body: some View {
       
        NavigationView{
            
            ZStack(alignment: .top){
                
                GeometryReader{_ in
                    
                    // Home View....
                    Text("Bitte Seriennummer eingeben").foregroundColor(.black)
                    
                }.background(Color("FarbeSeriennummerStartbildschirm").edgesIgnoringSafeArea(.all))
                
                CustomSearchBarEdit(dataZwei: self.$dataDrei.datasZwei).padding(.top)
                
            }.navigationBarTitle("")
            .navigationBarHidden(true)
        }
    }
}


struct CustomSearchBarEdit : View {
    
    @State var txt = ""
    @Binding var dataZwei : [dataTypeZwei]
    
    var body : some View{
        
        VStack(spacing: 0){
            
            HStack{
                
                TextField("Nach Seriennummer suchen", text: self.$txt).opacity(100).foregroundColor(.black)
                
                if self.txt != ""{
                    
                    Button(action: {
                        
                        self.txt = ""
                        
                    }) {
                        
                        Text("Abbrechen")
                    }
                    .foregroundColor(.black)
                    
                }

            }.padding()
            
            if self.txt != ""{
                
                if
                    self.dataZwei.filter({$0.sn.lowercased() .contains(self.txt.lowercased())}).count == 0 {
                        
                    Text("Es wurde kein Gerät mit dieser Seriennummer gefunden").foregroundColor(Color.red.opacity(0.6)).padding()
                    
                }
                
                else{
                    
                    List(self.dataZwei.filter{$0.sn.contains(self.txt.lowercased())}){j in
                            
                        NavigationLink(destination: DetailZwei(data: j)) {
                        
                        Text(j.sn)
                    }
                         
                        Text(j.typ)
                    
                        
                    }.frame(height: UIScreen.main.bounds.height / 5)
                    
                }

            }
        
            
            
        }.background(Color.white)
        .padding()
    }
}

class getDataZwei : ObservableObject{
    
    @Published var datasZwei = [dataTypeZwei]()
    
    init() {
        
        let db = Firestore.firestore()
        
        db.collection("Geräte").getDocuments { (snap, err) in
            
            if err != nil{
                
                print((err?.localizedDescription)!)
                return
            }
            
            for i in snap!.documents{
                
                let id = i.documentID
                let sn = i.get("Seriennummer") as! String
                let objekt = i.get("Objekt") as! String
                let str = i.get("Strasse") as! String
                let pos = i.get("Position") as! String
                let typ = i.get("Gerätetyp") as! String
                let ida = i.get("Installation")as! String
                let lg = i.get("LeasingOderGekauft")as! String
                let la = i.get("LeasingAblaufdatum")as! String
                let ga = i.get("GarantieAblaufdatum")as! String
                let nr = i.get("Hausnummer")as! String
                let plz = i.get("Postleitzahl")as! String
                let ort = i.get("Ort")as! String
                let vp = i.get("Verantwortlich")as! String
                let tel = i.get("Telefonnummer")as! String
                let zusatz = i.get("Zusätzlich")as! String
                let ed = i.get("EingetragenDurch")as! String
                let ldvds = i.get("LieferungBeiVDS")as! String
                
                self.datasZwei.append(dataTypeZwei(id: id, sn: sn, pos: pos, typ: typ, ida: ida, lg: lg, la: la, ga: ga, objekt: objekt, str: str, nr: nr, plz: plz, ort: ort, vp: vp, tel: tel, zusatz: zusatz, ed: ed, ldvds: ldvds))
            }
        }
    }
}

struct dataTypeZwei : Identifiable, Codable {
    
    var id: String? = UUID().uuidString
    var sn : String
    var pos : String
    var typ : String
    var ida : String
    var lg : String
    var la : String
    var ga : String
    var objekt : String
    var str : String
    var nr : String
    var plz : String
    var ort : String
    var vp : String
    var tel : String
    var zusatz : String
    var ed : String
    var ldvds : String
    
    enum CodingKeys: String, CodingKey {
        case sn = "Seriennummer"
        case objekt = "Objekt"
        case str = "Strasse"
        case nr = "Hausnummer"
        case ort = "Ort"
        case vp = "Verantwortlich"
        case tel = "Telefonnummer"
        case pos = "Position"
        case typ = "Gerätetyp"
        case ida = "Installation"
        case lg = "LeasingOderGekauft"
        case la = "LeasingAblaufdatum"
        case ga = "GarantieAblaufdatum"
        case zusatz = "Zusätzlich"
        case plz = "Postleitzahl"
        case ed = "EingetragenDurch"
        case ldvds = "LieferungBeiVDS"
    }
}

struct DetailZwei : View {
    
    
   var data : dataTypeZwei
    @State var viewModel = GerätEditieren()
    @State var serie: String? = nil
    @Environment(\.presentationMode) var presentationMode
    
    
    var body : some View {
        
        NavigationView {
            ScrollView {
                Group {
            Section(header: Text("Gerät")) {
                Text("Seriennummer")
                TextField(data.sn, text: $viewModel.gerät.sn).textFieldStyle(RoundedBorderTextFieldStyle())
                Text("Objekt")
            TextField(data.objekt, text: $viewModel.gerät.objekt).textFieldStyle(RoundedBorderTextFieldStyle())
                Text("Gerätetyp")
            TextField(data.typ, text: $viewModel.gerät.typ).textFieldStyle(RoundedBorderTextFieldStyle())
                Text("Geräteposition")
            TextField(data.pos, text: $viewModel.gerät.pos).textFieldStyle(RoundedBorderTextFieldStyle())
                    }
                    Group {
                Text("Installationsdatum")
            TextField(data.ida, text: $viewModel.gerät.ida).textFieldStyle(RoundedBorderTextFieldStyle())
                Text("Leasing oder Gekauft?")
            TextField(data.lg, text: $viewModel.gerät.lg).textFieldStyle(RoundedBorderTextFieldStyle())
                Text("Ablaufdatum Leasing")
            TextField(data.la, text: $viewModel.gerät.la).textFieldStyle(RoundedBorderTextFieldStyle())
                Text("Ablaufdatum Garantie")
            TextField(data.ga, text: $viewModel.gerät.ga).textFieldStyle(RoundedBorderTextFieldStyle())
            }
                    
            Section(header: Text("Adresse")) {
                Text("Strasse")
            TextField(data.str, text: $viewModel.gerät.str).textFieldStyle(RoundedBorderTextFieldStyle())
                Text("Hausnummer")
            TextField(data.nr, text: $viewModel.gerät.nr).textFieldStyle(RoundedBorderTextFieldStyle())
                Text("Postleitzahl")
            TextField(data.plz, text: $viewModel.gerät.plz).textFieldStyle(RoundedBorderTextFieldStyle())
                Text("Ort")
            TextField(data.ort, text: $viewModel.gerät.ort).textFieldStyle(RoundedBorderTextFieldStyle())
            }
                
            Section(header: Text("Kontakt")) {
                Text("Ansprechperson")
            TextField(data.vp, text: $viewModel.gerät.vp).textFieldStyle(RoundedBorderTextFieldStyle())
                Text("Telefonnummer")
            TextField(data.tel, text: $viewModel.gerät.tel).textFieldStyle(RoundedBorderTextFieldStyle())
            }
            Section(header: Text("VDS")) {
                Text("Eingetragen durch")
                TextField(data.ed, text: $viewModel.gerät.ed).textFieldStyle(RoundedBorderTextFieldStyle())
                Text("Lieferdatum VDS")
                TextField(data.ldvds, text: $viewModel.gerät.ldvds).textFieldStyle(RoundedBorderTextFieldStyle())
            }
            
            Section(header: Text("Zusätzliche Informationen")) {
                Text("Zusätzliche Informationen")
            TextField(data.zusatz, text: $viewModel.gerät.zusatz).textFieldStyle(RoundedBorderTextFieldStyle())
            }
            }.padding()
            
            .navigationBarTitle("Gerät bearbeiten", displayMode: .inline)
                    .navigationBarItems(leading: Button(action: { self.handleCancelTapped() }, label: {
                        Text("Abbrechen")
                    }),
                                        trailing: Button(action: { self.handleDoneTapped() }, label: {
                                            Text("Speichern")
                    })
                   // .disabled(!viewModel.modified)
                )
            }
            }
    }
                func handleCancelTapped() {
                dismiss()
                }
                func handleDoneTapped() {
                    
                    let db = Firestore.firestore()
                    
                    let docRef = db.collection("Geräte").document(data.id!)
                    print("setting data")
                    docRef.updateData(["Seriennummer": "\(viewModel.gerät.sn)", "Objekt": "\(viewModel.gerät.objekt)", "Strasse": "\(viewModel.gerät.str)", "Hausnummer": "\(viewModel.gerät.nr)", "Ort": "\(viewModel.gerät.ort)", "Verantwortlich": "\(viewModel.gerät.vp)", "Telefonnummer": "\(viewModel.gerät.tel)", "Position": "\(viewModel.gerät.pos)", "Gerätetyp": "\(viewModel.gerät.typ)", "Installation": "\(viewModel.gerät.ida)", "LeasingOderGekauft": "\(viewModel.gerät.lg)", "LeasingAblaufdatum": "\(viewModel.gerät.la)", "GarantieAblaufdatum": "\(viewModel.gerät.ga)", "Zusätzlich": "\(viewModel.gerät.zusatz)", "Postleitzahl": "\(viewModel.gerät.plz)", "EingetragenDurch": "\(viewModel.gerät.ed)", "LieferungBeiVDS": "\(viewModel.gerät.ldvds)"]){ (error) in
                        if let error = error {
                            print("error = \(error)")
                        } else if self.viewModel.gerät.sn == "" {
                            self.viewModel.gerät.sn = self.data.sn
                        }
                        else {
                            print("data uploaded successfully")
                    }
                    }
                    dismiss()
    }
                
                
                
                func dismiss() {
                    presentationMode.wrappedValue.dismiss()
                }
    }







struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentViewVier()
    }
}
1 Answers

This belong to your viewModel to initialize the Published values with the exact value.

Another option is to set the State variables, which you pass to your TextField with the actual value.

@State var vp : String 

init(data: Data) { 
    self._vp = State(initialValue: data.vp) //<< here set the value from Firebase
}

TextField(data.vp, text: $vp).textFieldStyle(RoundedBorderTextFieldStyle())
Related