UNPKG

@progress/kendo-ui

Version:

This package is part of the [Kendo UI for jQuery](http://www.telerik.com/kendo-ui) suite.

8 lines 16.1 kB
/* @license */ (function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`kendo.editable.min.js`),require(`kendo.button.min.js`),require(`kendo.otpinput.min.js`),require(`kendo.upload.min.js`),require(`kendo.smartpastebutton.min.js`)):typeof define==`function`&&define.amd?define([`exports`,`kendo.editable.min`,`kendo.button.min`,`kendo.otpinput.min`,`kendo.upload.min`,`kendo.smartpastebutton.min`],t):(e=typeof globalThis<`u`?globalThis:e||self,t((e.kendo=e.kendo||{},e.kendo._globals=e.kendo._globals||{},e.kendo._globals.Form={}),e.kendo._globals.Editable,e.kendo._globals.Button,e.kendo._globals.Otpinput,e.kendo._globals.Upload,e.kendo._globals.Smartpastebutton))})(this,function(e,t,n,r,i,a){Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});let o={id:`form`,name:`Form`,category:`web`,description:`The Form widget.`,depends:[`editable`,`button`],features:[{id:`form-smartpaste`,name:`SmartPaste`,description:`Support for SmartPaste`,depends:[`smartpastebutton`]},{id:`form-dropdowns`,name:`DropDowns`,description:`Support for DropDown editors`,depends:[`autocomplete`,`combobox`,`multiselect`,`dropdowntree`,`multicolumncombobox`]},{id:`form-datepickers`,name:`DatePickers`,description:`Support for DatePicker editors`,depends:[`dateinput`,`datepicker`,`datetimepicker`,`timepicker`]},{id:`form-inputs`,name:`Inputs`,description:`Support for Input editors`,depends:[`numerictextbox`,`maskedtextbox`,`switch`,`rating`,`slider`,`colorpicker`,`radiogroup`,`checkboxgroup`,`textbox`,`textarea`,`checkbox`,`otpinput`]},{id:`form-upload`,name:`Upload`,description:`Support for Upload editor`,depends:[`upload`]},{id:`form-editor`,name:`Editor`,description:`Support for Editor editor`,depends:[`editor`]}]};(function(e,t){var n=window.kendo,r=n.ui,i=`.kendoForm`,a=r.Widget,o=n.ui.SmartPasteButton,s=e.extend,c=n.htmlEncode,l=`validate`,u=`validateField`,d=`validateInput`,f=`change`,p=`click`+i,m=`submit`,h=`clear`,g=`max-width`,_=`set`,v=`equalSet`,y=`group`,b=`aria-describedby`,x=`data-stop`,S=`data-role`,C=`editable`,w=`form`,T=`.`,E=`[data-role='otpinput']`,D=`[data-role='radiogroup']`,O=`[data-role='checkboxgroup']`,k={form:`k-form`,horizontal:`k-form-horizontal`,vertical:``,field:`k-form-field`,fieldsContainer:`k-form-fields-container`,fieldWrap:`k-form-field-wrap`,fieldError:`k-form-field-error`,fieldHint:`k-form-hint`,fieldset:`k-form-fieldset`,layout:`k-form-layout`,legend:`k-form-legend`,label:`k-label k-form-label`,emptyLabel:`k-label-empty`,optional:`k-label-optional`,buttonsContainer:`k-form-buttons`,buttonsEnd:`k-buttons-end`,submit:`k-form-submit`,clear:`k-form-clear`,invalid:`k-invalid`,hidden:`k-hidden`},A={horizontal:`horizontal`,vertical:`vertical`};function j(e,t){let n=e.attr(`class`).split(` `).filter(function(e){return e.indexOf(t)!==0});return e.attr(`class`,n.join(` `).trim())}function M(e,t,n){(t||n)&&(typeof n==`number`&&(n+=`px`),typeof t==`number`&&(t+=`px`),e.css(`grid-gap`,n+` `+t))}function N(e,t){if(!e||e.length===0)return null;for(let n=0;n<e.length;n++){let r=e[n],i=r.minWidth||0,a=r.maxWidth||1/0;if(t>=i&&t<=a)return r.value}return null}var P=a.extend({init:function(r,i){var o=this;if(a.fn.init.call(o,r,i),o.options=n.deepExtend({},o.options,i),i&&i.formData&&(o.options.formData=i.formData),o._wrapper(),o._grids=[],o._responsiveGrids=[],o._colSpans=[],!e.isEmptyObject(o.options.grid)){let e=n.guid();o.element.children().eq(0).attr(n.attr(`id`),e),o.options.grid.gutter===t&&(o.options.grid.gutter={cols:32,rows:0}),o._saveGrid(e,o.options.grid)}o._setFields(),o._setModel(),o._renderContainers(),o.options.renderButtons&&o._renderButtons(),o._editable(),o._renderBoolLabels(),o._renderFieldsHints(),o._setEvents(),o._applyCssClasses(),o._applyGrids(),o._resizeHandler=n.onResize(n.throttle(function(){o.resize(!0)},300)),o.resize(!0)},events:[u,l,f,m,h],options:{name:`Form`,orientation:A.vertical,validatable:{validateOnBlur:!0,validationSummary:!1,errorTemplate:null},buttonsTemplate:null,messages:{smartPaste:`Smart Paste`,submit:`Submit`,clear:`Clear`,optional:`(Optional)`},smartPaste:null,layout:``,grid:{},clearButton:!0,formData:{},items:[],formatLabel:null,focusFirst:!1,renderButtons:!0,size:t},_applyGrids:function(){let t=this;if(!(!t._grids||!t._grids.length))for(let r=0;r<t._grids.length;r++){let i=t._grids[r],a=i.id,o=i.grid,s=e(`[${n.attr(`id`)}="${a}"]`),c=o.gutter,l=o.cols;c&&(typeof c==`number`||typeof o.gutter==`string`)&&s.css(`grid-gap`,o.gutter);let u=(c||{}).cols,d=(c||{}).rows;M(s,u,d),l&&typeof l==`number`&&s.addClass(`k-grid-cols-${l}`)}},_resizeResponsiveGrids:function(t){let r=this,i=t.width,a=r._responsiveGrids;if(!(!a||!a.length))for(let t=0;t<a.length;t++){let r=a[t],o=r.grid.cols,s=r.grid.gutter,c=typeof o==`number`?o:N(o,i),l=e(`[${n.attr(`id`)}="${r.id}"]`);Array.isArray(o)&&j(l,`k-grid-cols-`),c&&=(l.addClass(`k-grid-cols-${c}`),null);let u=typeof s.cols==`number`?s.cols:N(s.cols,i),d=typeof s.rows==`number`?s.rows:N(s.rows,i);l.css(`grid-gap`,``),(u||d)&&M(l,u||0,d||0)}},_resizeResponsiveColSpans:function(t){let r=this,i=t.width,a=r._colSpans;if(!(!a||!a.length))for(let t=0;t<a.length;t++){let r=a[t],o=e(`[${n.attr(`id`)}="${r.id}"]`),s=N(r.colSpans,i);j(o,`k-col-span-`),s&&o.addClass(`k-col-span-${s}`)}},_saveGrid:function(t,n){if(!n||e.isEmptyObject(n))return;let r=this;r._grids.push({id:t,grid:n});let i=n.cols||{},a=n.gutter||{},o={};Array.isArray(i)&&(o.cols=i),o.gutter={},typeof a==`string`||typeof a==`number`?o.gutter={cols:a,rows:a}:o.gutter={cols:a.cols,rows:a.rows},e.isEmptyObject(o)||r._responsiveGrids.push({id:t,grid:o})},_saveColSpans:function(e,t){!t||!Array.isArray(t)||this._colSpans.push({id:e,colSpans:t})},_resize:function(e){this._resizeResponsiveGrids(e),this._resizeResponsiveColSpans(e)},_noLabelfieldTemplate:({styles:e,colSpan:t,hidden:n,field:r})=>`<div class='${c(e.field)}${t?` k-col-span-${c(t)}`:``}${n?` ${c(e.hidden)}`:``}'><span class='${c(e.label)} ${c(e.emptyLabel)}'></span><div class='k-form-field-wrap' data-container-for='${c(r)}'></div></div>`,_fieldTemplate:({styles:e,colSpan:t,hidden:r,field:i,label:a,id:o,optional:s,fieldId:l})=>`<div ${l?n.attr(`id`)+`=`+l:``} class='${c(e.field)}${t?` k-col-span-${c(t)}`:``}${r?` ${c(e.hidden)}`:``}'>`+(a&&!r?`<label class='${c(e.label)}' for='${c(o)}' id='${c(o)}-form-label'>`+(a.encoded!==void 0&&a.encoded===!1?a.text||a:c(a.text||a))+(a.optional?`<span class='${c(e.optional)}'>${c(s)}</span>`:``)+`</label>`:``)+`<div class='k-form-field-wrap' data-container-for='${c(i)}'></div></div>`,_boolLabelTemplate:({styles:e,colSpan:t,hidden:n,field:r,label:i,id:a,optional:o})=>`<label class='k-checkbox-label' for='${c(a)}' id='${c(a)}-form-label'>`+(i.encoded!==void 0&&i.encoded===!1?i.text||i:c(i.text||i))+(i.optional?`<span class='${c(e.optional)}'>${c(o)}</span>`:``)+`</label>`,_groupTemplate:({styles:e,colSpan:t,label:n,id:r})=>`<fieldset class='${c(e.fieldset)}${t?` k-col-span-${c(t)}`:``}'><legend class='${c(e.legend)}'>${c(n.text||n)}</legend></fieldset>`,_errorTemplate:({field:e,message:t})=>`<span class='k-form-error' id='${e}-form-error'><div>${t}</div></span>`,_hintTemplate:({id:e,message:t})=>`<div class='k-form-hint' id='${e}-form-hint'><span>${t}</span></div>`,_wrapper:function(){var e=this,t=e.options,n=P.styles,r=t.width,i=t.height;e.wrapper=e.element.addClass(n.form).addClass(n[t.orientation]),i&&e.wrapper.height(i),r&&e.wrapper.css(g,r),e.layoutWrapper=e._setupLayoutContainer(e.wrapper,{grid:t.grid,layout:t.layout})},_flattenFields:function(e){for(var t=[].concat(e),n=t.shift(),r=[],i=[].push;n;)n.items?i.apply(t,n.items):i.call(r,n),n=t.shift();return r},_defaultLabel:function(e){var t=this.options.formatLabel;if(e.length)return n.isFunction(t)?t(e):e.split(/(.*[a-z])(?=[A-Z])/).join(` `).trim()+`:`},_formatLabel:function(n,r){var i=this;return(e.isPlainObject(r)?r.text:r)===t?i._defaultLabel(n):r},_defaultFields:function(){var e=this.options,t=Object.keys(e.formData||{}),n=e.items||{},r=[],i;if(n.length)return n;for(var a=0;a<t.length;a+=1)i=t[a],r.push({field:i,id:i});return r},_setFields:function(){var e=this,t=e._flattenFields(e._defaultFields()),i=e.options.formData||{},a,o,c,l,u;for(var d in e._fields=[],t)a=t[d],o=i[a.field],c=typeof a.editor==`string`?a.editor:n.type(o&&(n.parseDate(o.toString())||o)),a.editor==`Upload`&&(c=`file`),l=n.isFunction(a.editor)?a.editor:r.Editable.fn.options.editors[c]?``:a.editor,e._isHidden(a.editor)||(a.label?u={"aria-labelledby":a.id||a.field+`-form-label`}:(!a.attributes||!a.attributes[`aria-label`])&&(u={"aria-label":a.name||a.field})),a=s(!0,{label:a.label||a.name||a.field,optionalText:e.options.messages.optional},a,{id:a.id||a.field,name:a.name||a.field,type:c,editor:l,attributes:u,isHidden:e._isHidden(a.editor)||e._isAntiForgeryToken(a.name||a.field)}),e._fields[d]=a},_setModel:function(){var e=this,t=e.options,r=t.formData||{};if(t.formData instanceof n.data.ObservableObject){e._model=r;return}e._model=new(n.data.Model.define({fields:e._fields}))(r)},_editable:function(){var e=this,t=e.options,n=e.options.validatable;e._addEditableMvvmAttributes(),e.editable=e.wrapper.kendoEditable({model:e._model,fields:e._fields||[],validateOnBlur:n.validateOnBlur,validationSummary:n.validationSummary,errorTemplate:n.errorTemplate||e._errorTemplate,clearContainer:!1,skipFocus:!t.focusFirst,target:e,size:t.size}).getKendoEditable(),e.validator=e.editable.validatable,e._removeEditableMvvmAttributes()},_addEditableMvvmAttributes:function(){this.wrapper.attr(S,C)},_removeEditableMvvmAttributes:function(){this.wrapper.attr(x,!0).attr(S,w)},_getItemTemplate:function(e){var t=this;return e===y?t._groupTemplate:t._fieldTemplate},_isHidden:function(e){return typeof e==`string`&&e===`hidden`},_isAntiForgeryToken:function(e){return e===r.Editable.antiForgeryTokenName},_renderField:function(e){var t=this,r=P.styles,i=t.options.orientation===A.horizontal,a=t._model.fields&&t._model.fields[e.field]&&t._model.fields[e.field].type,o=a&&a===`boolean`,s=o&&i&&!e.editor?t._noLabelfieldTemplate:t._fieldTemplate,c;let l=n.guid();return t._saveColSpans(l,e.colSpan),c=n.template(s)({styles:r,id:e.id||e.field||``,fieldId:l,field:e.field||``,label:o&&!e.editor?null:t._formatLabel(e.field,e.label),colSpan:typeof e.colSpan==`number`?e.colSpan:``,optional:t.options.messages.optional,hidden:t._isHidden(e.editor)||t._isAntiForgeryToken(e.field)}),c},_toggleFieldErrorState:function(e,t){var n=e.closest(T+k.field);n.length&&n.toggleClass(k.fieldError,t)},_renderBoolLabels:function(){for(var e=this,t=P.styles,r=e._fields,i,a,o=0;o<r.length;o+=1)i=r[o],a=e.wrapper.find(`[name='`+i.name+`']:not([type='hidden'])`),!(!a||!i.label||i.isHidden||i.type!==`boolean`||i.editor)&&a.parent().after(n.template(e._boolLabelTemplate)({styles:t,id:i.id||i.field||``,optional:e.options.messages.optional,label:e._formatLabel(i.field,i.label)}))},_renderFieldsHints:function(){for(var t=this,r=t._fields,i,a,o,s,c,l=0;l<r.length;l+=1)i=r[l],o=t.wrapper.find(`[name='${i.name}'],[id='${i.name}']`),!(!o||!i.hint||i.isHidden)&&(c=e(n.template(t._hintTemplate)({message:i.hint||``,id:i.id})),t._associateHintContainer(o,c.attr(`id`)),a=n.widgetInstance(o),a&&(s=a.element.next(`label[for='`+a.element.attr(`id`)+`']`),o=s.length?s:a.wrapper),t.validator._errorsByName(i.name).length&&(c.toggleClass(k.hidden),n.removeAttribute(o,b,c.attr(`id`))),c.insertAfter(o))},_associateHintContainer:function(e,t){var r=n.getWidgetFocusableElement(e);!r||!t||n.toggleAttribute(r,b,t)},_toggleHint:function(e,t){var n=this,r=e.closest(T+k.field),i;r.length&&(i=r.find(T+k.fieldHint),i.length&&(i.toggleClass(k.hidden,t),n._associateHintContainer(e,i.attr(`id`))))},_renderGroup:function(t){var r=this,i=t.type,a,o,s=o=e(n.template(r._getItemTemplate(i))({styles:k,label:t.label||``,colSpan:t.colSpan}));s=r._setupLayoutContainer(o,{grid:t.grid,layout:t.layout,id:t.id})||o;for(var c=0;c<t.items.length;c+=1)a=t.items[c],s.append(r._renderField(a));return o},_renderContainers:function(){for(var e=this,r=e._defaultFields(),i=e.options.layout===`grid`?e.layoutWrapper:e.wrapper,a,o,c,l=0;l<r.length;l+=1){if(a=r[l],o=a.type,o===y){if(a.grid){let r=n.guid();a.grid&&a.grid.gutter===t&&(a.grid=s(!0,{},{gutter:{cols:16,rows:0}},a.grid)),e._saveGrid(r,a.grid),e._saveColSpans(r,a.colSpan),a.id=r}c=e._renderGroup(a)}else c=e._renderField(a);i.append(c)}},_buttonsTemplate:function(){var t=this.options,r=t.messages,i=P.styles,a,o,s;return t.buttonsTemplate===null?(o=e(`<button class='`+i.submit+`'>`+c(r.submit)+`</button>`).kendoButton({type:`submit`,themeColor:`primary`,size:t.size}),a=o,t.clearButton&&(s=e(`<button class='`+i.clear+`'>`+c(r.clear)+`</button>`).kendoButton({size:t.size}),a=o.add(s))):a=n.template(t.buttonsTemplate)({styles:i,messages:r}),a},_renderButtons:function(){var r=this,i=r.wrapper,a=r.options,o=a.messages,s=P.styles,c=a.orientation===A.horizontal,l=i.find(T+s.buttonsContainer),u;if(l.length||(l=e(`<div />`).addClass(s.buttonsContainer).addClass(c?s.buttonsEnd:``)),u=r._buttonsTemplate(),l.append(u),r.options.smartPaste||r.options.smartPaste&&a.smartPaste===t){let t=e(` <button role='button' title='Smart Paste' id='${n.guid()}'> ${o.smartPaste} </button>`);l.append(t),r._initSmartPasteButton(e(t)[0])}r.element.append(l)},_initSmartPasteButton:function(e){let t=this;t._smartPasteButton=new o(e,s({},t.options.smartPaste))},_setupLayoutContainer:function(t,r){var i=r.layout,a=r.grid,o=[],s=r.id,c;return typeof i==`string`&&i!==``&&(c=e(`<div></div>`).appendTo(t).addClass(k.layout),o.push(`k-d-`+i)),i===`grid`&&typeof a==`object`&&(typeof a.cols==`number`?o.push(`k-grid-cols-`+a.cols):typeof a.cols==`string`&&c.css(`grid-template-columns`,a.cols),c.attr(n.attr(`id`),s)),c&&c.addClass(o.join(` `).trim()),c},_setEvents:function(){var e=this;e.validator.bind(d,e._validateField.bind(e)).bind(l,e._validate.bind(e)),e.wrapper.on(m+i,e._submit.bind(e)).on(h+i,e._clear.bind(e)).on(p+i,T+k.clear,e._clear.bind(e)),e._changeHandler||=e._change.bind(e),e._model.bind(f,e._changeHandler)},_validateField:function(e){var t=this,n={model:t._model.toJSON(),valid:e.valid,field:e.field,error:e.error,input:e.input};t._toggleFieldErrorState(n.input,!n.valid),t._toggleHint(n.input,!n.valid),t.trigger(u,n)&&e.preventDefault()},_validate:function(e){var t=this,n={model:t._model.toJSON(),valid:e.valid,errors:e.errors};t.trigger(l,n)},_change:function(e){var t=this,n=e.field,r={field:n,value:t._model[n]};t.trigger(f,r)},_submit:function(e){var t=this,n=t._model.toJSON();t.trigger(m,{model:n})&&e.preventDefault()},_clear:function(e){var t=this;e.preventDefault(),t.clear(),t.trigger(h)},validate:function(){var e=this.validator;if(e)return e.validate()},clear:function(){var e=this,t=e._fields,r=e._model,i=e.editable,a=e.validator.options.validateOnBlur;e.validator.reset(),a&&r.unbind(_).unbind(v);for(var o=0;o<t.length;o+=1){var s=t[o].field,c=e.wrapper.find(`[name='`+s+`']`),l=n.widgetInstance(c),u=c.is(`input[type=hidden]`);(!c.is(O)&&!c.is(D)&&!u||c.is(E))&&c.val(``),!l&&c.is(E)&&(l=n.widgetInstance(c)),!l&&c.hasClass(`k-hidden`)&&(l=n.widgetInstance(c.closest(`.k-signature`))),l&&(n.ui.Upload&&l instanceof n.ui.Upload?l.clearAllFiles():(n.ui.OtpInput&&l instanceof n.ui.OtpInput&&l._emptyValues(),l.value(null))),e._toggleHint(c,!1),typeof r[s]==`boolean`?(c.val(`false`),r.set(s,!1)):u||r.set(s,null)}e.wrapper.find(T+k.fieldError).removeClass(k.fieldError),a&&r.bind(_,i._validateProxy).bind(v,i._validateProxy)},setOptions:function(e){var t=this;t.destroy(),t.wrapper.removeClass(k.horizontal).removeAttr(x).empty(),t.init(t.element,e)},destroy:function(){var e=this;e.wrapper.off(i),e._model&&(e._model.unbind(f,e._changeHandler),e._changeHandler=null),a.fn.destroy.call(e.editable),a.fn.destroy.call(e),e.editable&&=(e.editable.destroy(),null)}});n.cssProperties.registerPrefix(`Form`,`k-form-`),r.plugin(P),s(!0,P,{styles:k})})(window.kendo.jQuery);var s=kendo;e.__meta__=o,e.default=s}); //# sourceMappingURL=kendo.form.min.js.map