formly-js / angular-formly

JavaScript powered forms for AngularJS
http://docs.angular-formly.com
MIT License
2.22k stars 405 forks source link

need to pass fields into generic Modal popup onClick on a button in inner field #552

Closed srivshreya closed 8 years ago

srivshreya commented 8 years ago

http://angular-formly.com/#/example/advanced/repeating-section

In this example , in the inner fields, I have a button as a field and I want to open a modal popup on the click of that button. and I need to pass all the fields with their model values. So that i can edit that particular investment. Currently I am able to pass only model. I want to make my modal popup more generic and so I want it to take fields as well from the JSON.

Hoping you could guide me on the same.

{ "key": "expectedFund", "type": "customLayout", "templateOptions": { "buttonLabel": "Add Row", "columnHeader": ["First Name", "City of Birth", "Last Name", "Date Of Birth"], "columclass": "col-xs-6 col-sm-4 col-md-3 col-lg-2", "label": "testing row", "fields": [{ "fieldGroup": [{ "className": "col-xs-6 col-sm-4 col-md-3 col-lg-2", "key": "firstname", "type": "input", "templateOptions": {

                }
            }, {
                "className": "col-xs-6 col-sm-4 col-md-3 col-lg-2",
                "key": "city",
                "type": "select",
                "templateOptions": {
                    "valueProp": "name",
                    "options": [{
                        "name": "Pune"
                    }, {
                        "name": "Lucknow"
                    }]
                }
            }, {
                "className": "col-xs-6 col-sm-4 col-md-3 col-lg-2",
                "key": "lastname",
                "type": "input",
                "templateOptions": {

                }
            }, {
                "className": "col-xs-6 col-sm-4 col-md-3 col-lg-2",
                "key": "dateOfBirth",
                "type": "datepicker"
            }, {
                "className": "col-xs-6 col-sm-4 col-md-3 col-lg-2",
                "key": "buttonKey",
                "type": "button",
                "templateOptions": {
                    "text": "Edit",
                    "onClick": "func:IntelligentBusinessFormValidationAPI.editData"
                }
            }]
        }]
    }
}

customLayout:


{{columnName}}

button: