Way to bind custom functions for buttons?

[ram-reddy]

when we have multiple buttons in a single form, want to bind functions for each button, I cannot see there is a way.

[dschnelldavis]

Can you give me an example?

One simple way to handle this is to add the buttons in your own component, separate from the generated form. Though in that case you wouldn't be able to place them in between other automatically generated form controls.

If you'll post a schema and layout, with the buttons you want, and a description of what you'd like each button to do, then I can tell you if there's a way to make the buttons do what you want.

[ram-reddy]

Hey @dschnelldavis Thanks for your comment!

I just created a scenario likely to my real-time need,

any suggestion is appreciated. (I'm not willing to move my buttons outside of the form) ` { "schema": { "type": "object", "properties": { "name": { "notitle": true, "placeholder": "Full Name", "type": "string", "fieldHtmlClass": "error-red", "validationMessage": "Required", "feedbackOnRender": true }, "addressLine1": { "notitle": true, "fieldHtmlClass": "error-red", "placeholder": "Address Line 1", "type": "string", "validationMessage": "Required", "feedbackOnRender": true },

		"city": {
			"notitle": true,
			"fieldHtmlClass": "error-red",
			"placeholder": "City",
			"type": "string",
			"validationMessage": "Required",
			"feedbackOnRender": true
		},
		"zip": {
			"notitle": true,
			"fieldHtmlClass": "error-red",
			"placeholder": "Zip/Postal Code",
			"type": "string",
			"pattern": "^[0-9]{5}(-[0-9]{4})?$",
			"patternValidation": "Please enter valid zip code.",
			"validationMessage": "Required",
			"feedbackOnRender": true
		}
	},
	"required": [
		"name",
		"city",
		"zip"
	]
},
"form": [{
		"type": "section",
		"htmlClass": "col-xs-12 no-padding address-component",
		"items": [{
				"type": "div",
				"htmlClass": "col-xs-12 col-sm-4 col-md-3",
				"items": [
					"name"
				]
			},
			{
				"type": "div",
				"htmlClass": "col-xs-12 col-sm-4 col-md-3",
				"items": [
					"addressLine1"
				]
			},

			{
				"type": "div",
				"htmlClass": "col-xs-12 col-sm-4 col-md-3",
				"items": [
					"city"
				]
			},

			{
				"type": "div",
				"htmlClass": "col-xs-12 col-sm-4 col-md-3",
				"items": [
					"zip"
				]
			}
		]
	},
	{
		"type": "div",
		"htmlClass": "col-xs-12 no-padding no-margin",
		"items": [{
			"type": "div",
			"htmlClass": "col-xs-6 no-margin",
			"items": [{
					"type": "submit",
					"style": "btn blue-button right no-margin",
					"title": "save Address",
					"onClick": "someExpression()"
				},
				{
					"type": "button",
					"style": "btn blue-button right no-margin",
					"title": "Verify Address",
					"onClick": "someOtherExpression()"
				}
			]
		}]

	}
],
"data": {},
"model": {}

} `

[ghost]

Hi, I do have the same requirement and like your library. I would be willing to spend some time to implement the validationMessage (as stated in json-schema-form standard). Could you direct me on how and where in the code you would add this feature ? It seems that jsf.formatErrors relies on the control.options.errorMessages, but it would need to scan the schema or layout in order to find the specific error messages and add them.

Thanks i advance

[stevechappell2000]

Same issue here - I want to have simple CRUD buttons for Add, Update, Delete, Search, etc... I need to be able to capture the events for each button to take appropriate actions...

anyone find a solution yet?

[sumit2201]

I found this library pretty useful, but I stuck on the same requirement to have multiple buttons. Is there any way so that I create them myself outside the form schema and upon clicking them forms gets submit and all the validation for the fields get applied?