Swagger-ui: Multiline (aka textarea) support for formData fields (not body)

Created on 3 Dec 2015  路  7Comments  路  Source: swagger-api/swagger-ui

Starting from here: http://petstore.swagger.io/#!/pet/updatePetWithForm
Consider that my pet needs a description also. But it is not only "My dog is brown". I need to be able to enter an entire story in there (my dog's life, what it plays with, what it eats, etc.)
Using a HTTP POST request to the web-service will work fine, but in swagger-ui we don't have this ability. And please don't suggest to use array. It should work like http does.
Thank you.

feature

Most helpful comment

I'm not saying to force textarea for all formData.
I'm no javascript developer but I can understand it a bit.
This feature request is linked to a lot of stuff starting from swagger specs. As a concept would be a good idea to have a "multiLine" property to specify that the consumer of the api can (or not) send multi line content.
Then we continue with swagger-ui. Here i saw that if a field is rendered as textarea it will be treated as raw body for the request (and all other dataFields are discarded). I tried changing (in firebug) an input field to a textarea. Not a pretty implementation in swagger-ui to rely on the rendered form element to decide if it is a raw body or a form field :)

I know this feature request needs a lot of changing but I think that my suggestion to have a multiLine attribute for parameters in swagger and swagger-ui would have a great benefit.

Example (as yaml)

      parameters:
        - name: fieldName
          description: Description here
          in: formData
          type: string
          required: true
          multiLine: true # this would be false by default

All 7 comments

I suggest that you send a PR then, that allows "enter key" to change the text box to a text area. Most uses of formData do _not_ use multi-line, so forcing that as the default behavior on all formData boxes would be obnoxious.

I'm not saying to force textarea for all formData.
I'm no javascript developer but I can understand it a bit.
This feature request is linked to a lot of stuff starting from swagger specs. As a concept would be a good idea to have a "multiLine" property to specify that the consumer of the api can (or not) send multi line content.
Then we continue with swagger-ui. Here i saw that if a field is rendered as textarea it will be treated as raw body for the request (and all other dataFields are discarded). I tried changing (in firebug) an input field to a textarea. Not a pretty implementation in swagger-ui to rely on the rendered form element to decide if it is a raw body or a form field :)

I know this feature request needs a lot of changing but I think that my suggestion to have a multiLine attribute for parameters in swagger and swagger-ui would have a great benefit.

Example (as yaml)

      parameters:
        - name: fieldName
          description: Description here
          in: formData
          type: string
          required: true
          multiLine: true # this would be false by default

+1

+1

I was looking for the exact same feature.

I have submitted a PR #1986 to support this. The solution is that @fehguy has mentioned.

Crazy idea here: the keyword "format" is not really used with the keyword "type" when "type" is "string". There aren't any formats for string in the swagger definitions from what I can tell. Why not allow for "format: text" when the "type" is "string" so that a textarea is shown in this case.

Example: In the example below a "textarea" is shown instead of an "input"

{
  name: 'query',
  in: 'query',
  description: 'Query by example. Pass a JSON object to find a context. For example: {"seller": "xyz", "name": "Scope 3"}.',
  type: 'string',
  format: 'text',
  required: false,
  schema: swagger.paths["/rules"].post.parameters[0].schema
  default: ''
}

Could be accomplished like so in swagger-ui.js: in "Handlebars.registerHelper('renderTextParam' ... in the handler registered:

   if (param.format == 'text')
     result = '<textarea style="min-height:200px;height:90%;min-width:90px;width:98%" class=\'' + parameterClass + '\' minlength=\'' + (param.required ? 1 : 0) + '\'';
   else
     result = '<input class=\'' + parameterClass + '\' minlength=\'' + (param.required ? 1 : 0) + '\'';

image

See #1578.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

fehguy picture fehguy  路  3Comments

ilnurshax picture ilnurshax  路  3Comments

shockey picture shockey  路  3Comments

Deraen picture Deraen  路  4Comments

andrecarlucci picture andrecarlucci  路  3Comments