Skip to content

Maker

[Deprecated] maker is still available but is not recommended for use in new forms.

Hidden

maker.hidden

  • Parameters: {string} field, {string|number} value

  • Usage:

js
  maker.hidden('field3','value')

Generates a hidden component

Input

maker.input

  • Parameters: {string} field, {string} title, {string} value, {object} props

  • Usage:

js
  maker.input('field','title','value',{disabled:true})

Generates an input component; type defaults to text

maker.text

  • Parameters: {string} field, {string} title, {string} value, {object} props

  • Usage:

js
  maker.text('field','title','value',{disabled:true})

Generates an input component; type is text

maker.url

  • Parameters: {string} field, {string} title, {string} value, {object} props

  • Usage:

js
  maker.url('field','title','value',{disabled:true})

Generates an input component; type is url

maker.idate

  • Parameters: {string} field, {string} title, {string} value, {object} props

  • Usage:

js
  maker.idate('field','title','value',{disabled:true})

Generates an input component; type is date

maker.password

  • Parameters: {string} field, {string} title, {string} value, {object} props

  • Usage:

js
  maker.password('field','title','value',{disabled:true})

Generates an input component; type is password

InputNumber

maker.inputNumber

  • Parameters: {string} field, {string} title, {number} value, {object} props

  • Usage:

js
  maker.inputNumber('field','title','value',{disabled:true})

Generates an inputNumber component; maker.number is an alias for this method

AutoComplete

maker.autoComplete

  • Parameters: {string} field, {string} title, {string} value, {object} props

  • Usage:

js
  maker.autoComplete('field','title','xaboy',{data:['xaboy','github','xian']})

Generates an autoComplete component; maker.auto is an alias for this method

Radio

maker.radio

  • Parameters: {string} field, {string} title, {string|number} value, {object} props

  • Usage:

js
  maker.radio('field','title',1)
      .options([{value:1,label:'Easy to Use'},{value:2,label:'Not Easy to Use',disabled:true}])

Generates a radio component

Checkbox

maker.checkbox

  • Parameters: {string} field, {string} title, {array} value, {object} props

  • Usage:

js
  maker.checkbox('field','title',[1,2])
      .options([{value:1,label:'Efficient'},{value:2,label:'Simple'}])

Generates a checkbox component

Select

maker.select

  • Parameters: {string} field, {string} title, {string|number|array} value, {object} props

  • Usage:

js
  maker.select('field','title',1)
      .options([{value:1,label:'Efficient'},{value:2,label:'Simple'}])

Generates a select component; props.multiple defaults to false

maker.selectOne

  • Parameters: {string} field, {string} title, {string|number} value, {object} props

  • Usage:

js
  maker.selectOne('field','title',1)
      .options([{value:1,label:'Efficient'},{value:2,label:'Simple'}])

Generates a select component; props.multiple is false, creating a single-select dropdown

maker.selectMultiple

  • Parameters: {string} field, {string} title, {array} value, {object} props

  • Usage:

js
  maker.selectMultiple('field','title',[1,2])
      .options([{value:1,label:'Efficient'},{value:2,label:'Simple'}])

Generates a select component; props.multiple is true, creating a multi-select dropdown

Switch

maker.switch

  • Parameters: {string} field, {string} title, {string|number} value, {object} props

  • Usage:

js
  maker.switch('field','title',1,{trueValue:1,falseValue:0})

Generates a switch component

Cascader

maker.cascader

  • Parameters: {string} field, {string} title, {array} value, {object} props

  • Usage:

js
  maker.cascader('field','title',[],{data:[]})

Generates a cascader component

DatePicker

maker.datePicker

  • Parameters: {string} field, {string} title, {array|string|date} value, {object} props

  • Usage:

js
  maker.datePicker('field','title','2018-12-16')

Generates a datePicker component; type defaults to date

maker.date

  • Parameters: {string} field, {string} title, {date|string} value, {object} props

  • Usage:

js
  maker.date('field','title','2018-12-16')

Generates a datePicker component; type is date, allows you to select a date

maker.dateRange

  • Parameters: {string} field, {string} title, {array} value, {object} props

  • Usage:

js
  maker.dateRange('field','title',['2018-11-30','2018-12-16'])

Generates a datePicker component; type is dateRange, allows you to select a date range

maker.dateTime

  • Parameters: {string} field, {string} title, {date|string} value, {object} props

  • Usage:

js
  maker.dateTime('field','title','2018-12-16 23:23:23')

Generates a datePicker component; type is dateTime, allows you to select date and time

maker.dateTimeRange

  • Parameters: {string} field, {string} title, {array} value, {object} props

  • Usage:

