From 85ae2339acbca17e28932200565dbebab5d55e60 Mon Sep 17 00:00:00 2001 From: Sergiy Zhovnir Date: Mon, 19 Aug 2019 07:34:59 +0300 Subject: [PATCH 1/4] Added RowBuilder widget documentation --- _data/toc/javascript-developer-guide.yml | 3 + .../widget/row-builder-widget-result.png | Bin 0 -> 7021 bytes ...-builder-widget-warning-message-result.png | Bin 0 -> 13196 bytes .../widgets/jquery-widgets-about.md | 2 + .../widgets/widget-row-builder.md | 267 ++++++++++++++++++ .../widgets/widget-row-builder.md | 1 + 6 files changed, 273 insertions(+) create mode 100644 common/images/widget/row-builder-widget-result.png create mode 100644 common/images/widget/row-builder-widget-warning-message-result.png create mode 100644 guides/v2.2/javascript-dev-guide/widgets/widget-row-builder.md create mode 120000 guides/v2.3/javascript-dev-guide/widgets/widget-row-builder.md diff --git a/_data/toc/javascript-developer-guide.yml b/_data/toc/javascript-developer-guide.yml index 656ab346458..403a694946a 100644 --- a/_data/toc/javascript-developer-guide.yml +++ b/_data/toc/javascript-developer-guide.yml @@ -97,6 +97,9 @@ pages: - label: RedirectUrl widget url: /javascript-dev-guide/widgets/widget_redirectUrl.html + - label: RowBuilder widget + url: /javascript-dev-guide/widgets/widget-row-builder.html + - label: Tabs widget url: /javascript-dev-guide/widgets/widget_tabs.html diff --git a/common/images/widget/row-builder-widget-result.png b/common/images/widget/row-builder-widget-result.png new file mode 100644 index 0000000000000000000000000000000000000000..bdf9a17dbf598e2602a2fec8092f4074d96a2b1c GIT binary patch literal 7021 zcmeI0XIK;4y2nv5q6SbwaHQA}P=R1ViGXlWV?==n7OE5_iS*tCLH7tKsGuOlP`03; zR5ziA01*KLBnU_iC6rJk2}lVYZrsnk&)NIjbDneVxBFqwhc&Zi*37I~YrX&X_n#+M zjnTrp4(<{V5D+%Fbiq_WU^_%WVCw~;ZTvIdmv{Q{cY=6*BYgpZ-=cS~*>C69w|JYP z&k5wyr6>87psR-0QJb5aNBl`&nKS3kofB{_YHn^G9UcAj=@XaBMIaEVsi`xw3x$P+ zt*xzIUS1s?9YaGyIXO8E4GnAS>%65Ei})rJ6B7pqhaomE`^#udOpK+aC82sStgvTt za+1=;E^D0tL9n8tLK~zo7!04xc6?e3o6WxTwBG;9s+oYm!5D)J`qu+`IsH+l!-iWQ znB+S>ey~SS5M?4hxVcl)Kw*nGdc9$Mwyp=ncP`go#qp)M(avMyzjX|6=L3DhE^_S6=VOV2Tf;v#zGg5YlB3 z%p3Vk?e*ESw2#A^V51KfGdAwkBsi#UBmqycdzR9nsq0taLSGI)fNuSl#o7qeFTROR z7t3LJ^}Nz&E@EdwR1f6Z=$(C%zDyUZRgC18hE`P{YCJqMhX{Dtsr-690$Qc@H^{?7 zNfiBf%Ge4F-ks7yf(xy6LyZfe7qdcNP%OlS`S1S#u<_m$MavBoq=A2#38kmMPs)qJ zXp~RQ$AdhJf<|WDa;_#x&vCkinI5ZK&Gykc61G0iWc_L`m*%IHL)@_InMzh^JBDdb z(7FW(K0g6Yd5SB;+G2zo72=nVo_Vd@1T7&fi;c9C0hj2Eb0xGwZk(P{;rX`HTH`}c zsJCxO_q@<&K87FYjhApW)oG2=n1z;LSTu-W+$BIKV1QA3Qj;e zTU2XpIiTFKgA50!*sW#WgO1!5=J$|z+6;Gkdi6;5+-ir1sr2g>rEzdAMk#K5e6BDC zE+mbDNZR|4rdRlUG|RWdqaZ{obLl9}zIwS{f_h(_VwLs68K(e9j;NBG;YdtE!&D_W z-g6_87H#dS2-av~J?`6BpNj2tPqx+SR?0tOZ7UA2ua67kr*R)`HPp0G-AeEP8)J9_ z7Ej>6jppKEdfol%sOsuvs#lhm#hOZq@v)5)V9#E%u{_~={yE6p^kiPPC-H~F9%MWe z=j+5XjXipeLo;^sq!<=7cUG+0K)OIqf82W+c$tdcU3svk75kCco`*886v?K=2A;O< zQ=4lcQhHLM8aa!8{Kr&4pZiy+3*i@W3?ju>{f)MBHG#r59QoDCvgxn~8<4&^KC9JJ zsoKxDoCUfMAs(sGx@c72ra_PeN9Q zM|aS7bSX%3s;XsYwo7oh)aY-nu(gE;1xX@)un_BQFqI1aWJ&@H3_a7(QTH9e9TiJE z!ausBpnsR1HMQCvm&Mh?{XI%N=PgyOw~=eBY&pqsqOt$H)97W>sG!*Uw(AoYT6^eX zpkl?08NW@S`1-=FUBd=(&ehW8@a%rH$@noqCqbX73K+^0H?=kA8BvN~AwpwmwXaSi5=w^6(g)$=1Vre0wS%IAokLu|{li zXiFnIw8X>1wwX!YBzw2{d^rU@MDZE>` zMOx)k$Ymlqmg2DIBKON-j~KpoX&9M0ejN@x_+jk{wzXjXNninhqUkR;^87Bt4!Vzp ztuMm6F%7_C+umC7!e+ah1D>!v&ufr}pi-ps$a@`4WK=r)vx4la|Pk=QK5#5ZHS@g}fZpCdJ7P0ml)tIY+-%o-`))Do; z!Vrlrq64|`?tW-DUtMc}WV0(h-)>J`PN2olaC6-Y$tZa6886c-jTchG=b}28gdXN3 z?iFX&ktu`&wFmD7X@VVcr=^@1?v19{r%T%2+zGG=!dn|+`H3SX_#~KeGK8GsUeBR1 zE1kytAT7!KiA|*hmYW4_3_myL3(AUPk#+}zKw;4<$}8;TBVXI^dd<&xNJB^vOLAy< zjH|qNfM(~qPaP8(IJzDLu+gncY+neTHP%R;f;`-YRTVaIzhNc!=0Xa0qJ|(I7&?29QpK(~M|79{*HRwFC^gTI^GS3Xu zT?z1$fFE$fi0OK_MccB!3IwO2st>u#7Iab-2DB~jAGM*PHiunW_T+p%wB_$nE5Nih zhhnybycime1+MEeOMPcz0iCnz#~>lG7&9ZjxCqAR3;aJS9>5BEXT+IiKnNV%Eh89W zwp|kU`48Xoe?6=T3Mcm59e=`gkytGj7`%I0I>f+lrM6@0#VG@2u8~C0KR6fZ_Ae;Ex#|6SSlNq85cW2{)1N8V%a0Tw7a2@ z2+t!l_KfaNbU+|irvbyJ{rwmoc4nQ$4?pxviap|B1o>$*)iDcU9kFeANcGmjKnrA@ zUHn!rF=f#o%G~=I*Z`d`q7xTQ zbecll@||jDF1zEs&rIeL_iiLpd=lH&^h0D%%jEuVg&O=P3N^)vi^hFSdye4JGHy4# z{j)Ze!ZrR!nBEb#dzsMp5`p1t0QYS31UUJAyg1nG9pDb{jxG%Iy?4E&=O|dCk0?`I z3^p6mFEu~eHS8pTe4Ne=ZDu+KE;A3y6@RgVMSeP3t_;?^L6kZ6={SXlC^w}=o#T)o z9`29~oa%dccT@fmrSytic;bcDO5X5!0g5U&fYjw}d$yK}b`Rg%S{k^m*2 zZ0Pe0+<{7|MoD;Cce1N><6#dblvh%<_G14BDdRC#fm$sX8;$eO5L&@PVmTDT4G4*_ zMVn6mNN~>S1i{kf*5pf^hxKZoi>l0-564;OR@9Phb0LGx5R7JyO9EyaT2-oVxszdw zo2gTUReMXqyEUbL@*Yu9YuO)2PS`z_0!=-mDI~1}&UqE^*6L(_tI_}+S>Xi;^Qd%O z;xF=d06~#hij8;}BfXy1Z*?@-6|!ogrW=$(u_zbyp03d6Yiu)@P?4?t@@l%V|NS;j zv$kz2#YL-I$2JcZPQ>}gQc%1kg^Va;IljKa1NN!hwg^*m&0k#o4y`Bb_9}swm4ETz zCvJPVxpQr$xNY7*0qzh7@Wr&ux2`&`RVC_KYq}kj+a8!$TaoL!G(vD z_~pE9=+W#O@AX13JE!ulRQoayAQD&NMdE?Vd#Nj&Z4ECdj8;WA>$63cq8aYZOl;He z0pv?)xb!nw%fWq_M?udkkcT6UcAWfb>SWYE;#z zT>1bux2-Th*BU27;xE#1_Vv-ZId9&RXp4zLd)b#Ul=0bTW(z510vnEy_V?Ji5;gq7 z#l-Ym5=KpPiI|;4;I`K_!{IhJUBf7|gV;5v8++1f=VvsYO-yv8BZItul$TBpO-iAo zQQ=l~dd%$PBlQWe%e!Vo;mFG)yyUZGCsyahWv%0#SyNsT$X&;;v@KgAuOMCb@9v+P zts&(dDrnrX$|pE6c#?<}<{V_Y(SUWn+`5{Vuyx}W1a|09TA{kTZZX4pAXp0L&60za z)94}+_p`f7=*P$Ek~?4CGszpTbe{CKKdzlUP^t+M>iZvIoWc%{=|vEqQMp0_w#gK) z(xWOji!jgnZhYy(CJ~JaWapp*VW@fBWsBxxSw}1<V_o^A2yGGU5p(z zEFd@+j^ul1DY&`IW1aX|;!UzR4isHQ1Q3^bw@#Y`)8mPCy#YmM>1jAnld)rf1yu5L z3j>iDH+UqlSmp-~Qi=op?afBCtU5HZg$LJ5uXZD(`p74*LLQ!XP_^nBlN^6$D#&DOE)l$9IDQU?aU zNfjUx?_02(;y%Br#+0@@j(ndr<#Q8G^%i}MNE-HoBqA#!W|bV)T15qsaH?&U$e-lm zzbi8&D4y6)F!sk2y9>52U5pxY?i!jQtZ+R zJ>!MFPKr*aqu~K6Kb1St5Vv{%k>bI{`pHny0lJ-LB$xKn=-6q0Utip-)w4`)SM!hR zAOAC7v;eun#f7VD`(SLW%3(qFMZxOLoqc>Ip&7z z0h`IXG`gKuv*U){>78J)KRnUsI6{V>*IrT#Ix`JUa;$VP$6o3ErnK@(_w=-SJAMc2 zR8Z+P?q-pq3ZmN`w|Zjo@lZD$Z1N(!<9h^siMnFX>#0)7C=)+}IjT-&8*OX3;`rkp zsAmV1Sf3zI8eit&Rb|vk`I-GsU;mH?*NZ}zBi^0o|10Q*s-zFMp46F;xWclurfuC} z@~vMRu;b@GM{`}>Zw9O(}9b| zP6p*My29gR?M^GMrQH)TTN|DC8 zNfh$_zBInK`8YsjCV7K36a*5s=+t5>$61GRt@c*Gq7-@6b^*C46NI6D>~FvOi-O9t zhJAhHM0p(@f4d!WqL@$sv;QJFV62sq@{t-nEeX)Ca(<9Y&M;d;!JV4<; zGB|D!G^4A=#a4}|2mToQB{>i3rUFl<9`;CtcJ_|I!Qv24u|$?rC?*n zLJvj6NC`ypW4s@3KCH}Do;lZS&-~5*v!2~B);oOg z)IlyTuEYAjUBAi2^$U!PYj@86-JC12CoHL)zdg=ZjIMBT6-6D|bohmHzRUBb-c_!G zHlZobNz)C(+wh&8opZjVj*bojfxzWf?0%i=qYu~CLieXnpA;1pnM|ftA|CbWgY&eBCC}gX&JERi zd3nt(tv@g67w{|}n_G2pae4jFG~kv%P~JBhjrN`Lt~%4-$jE48wsU2o>DgTwb93{$ zx;i^MyU55$!>ERM%;hfyVdGuJ^}Vy->QX~OLJ|`b-$Qnlm6hG)5yS*kV<_+~)3&Cj z=HthYMtN8_E-nQJ{p(k5`}WTa($F+r?uR3%>wYtPc=kvN{`mJ9BUP@7Yd&{h>=A^= zY;4PxcuKsBo!S%OGO;7$BMnKOpB+Aw|mzMIAQ-oAO_Cm7!7crhITw)%OkJ+YInULJC<3^`uGd^ zxlgR8n8Xz44bUFOr(_iL_i=&6tJX)3U~Rcxkmb}Gcm;9YXH%yq8s3G?Lmw@W-f|}qW^$9r2-{_(PIDLtXwMvEg`g<##>iXH#Qso>c8q(i6y{i0qCtkoD`UyEat`$Gx*3A6-eq z;QK^xixPXw@e+OlN$cd#-!8r3Lz>a_GB>;C{E({z7Uemhg@5*G@TIczj@eu~ku)5p z?TzV6rC`KE;ThTnwaue9N|~}3X8O^Z1=bWrJ>m40Td>u7d0x__8(}}71~KuTpO!x_ zo%y)o2NsV_7COmO9=oC}48?9|K7LSdKsz7ZU2@<_Ct3&@{C<{NGT-qnFXOh_y9Db& zbZP!9(R(nQVA=l*0WCc%Gs7y?f~z*k!c`mE;aP+EVr7LLeu3vdjm#Jg#_2SE)3RDE z2x)%Xh7R&Qp{HltH>~0$4mKi=@sekAPB=JRfjv6sEPt3cX#cIV6Na5laALxUlDeb3 zPE*Ft&bPy{o9uT>;PD91WMV|@wa48H)ysDY5}I0F)@$9+jl2uCUE!e80qXWE8;axo zyKfZjUnwo#9)AHXc&haOv9$X#DZ%T~C31XnP6@4qX3+7$JGi&FT-a2{|uT>8Q&f-@dhaj!0qXaA=NsNwIwM3iN=vdQW7n=& z?H^ke)eTfI@Kj)QeC(bXkTnmRjf|=^@r>I{6=9V#O-M(M(9S>~{~-G6G{34|vxyKL zZl`1z4X-qpz=b{DMiK;cGqr7!1-vk?^;Z!3f%i;^$^jRS(E^_R;&&>SsWhSK<4 ziyxtj15RL%Wr-j&pI*uwGmcc>l040Gfzm--^VKl?x+?(>S1Wi`-PD;MsjemoRl+h< zMWmbK$jc$%K%Y~N!uvKyQ>`R&kY<)C47-hSGs(XHzVqzj``cHaR-Qr@JtMh~mVABi zcogUtyl#pO?3y)&%?2g2Q6?NW5>0Np(_v>gV-a;yCKRZoPL2XTyiP?aY1d8EePhTY z{M)Ea1dOJtc{p)r=J=;CBH6Z?LP2HM?W3~b(@n>lM8`Qw!lHM=C^SJDNgrscfQTGE$_DvYY_jf_`yj=?-+Ukc2 zioa!mP|_%g@9vw7emVEG?Q8VNn&zy3`Ett8L#AnZ#TX&AN&;QMWze3Xo#Kd54-C8) zW89qK;~95oI6};8{57!t$a-v)YH|w`Ll!gsIJL#gPs|zZO0z7n>I$~V%DW(Q;s~y{ z$%mk&ldjP+KJ?5%nrQk~anfzSy)CExC|Z?}+v{&l5JoWXs5T|)3( z1>w6?^Oa*gqn@Bf_k(%uu)*U~RNM#=w}P@RAo(!dGjnRJEXc|_TGQX!H!_7dIDqp z5%7&sO}W0g=h@K4XQiz^pddHjx{7(86hkf{QGjVN+p9t~Wp%=ZEn8`eP2rg24Ox#y zWX@}_1Y1Fk5BPn}HmvYn4vm^=w~_efcVXYZZ9qc*KFd^^xRlACTEN6F1*x)k7XRuGJiLxOo`flzy)4t%6mMeI>fi$g~8_65) z27M$Da^@$HO#YqOoON*Sx1Fz{&%{3DamJt@XmetdkBco$@J+&#cZZzfs=WqlH*BkT zK~BaEp5W4C0BQIX&+|~&bDce0vf2<)VnVaSmY<8g494Z^MQ@(x@*M%Ia5k`$GTgpX zVBn8d;P}s+l_`mVGkyV{ciUoj)>hUsgXXpx+J}b>-Bz_yMRu^PWdy9%>FUmQ z`_Ldmq9A{lKxvAEXiS9ky$9E>J-S|ZnLo~HZYL|Ub&>b1TCAgjHBE!1dE&qbq!ewJ zkCaXF*m=;$v+A4$D0f$Gq!vhX6C3H6^8LLf50>LZ+zG{`Nb=gccTxNMr4}DdZP;9` zW_C|)GFg+Z*KA*@bL%!11XNrWtzeHpM@$*?)He5i7hS+~rqWkyS<6jS6bt|Cps48? z5a1-(;4)}gn@Fz26B!Ddfp~Jk=djr`886^>VED-y0TM9#N|tZJEJ502Dp^y^xb;Km zjQNWVI@-+lRN?RD*wu{THu`znhk4JX%x}RMPwDHF=TAAtGN2)TU{Z8eyfg?_$Y&Ft z``PHawvkkUPQu%At*TgZdOeeD`V;0$NpB9U}X-_>Ghn-$7W6z^zE3uZ*{zw|%{cajvQ^5V1!x<TI*{#9pUz ztEzy+ArdIWA3d12#c0CbMc7zLoQIZ`9!USpitWL_friQ6({`|lNew0qR-VL ze_3d7{=CRaD?wd!@jPU7JufkLOx^LPQR38BLu~wlN5Ig+Zm?xN%I|5tLVyYcO>uoS zf@NQebO!f~N0al^dBB!wTXhR|v58hdU@AF`bf!J~sZ^=a3I$lXn?`L|7LtMRfYb7M zG5T#;PR}pj*N8lH4sxgt-i3j2^+a(J8u%ZGGVM-zWb9*6qFCL-#kXHA!%@ zJvG++wMpa#y^BuYHP$@39r<3s!99+quw7sr{4xy5$JtUj{u_tC8~lg;zhlM882P^_ z@VjgqVtM~U{%!jfL?-lc^*!P)ndk2n{GX>pEmGTaN$x);Sf6wbEy%jQcU_ho@9N%O z{$ZLdT}m2{NX!?XyIB6ray^%8CnN0XI^$Ne=jWB>9~~D0A}w)eAzs4%7IA27Zu7~x z37H`ZLWGGb*}oY^NNSiXbN&IZN+r8?xDll-RukTFsj=>c2BgWqhXc7B+afyN|^ z>?mS#5HRP%SL9X_VI?H~+?KyEyT*BTbhO~9Dk{|3Za7UXP!94|aqdB~*OVdKXS}p) z*EyUDD0lS9`+$A(&oVU-)tYae7oVzLsy{`rzA^_Dzu(LUN^gmFW>s4nfqCN38L}6} zINQt$NBR36nYdyTl|)vsTdMRIGrEM>PAjl26e)}D4AF*YPhHvaoDm;Se&?4hbu%X| zv~UAa?Y)=T3g|}XH2`RFbI>{dOBRs8*RXA-2kvo7AbVbqw@)oNKxrt;Mv1QrcGu4) zVTrwXf^Yb>Q)zlBUjSvk#BDPZPM-h}4X={z^`x0f{>V^-uT%hOD*9TEMODIf;b2Sl zBmO`0qn0noH$^f*h zQapu*4zYHKy-|L~qCKAF0Gg20o&EIbt!j>^Q+`=#XBf3=wAR#vV^2_!)qz{X8~H2$ zhn>cE+{~b<3B8&7Bj$$4o)2OtE}!N5y62dvW^)Kgl-<~>?V9!K=YC$`T-`8RS!<6* z-0b^D{LV$VJqvG_bdt#LWVr2fpWjk+`mdeL_He=8x>0hs zbM?sRoyo!@U6zGr_X@PL!&}XJ?1kCK2uaC7POtz*a;^4_c0fC8DzFz{Y!$n7j98Ag zWixg!w;-x|5}j-}!*84bQ_39qa>4jBL%0L9#jdmuwEX9jk2Xw zcnhl2;M}+{fR#X*{ZquJf{nz)kY|Xdl)-O5HepdIFQ%eKA<;skm+as9oDA1u(}d zSw#4{$UWb6zhp0&TK%Q_EKUw1_$&J`D0G}i{`yA04E&i*EHbz6@H6W?iZeo9ulpkL zpk2v(>2Wki?O33OU~`?CDnIN`FbtGj_03 zX&=Ydt3F}CA}F3GFC?~~jy02S5)!$cKwRzSvU~76sm>@fw2y=O z1%i-7693q3uXtPacHL9#L~d<0hy{mLFWfO(aXp?s1>-{j%^;$(g_7XNs_@%x0cwj= z?!zckv!V^|j+{11=8aXhrkr(>*OhBA!X~bArN@xxTrVAT`=KvVjjVtLhZC#OerfU> zez#>}@bc!lx|cetT+dQ65V7ABT5&BIc+Mf8KE!~2uK(M5L#wYU4k~MG~7t{-FQ;1 z31wb@EC~BILjjl|km<4b%{9T?4<;Ev6p#o*!k{M$X8~NSQ*d2iKuVJ!XoISiYlHoK zeg%*ibG8X337&O##MsO_Br>Kjy_A|9<+xScxzA~R^f`;^MzI@VK&bbFU{$%Gnrfyi zEC9dz8N7ddq~EMar+NrfuT3M@5j`Ua`@6)Uh{fJJ#3~A#2%uAkWum4XP2P+d`(St$ zBY-c5@wtP-C&4|_G2~pjC8C^?#MuBiM6DMIi6;Pf51Hlxq-=VNeLH>J*JQPiU<-TX z?O@Toj_TM6~Q|4+jhu0Nj_F5&hxB+P*jHvMe7M%a*~m*xh@awn&||&G5$?QMOE5d#bVyzQ1wjJpfZG*}IaV8vd*=xom}+Q1&YbSlCP)Ib5^bxk@Z z&RdA_o~c#Ah^eS-7IneK!++b0{rfDse>U5Km~{Bol5B-qpt{a)>CTvbokR0eLt-}| zU?^T?*R?}b#G!LT=QSHYEgvnrjXt%-Zb44O18LPS$*3e8Vta1%&Q>ZQF@gEP5gA>h z$qWXd-;{Bjesr)p{;EfHK>7n5jA+U`nz5xi z=*U!JIBYxhedTnw1cZsE$%r7`=oB%?Z;wVdAdgoPsS=vfldld`gmjvptoQ}qaAXn& z=MrUO;jiq#0j2qxAfao^`I{9|--Z;QO7?9QvQR%(Fka?Jrb3DXPp2xX1rd|q3FXdl zoH+;+B|M{DnbS7uy;2e#b1uI(C)nqKM!La}cKTJc@WhZKvmi)tA8#3u3mB^e^bY@N zBU`4O^6NqGqwagh+l5r@D2Ry~|GsaHyb~QR$z;cXh0zPpKK!oqKcAh?ee3R2=}nNJ z&}ZF1!+HAzg~*iSf@+u~;{dm%RuuCd@d7qQFlPjXnYiUY--O7a_qmDB^BgO~C?jAd zD!bE~#BLA)ZF_Q!I5f3fQ`pdlCvSL!rvg68l4l03_qfKANz?o$J2Fsewb?*A*?mku zB^7XrZKNTd`(K1EYY}`wkq+Z1Y%P5x8|3jMv%Y8$lcW>p)n$q78|dCZESfJzA4Zh3 z9a75D2dLD#r61pCwr7Mv9#M3~AzEwL2u@O`3E`VQT92R7-x*oC6H9hcC40uCrIa9l znwrpGC*yU4u^7*xg>2BUtbG6_+S!**ZX4(NY7SEg6B6aLgdR+Ai>3fYP#L}j3pAsd zz77f?vV9c>In*>1GAe?mQOF|9OI%UgmJ5f^`jgVqe3YZyvzlI@qy*8g#C>f05?GjdI&U& zoreB}CH^zM_<8N`27k5xR}A^jP5(Cq{?|bBlb&o%=>6Oe9WKiNmw!3<^f$3r2PEvu zpB&0e#&7NHbh(iFxq~B|$5GidmL~tPaxxvicLYLKLHQsxFyviqhbfbxN9 zld79VZIoFW5u^{lQ12JQMg;M?ovosIdK*w~VLNTsjyY>8Fy+s`;vr)1TvVA^;qur( zk$Uv2Prz->K{uQB#eIrpXC85KGL^S(d8x!urbs8D14_{@ST1>vt;RB5qZ%Xs2v$J9h=;|Wj7W->h3MU4g| zP{Zuga4*PSNlw~^ov6am7v!ULD71f7)joC%;G=?fDb-CI>#$CA8)=ZEF%l+DQVX-k z#41iAN?dLqYh~zG$y`u&D~#O?a2Uhi?x{{D>zlQjvGu1Mb;Yk5L@O$EN&vIa&)1-A0Ju}MMu++l;QGZ`wyBz&MQ}77GbhHL~;aY zDb$28Ya)qF%)L$fK+VFH50vF4ztY4Y@V->-R`gN#7Fd+dO^)Z_#Nw>?O@!@^O{59V zI~A4bys&(8KiQUaekB{LXE3o!RQ1OcaD+2|$0Ab^K~w_vBrbs*!lI3trY=2uGteXx zc_sJ-`GbRJP?fkiblH~RYb#{XGNt#6yPI`zhDTK5KwK3O_!^ z0J09vdCNXaeBD58U@-IxY4Pw^x}f1phn2DmzjZ9(xhRPctyIYmR z#<@-!K)oJg(OZMFz{ZhhI7H-o;!_eXvR)5F87?m7XLE=MvviU}L@al6iV7hK)f^k` za=Bh_$xH7Hbdf_N63K=IiRu0$h{X;Do$Oe&`Mn?R$M2cE{qgg>@ZWvLKcpVI-~TWu zf|J6!k!IN?T)3}+a_re1;Iy`euzLfp-9EzRnP6%zeoZhjGIO&04}MdxaSjn(ku+7> zY(2AG3H>qg<0myS#h-IplFnh9EO%pRID3`Y`#eL`3Hn$o1?5kU z^Xm!d@n)~>-;#0_j?$bw-syj2JCY;W@FOuB6fm3uOA{%K)hW?TguluHg_bfmKB&Z~ zZ7}>arF?!<54n;lzq7H1NYdixl}$4ldN;V~dm<=>Gm|oK%-JRu{GwkndF@Whmfh- zqX^(GX`~yKx_iX_F4(Ov*jMW(g}u?4_BLwXecjXxYpTr}UuiKrp1Q3B)uU4IK)ucp zVp2SNZdyjzo>L@{L0zL8iRZmar%s=X_|kXHH!FTtv7Msks2ox?8wQRQ5tr8RUrdNe zk^aBJX15&E$qvVtS)vI?q@m0A2?DSRGj857G~b)Q%X4jIXm-96$AZ6#94A)^Buz>pr+VPPf# z8BbmdCXVa>G+|DEZ#@sbwif=G|Id(@P}?E9xk3YcL#t@kdDXC_-G4hx+V@?r=NIWHtAv-gBxA7RAwf)&M8Q zJgrAu^zgA#%*s_**v75~PR#&F)}m+!4r|cU=yG>rz7`slf>O8if8+FPKc`>Uzp!MT znA1`&oO|yypLxcSb&n68xYfm(I~*p@U3}`(sk8kwEFCFda6!3Ol<21d)k{^*SGCbg z2YS{<2E=Z}0$C1~mG@glZ)8n;+swNZEPxY(Sd+m6FC|$c%Iex}>=lwtr^T`fdcrwm z*48bZ?C0}*0#FmwmbF`w>0kuZN-6Y(Hw)zho$8^6X ztiElVIjgxn^Q0-TSA9cvJ2Q`s@?BZaY>J`LdO1R~G99-x_778dxFztx!G#E(@!I6S zXw5i|7@zIb@)5g8GmHIGVEzxin4>pyzUbk6$MfGG{z;(zY5#9oas5@%{+|{2aAy=a zV!W#+zRukVQ}9!4rVoUl{D&(3E%|Wg19o4vi}+!#&@&@9cB}5$clzP+hreBKK7)U7 zIl{kherG4AeWiDAOq^3ZdfF#_!jW6#?1k!=Oo5+Yl5s5%^YB|w` z)=$RAJ)3(`-htB}=UWDULL#Pi3V^&KVk)*f3pL{LSQB&^ltCEL3U zgi0qFyQ%TwdX-{~gFl>_F)0v+a93^gz^y-%U*|({)$P9dCeF}E%}otz&42_qQ`|weG}U^;)gd4 zcBQ9~$qEs6J|E5pTsqk9^?bi_!WbYAjv*oH+JG3&DJ|WqO&Jgbr($85(UVqZAn(&E{uq4ze2=0BkdZw<94X^X@|Kb)R+XPFu)^+foZ z-9~jlFt>fG?w4J%~@A36tXrg?9s0jak=W4ID@s2ZhW)8;TgGi!D(f!ke3{ zbHV-}U`kao8RcQ=RAjl|gfQkl&|+dK6sf2dO&%LLRFA@lLmy?^5jMdMNZ+a}9%9g_ zD=*2$B#Kx)1D3qrTrs&?C2y^{tuM@Rd@sl-;gn&aq^f}-HX26S5d0M?mL_xA+SrCH{mY6WDM&eS0OX4MLLsT=Yv}Js9u?X zM628e-sJrT(%4ykxa3If2~(NG#QZJ(o3KpR6b|y35lW=Km=&`6Thn*@eoD z*N#5807W?1)pX}r0qs%2qa^Fi?N$$_E-co_&)MuNzl^aW9b@yb2R^yz!h&(smv&kbSM4Gv}^ ze*8XgZ+O6XSas^c^T><7!f^g=vxoMRn$Kl$&6j8Gj;GcNRKzINz&pAF2)=&;rNFRu z5b70v(h=64F^TUJTM$Gtfy%8()k0#gJAdcQ%Fa(7iXgC;iU7N%jO-q8llfPTXc!Xt zH1wNDMQvK)I{An`Y1myU3#Vgm@6=9C>}j7UbmJe^t)6P)%$eg`(0p5ZVS7v>n6gqx zSmi`ba^Nu0X6PY!D7J8fUCC$OW4du3H$ZY*s#jE*?TM`k-f)Cb9kvgy1@MF{M-c?< z!=ej0TYNao-JN=NFsoCygsQuOCi(_R`zMI#46I~KZdV45lUG`hD~VGif^Tw!CmzYB zIlzd&4i67xk8-w>5Zp`MzUuzt6HA``ELV;@ME_Q)tBz)is`vNqTo*hv}WP1tQ`~`;0KusDi8-Omi64;i~LAR(O z8g8B2gSF9QmIr)mrG#AG+jyY9I5VVUl}MJ|Fsq>bg@tO~u4V$-x_aBIu0JvzJ}I}^ zHPXj|KXSO zHS|{=;=k1u@Fx%97h$t+u$#wtb(#@lw)Wek@Qkn(24JqE$ZQRQE*lY&LZ`+HHxdliwX0dADfrIRHY%O$;=|t#_rRRsC|9w7-D86gY{cd?eLJ{5 zJ(cr9dtZeBbM792F@Lhp(mVxFmT|8SdSX9+wY`SJU2Aw~(p{2h$-|P~v}xb++&B$I zPy!j_Ou|p{HI$X5ZH$s!Hr=aD12KNg_1aZ~xj6(!7{bMK{lhoQJNK#E{10`0!>!i= z@5L6fy_q54<{~-#Bs=#1j4~wJhS)juQS|Lj9boLu$0oj4y>xf)KRKL#Jo)Zy&8tA_ zTPF@ZP!U+~dUT3Wda$*1BCe=!n%(ti_zd)J&Dp7ll)CYgPcVsRAqQ-yt5J+e3%&Fb zYwBmDtNdHyo4-W5Y>GMa84Dw3VpM;38r>=L+^13S#|?poOAgr%kNAwdc2zFyvSDw# z`#jm*)mA)2s!+7u#O0Q98#%?uPVDb4t4>g<1}_fs4wWZ4ec@fa;NkG&IMmXYWP|eg z@_8@Vo-dj;X9iRny{mhJiPvaDdYA;IFv`VEcnpMI?i_n)|CDTZUew;uyNX&)ff;6Q z0-`9hp3nS{pP|hBzPJ5LMbYu!Y*#!Y=Zh@o?xEui59jU4xhY|b&h-wL)kR<9Wiw5k;m&nH}aq&9ZbOC!6|^ISdd;78tu4A$?nBjf~Db921J zlRIOc@x9XWeM>oUkj1#_B@6t!)S4P$G=gc96-n_bu`2$Y@%T=TQ93Pviydu=Ds2rF z@e6-l_QQ_-!nLqz;$-`(vPx6Q<8Jf#tDgBwF*i}S4fu6p+sZDo?7krEZ&E2L=gk)(A!h1DVfZ2lO?S7Ey{%?vs2Oi`Cb$iK;oQ62#N z28;o2_A5&s*}L4XvULLKqYwBYGtpT0qPJjLdKz;uYhu`URSZUwP7lvZiPu|F(nWL} zgSfPfdRB8cvLAWkRE*oVX3*npYcg3HwI4?3kNl%Y`2Ut3V(-Q%T;D5Gdd=)-8TxSJ L>jhWu{PF()o?&&o literal 0 HcmV?d00001 diff --git a/guides/v2.2/javascript-dev-guide/widgets/jquery-widgets-about.md b/guides/v2.2/javascript-dev-guide/widgets/jquery-widgets-about.md index 0505236317d..d64b0bd4ed0 100644 --- a/guides/v2.2/javascript-dev-guide/widgets/jquery-widgets-about.md +++ b/guides/v2.2/javascript-dev-guide/widgets/jquery-widgets-about.md @@ -25,6 +25,7 @@ This guide discusses the following widgets: - [Prompt widget] - [QuickSearch widget] - [RedirectUrl widget] +- [RowBuilder widget] - [Tabs widget] - [ToggleAdvanced widget] - [TrimInput widget] @@ -53,6 +54,7 @@ Magento out of the box does not contain jQuery UI styles. Also, it is not recomm [Prompt widget]: {{page.baseurl}}/javascript-dev-guide/widgets/widget_prompt.html [QuickSearch widget]: {{page.baseurl}}/javascript-dev-guide/widgets/widget_quickSearch.html [RedirectUrl widget]: {{page.baseurl}}/javascript-dev-guide/widgets/widget_redirectUrl.html +[RowBuilder widget]: {{page.baseurl}}/javascript-dev-guide/widgets/widget-row-builder.html [Tabs widget]: {{page.baseurl}}/javascript-dev-guide/widgets/widget_tabs.html [ToggleAdvanced widget]: {{page.baseurl}}/javascript-dev-guide/widgets/widget_toggle.html [TrimInput widget]: {{page.baseurl}}/javascript-dev-guide/widgets/widget-trim-input.html diff --git a/guides/v2.2/javascript-dev-guide/widgets/widget-row-builder.md b/guides/v2.2/javascript-dev-guide/widgets/widget-row-builder.md new file mode 100644 index 00000000000..4d220d72828 --- /dev/null +++ b/guides/v2.2/javascript-dev-guide/widgets/widget-row-builder.md @@ -0,0 +1,267 @@ +--- +group: javascript-developer-guide +subgroup: 3_Widgets +title: RowBuilder widget +contributor_name: Atwix +contributor_link: https://www.atwix.com/ +--- + +## Overview + +The RowBuilder [widget](https://glossary.magento.com/widget/) allows you to build a container with rows. + +The RowBuilder widget can be used only on the frontend area. + +The RowBuilder widget source is [lib/web/mage/row-builder.js]. + +## Initialize the RowBuilder widget + +For information about how to initialize a widget in a JS component or `.phtml` template, see the [Initialize JavaScript][] topic. + +The RowBuilder widget is instantiated with: + +```javascript +$("#row-builder").rowBuilder({ + "rowTemplate":"#row-template", + "rowContainer":"#row-container", + "rowParentElem":"
", + "remEventSelector":"a", + "btnRemoveSelector":".action.remove", + "maxRows":"5" +});`` +``` + +Where: + +- `#row-builder` is the selector of the element which will be the RowBuilder. + +Phtml template file examples using script: + +```html + +``` + +## Options + +The PopupWindow widget has the following options: + +- [rowTemplate](#rowtemplate) +- [rowContainer](#rowcontainer) +- [rowIndex](#rowindex) +- [rowCount](#rowcount) +- [rowParentElem](#rowparentelem) +- [rowContainerClass](#rowcontainerclass) +- [addRowBtn](#addrowbtn) +- [btnRemoveIdPrefix](#btnremoveidprefix) +- [btnRemoveSelector](#btnremoveselector) +- [rowIdPrefix](#rowidprefix) +- [additionalRowClass](#additionalrowclass) +- [addEventSelector](#addeventselector) +- [remEventSelector](#remeventselector) +- [hideFirstRowAddSeparator](#hidefirstrowaddseparator) +- [maxRows](#maxrows) +- [maxRowsMsg](#maxrowsmsg) + +### `rowTemplate` + +The row template selector. + +**Type**: String + +**Default value**: `'#template-registrant'` + +### `rowContainer` + +The row container selector. + +**Type**: String + +**Default value**: `'#registrant-container'` + +### `rowIndex` + +Row index used by the template rows. + +**Type**: Integer + +**Default value**: `0` + +### `rowCount` + +Row count. + +**Type**: Integer + +**Default value**: `0` + +### `rowParentElem` + +Row parent element. + +**Type**: String + +**Default value**: `'
  • '` + +### `rowContainerClass` + +Row container class. + +**Type**: String + +**Default value**: `'fields'` + +### `addRowBtn` + +The add row button selector. + +**Type**: String + +**Default value**: `'#add-registrant-button'` + +### `btnRemoveIdPrefix` + +Id prefix of a remove button. + +**Type**: String + +**Default value**: `'btn-remove'` + +### `btnRemoveSelector` + +The remove button selector. + +**Type**: String + +**Default value**: `'.btn-remove'` + +### `rowIdPrefix` + +Id prefix of a row element. + +**Type**: String + +**Default value**: `'row'` + +### `additionalRowClass` + +The additional row class is added to rows added after the first one. + +**Type**: String + +**Default value**: `'add-row'` + +### `addEventSelector` + +Default selectors for add element of a template. + +**Type**: String + +**Default value**: `'button'` + +### `remEventSelector` + +Default selectors for remove markup elements of a template. + +**Type**: String + +**Default value**: `'a'` + +### `hideFirstRowAddSeparator` + +This option allows adding first row delete option and a row separator. + +**Type**: Boolean + +**Default value**: `true` + +### `maxRows` + +Max number of rows. + +**Type**: Integer + +**Default value**: `1000` + +### `maxRowsMsg` + +The message selector of an element which appears when the max number of rows has exceeded. + +**Type**: Integer + +**Default value**: `1000` + +## Code sample + +This example shows the row builder container which adds new row when you click on the *Add Item* button and removes a row when you click on a *Remove Item* button. + +```html + + +
    + + +
    +
    +``` + +## Result + +As a result, we see the RowBuilder widget example with 5 rows as max. + +![RowBuilder widget Example]({{ site.baseurl }}/common/images/widget/row-builder-widget-result.png) +![RowBuilder widget with warning message Example]({{ site.baseurl }}/common/images/widget/row-builder-widget-warning-message-result.png) + + +[lib/web/mage/row-builder.js]: {{ site.mage2bloburl }}/{{ page.guide_version }}/lib/web/mage/row-builder.js +[Initialize JavaScript]: {{page.baseurl}}/javascript-dev-guide/javascript/js_init.html diff --git a/guides/v2.3/javascript-dev-guide/widgets/widget-row-builder.md b/guides/v2.3/javascript-dev-guide/widgets/widget-row-builder.md new file mode 120000 index 00000000000..fa8e1d27baf --- /dev/null +++ b/guides/v2.3/javascript-dev-guide/widgets/widget-row-builder.md @@ -0,0 +1 @@ +../../../v2.2/javascript-dev-guide/widgets/widget-row-builder.md \ No newline at end of file From 5b391f2e1929ba147214bd2dfd1a23b74eeadd36 Mon Sep 17 00:00:00 2001 From: Sergiy Zhovnir Date: Mon, 19 Aug 2019 22:23:05 +0300 Subject: [PATCH 2/4] Adjusted the explanation for additionalRowClass and hideFirstRowAddSeparator options --- .../v2.2/javascript-dev-guide/widgets/widget-row-builder.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/guides/v2.2/javascript-dev-guide/widgets/widget-row-builder.md b/guides/v2.2/javascript-dev-guide/widgets/widget-row-builder.md index 4d220d72828..cbee0b2c69f 100644 --- a/guides/v2.2/javascript-dev-guide/widgets/widget-row-builder.md +++ b/guides/v2.2/javascript-dev-guide/widgets/widget-row-builder.md @@ -160,7 +160,7 @@ Id prefix of a row element. ### `additionalRowClass` -The additional row class is added to rows added after the first one. +The additional row class name which is added after the main class name. **Type**: String @@ -184,7 +184,7 @@ Default selectors for remove markup elements of a template. ### `hideFirstRowAddSeparator` -This option allows adding first row delete option and a row separator. +This option specifies if the [remove link](#btnremoveidprefix) and [additional row class](#additionalrowclass) are removed for the first row. **Type**: Boolean From 76050c6a85e93468ba23a972de49b52bed02cd7c Mon Sep 17 00:00:00 2001 From: Sergiy Zhovnir Date: Sun, 25 Aug 2019 14:08:57 +0300 Subject: [PATCH 3/4] Adjusted the RowBuilder widget documentation --- .../widgets/widget-row-builder.md | 19 ++++++++----------- 1 file changed, 8 insertions(+), 11 deletions(-) diff --git a/guides/v2.2/javascript-dev-guide/widgets/widget-row-builder.md b/guides/v2.2/javascript-dev-guide/widgets/widget-row-builder.md index cbee0b2c69f..b7daa7e7a06 100644 --- a/guides/v2.2/javascript-dev-guide/widgets/widget-row-builder.md +++ b/guides/v2.2/javascript-dev-guide/widgets/widget-row-builder.md @@ -1,18 +1,15 @@ --- group: javascript-developer-guide -subgroup: 3_Widgets title: RowBuilder widget contributor_name: Atwix contributor_link: https://www.atwix.com/ --- -## Overview - The RowBuilder [widget](https://glossary.magento.com/widget/) allows you to build a container with rows. The RowBuilder widget can be used only on the frontend area. -The RowBuilder widget source is [lib/web/mage/row-builder.js]. +The RowBuilder widget source is [lib/web/mage/row-builder.js][]. ## Initialize the RowBuilder widget @@ -35,7 +32,7 @@ Where: - `#row-builder` is the selector of the element which will be the RowBuilder. -Phtml template file examples using script: +The following example shows a PHTML file using the script: ```html