Help with FormBuilder and arrays


#1

I’ve been getting a lot of help on these forums over the last few days trying to get into Ionic 2 Development, so thanks to all posters.

I’m trying to send an array of data as JSON with FormBuilder. I can get the basics working but when I try to nest JSON it all falls apart.

I want my JSON to look like this:

{
  "type": "job",
  "title": "Just a Title",
  "description": "This is a description of job",
  "tasks": [
     {
      "task1": "Lorem ipsum dolor sit amet",
      "task2": "Vestibulum id mollis enim"
     }
   ]
  "address": [
     {
       "street": "123 Main St",
      "city": "Greenville",
      "state": "NM",
      "zip": "12345",
     }
  ]
}

I’ve looked at many blog posts, forums and StackoverFlow but I can’t seem to get a working example. Any help would be appreciated.

My environment:

Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.17
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.45
ios-deploy version: 1.9.0
ios-sim version: 5.0.11
OS: OS X El Capitan
Node Version: v7.3.0
Xcode version: Xcode 8.2 Build version 8C38
[details=Summary]This text will be hidden[/details]

#2
  • FormBuilder doesn’t “send” anything
  • The JSON you posted does not look like an array
  • “It all falls apart” is very vague and difficult for anybody to do anything constructive with

#3

Thanks for the reply. Here’s a plnkr of what I have currently working. Look at add-job.html and add-job.ts
plnkr


#4

I’m still not seeing any sending or JSON or arrays, I don’t understand what addInput is supposed to do because I don’t see any hook to call it, but perhaps you will find this of some use.


#5

you just need to use nested groups… not sure what is going on in your plnkr, but it is not very helpful

https://embed.plnkr.co/9epwAO58jSP5gBtpsZh3/


#6
AddInput
is currently an unused function that automatically adds another task input, I was just testing. Thanks for the link. That's what I'm trying to do. I've been looking at that post for hours today trying to get it working with my data. I'll just keep at it.

Thanks


#7

Thanks @aaronksaunders. That plnkr is perfect. Simple enough for even me to understand.


#8

no problem… sometimes simple is better :+1:


#9

It was bugging me so i had to make it work… here you go - http://embed.plnkr.co/w2ibdG/


#10

thanks @aaronksaunders. I very much appreciate your help. I saw you started that yesterday and I was just working out the addTask() function. Awesome!