js
  maker.dateTimeRange('field','title',['2018-11-30 23:23:23','2018-12-16 23:23:23'])

Generates a datePicker component; type is dateTimeRange, allows you to select a date and time range

maker.year

  • Parameters: {string} field, {string} title, {string} value, {object} props

  • Usage:

js
  maker.year('field','title','2018-12-16')

Generates a datePicker component; type is year, allows you to select a year

maker.month

  • Parameters: {string} field, {string} title, {string} value, {object} props

  • Usage:

js
  maker.dateRange('field','title','2018-12-16')

Generates a datePicker component; type is month, allows you to select a month

TimePicker

maker.timePicker

  • Parameters: {string} field, {string} title, {array|string|date} value, {object} props

  • Usage:

js
  maker.timePicker('field','title','23:23:23')

Generates a timePicker component; type defaults to time

maker.time

  • Parameters: {string} field, {string} title, {string|date} value, {object} props

  • Usage:

js
  maker.timePicker('field','title','23:23:23')

Generates a timePicker component; type is time, allows you to select a time

maker.timeRang

  • Parameters: {string} field, {string} title, {array} value, {object} props

  • Usage:

js
  maker.timePicker('field','title',['23:23:23','23:59:59'])

Generates a timePicker component; type defaults to time, allows you to select a time range

ColorPicker

maker.colorPicker

  • Parameters: {string} field, {string} title, {string} value, {object} props

  • Usage:

js
  maker.colorPicker('field','title','#FF7271')

Generates a colorPicker component; maker.color is an alias for this method

Upload

maker.upload

  • Parameters: {string} field, {string} title, {string|array} value, {object} props

  • Usage:

js
  maker.upload('field','title','image1.png',{action:'upload.php',maxLength:1})

Generates an upload component; type defaults to field

maker.uploadImage

  • Parameters: {string} field, {string} title, {array} value, {object} props

  • Usage:

js
  maker.uploadImage('field','title',['image1.png'.'image2.png'],{action:'upload.php'})

Generates an upload component; type is image; maker.image is an alias for this method

maker.uploadFile

  • Parameters: {string} field, {string} title, {array} value, {object} props

  • Usage:

js
  maker.uploadFile('field','title',['image1.png'.'image2.png'],{action:'upload.php'})

Generates an upload component; type is file; maker.file is an alias for this method

maker.uploadImageOne

  • Parameters: {string} field, {string} title, {string|array} value, {object} props

  • Usage:

js
  maker.uploadImageOne('field','title','image1.png',{action:'upload.php'})

Generates an upload component; type is image and maxLength is 1, allowing only one image upload

maker.imageOne is an alias for this method

maker.uploadFileOne

  • Parameters: {string} field, {string} title, {string} value, {object} props

  • Usage:

js
  maker.uploadFileOne('field','title','image1.png',{action:'upload.php'})

Generates an upload component; type is file and maxLength is 1, allowing only one file upload

maker.fileOne is an alias for this method

Rate

maker.rate

  • Parameters: {string} field, {string} title, {number} value, {object} props

  • Usage:

js
  maker.rate('field','title',10)

Generates a rate component

Slider

maker.slider

  • Parameters: {string} field, {string} title, {number} value, {object} props

  • Usage:

js
  maker.slider('field','title',10)

Generates a slider component; props.range defaults to false

maker.sliderRange

  • Parameters: {string} field, {string} title, {array} value, {object} props

  • Usage:

js
  maker.sliderRange('field','title',[10,100])

Generates a slider component; props.range is true, allowing you to select a range

Tree

maker.tree

  • Parameters: {string} field, {string} title, {array} value, {object} props

  • Usage:

js
  maker.tree('field','title',[12,13],{data:[]})

Generates a tree component

  • Related Methods:

  • maker.treeSelected

    • maker.treechecked

Frame

maker.frame

  • Parameters: {string} field, {string} title, {array|string} value, {object} props

  • Usage:

js
  maker.frame('field','title',10)

Generates a frame component

  • Related Methods:
    • maker.frameInputs
    • maker.frameInputOne
    • maker.frameFiles
    • maker.frameFileOne
    • maker.frameImages
    • maker.frameImageOne

Group

maker.group

  • Parameters: {string} field, {string} title, {array|string} value, {object} props

  • Usage:

js
  maker.group('field','title',[]).props({
    rules:[maker.input('field1','field1')]
  })

Generates an array component

Object

maker.object

  • Parameters: {string} field, {string} title, {array|string} value, {object} props

  • Usage:

js
  maker.group('field','title',{}).props({
    rules:[maker.input('field1','field1')]
  })

Generates an object component

FormCreate is an open-source project released under the MIT License. Free for personal and commercial use.