Submitting a form in Circuit SDK

Question

I'm sending a form by bot to conversation using Circuit SDK. That contains a couple of buttons:

client.addTextItem(item.convId, {
            content: 'Form test',
            form: {
              id: 'form123',
              title: 'Form test',
              controls: [{
                type: 'BUTTON',
                name: 'fruit',
                options: [{
                  text: 'Apple',
                  value: '1'
                }, {
                  text: 'Banana asd asd asd asdsa das asd',
                  value: '2'
                }, {
                  text: "Strawberry",
                  value: '3'
                }]
              }]
        }});

And I subscribed to formSubmission event to receive user's choice:

client.addEventListener('formSubmission', function (event) {
            var formData = event.form;
            console.log(event);
            console.log(formData);
        });

When I click on one of buttons in conversation with bot the event is handled as I want:

{ type: 'formSubmission',
  itemId: '44469462-6d79-49ac-8439-3a1a57a9d6d2',
  form: { id: 'form123', data: [ [Object] ] },
  submitterId: '81cb8c4d-2706-4c03-8d82-20081b9399e4' }
{ id: 'form123', data: [ { name: 'fruit', value: '1' } ] }

But there are a "An error occured submitting the form." notification in top of Circuit UI. Why user got this message?

Answer 1

This is a bug. We are looking into it. As a workaround you may overwrite the error by defining your own notification after the user clicks the button like this:

client.addTextItem(item.convId, {
        content: 'Form test',
        form: {
          id: 'form123',
          title: 'Form test',
          controls: [{
            type: 'BUTTON',
            name: 'fruit',
            options: [{
              text: 'Apple',
              value: '1',
              notification: "Form submitted"
            }, {
              text: 'Banana asd asd asd asdsa das asd',
              value: '2',
              notification: "Form submitted"
            }, {
              text: "Strawberry",
              value: '3',
              notification: "Form submitted"
            }]
          }]
    }});

Each button can have its own notification text.

I will update this stackoverflow question with an estimated date for a fix.