1

بابه‌ت: دانانی پێداچونەوە و مەرج بۆ فۆڕمەکانمان بەبەکاربردنی JS

سڵاوی خواتان لێبێت هاوڕێیان،

لەم بابەتەدا باس دروستکردنی پێداچونەوە (Validation) بۆ فۆڕم دەکەم بە شێوەیەکی ئاسان و بەبەکارهێنانی لایبرەریەکی جاڤاسکریپت ئەویش بە ناوی Parsley.jsـە.

Parsley.js چییە؟
وەک خۆیان پێناسەیان کردووە "لایبرەریەکی جاڤاسکریپتە کە کاری پێداچونەوەی فۆڕم ئاسانتر دەکات و کات بۆ بەکارهێنەر دەگەڕێنێتەوە".
مەبەست لەوەیە کە ئاسانکاری تەواو کراوە لە بەکارهێنانی و بە نوسینی کەمترین کۆد و دەرەنجامێکی زۆر باش و گونجاو و خێرا و سەرنجڕاکێش،
وەبیرم نەچێت ئەمە بۆ بەشی پێشەوەی ماڵپەڕە (Front-End) .

پێداچونەوەی فۆڕم چییە؟
بێگومان هەموومان لەپڕۆژەکانمان پێویستمان بەچەندین فۆڕمی جیاواز دەبێت جا لەهەر بوارێک دابێت، بەنموونە ئێمە خانەیەکمان هەیە بەناوی (ناونیشان) کە دەمانەوێت بەمەرج دایبنێین کە بەکارهێنەر ئەم خانەیە پڕبکاتەوە، خۆی لە HTML ئەو کردارە ئەنجام دەدرێت لەڕێگەی ئیلیمێنتی (Required) بەڵام بەکارهێنانی ئەمە گونجاوترە و بەڕونی بەکارهێنەر ئاگادار دەکاتەوە کە پێویستە ئەم خانەیە بەبەتاڵی جێ نەهێڵیت.

نموونەی (١) بۆ فۆڕمێک کە بەبێ بەکارهێنانی (Required) و نموونەی (٢) بەبەکارهێنانی (Required) و (Parsley.js) لەهەمان کاتدا.

http://www.webchinupload.com/f/2018-07/7034f1d5beeda675a332c74c7cd5396b.png

وەک دەبینین کە نموونەی ٢ ڕونتر بەبەکارهێنەر نیشانی دەدات کە پێویستە خانەکە پڕ بکاتەوە.
وە ئەم لایبرەریە هەموو ئەو مەرجەکانە لەخۆدەگرێت کە لە html بونیان هەیە، بەنموونە خانەیەکە کە تەنیا دەمانەوێت ژمارەبێت یان نوسین یان بەستەر یان هەرشتێکی تر...،
نمونەیەکی ڕونتر گریمان تۆ فۆرمێکت هەیە و دەتەوێت بچوکترین ژمارەی ١٠ بێت و لە ١٠٠ گەورەتر نەبێت ئەوا ئاگادار دەکاتەوە بەم شێوازە

http://www.webchinupload.com/f/2018-07/cc0314df9839177407d5d3b80bdbb7b7.PNG

ئەمانەی سەرەوە تەنیا ٢ نموونەی سادەبوون هەر مەرجێک کە ئێمە هەمانبێت لە html ئەوا لە Parsley.jsـدا هەمانە، جگە لەوە خۆت دەتوانیت مەرجی تایبەتیشی پێ بدەی بە نوسینی چەند دێڕێکی زیاتر... ئەمە گەر بتەوێت کەستەمایزی بکەی.

ئێستا لامان ڕونە کە چییە و ئیشی چییە، باشە چۆن بەکاری بهێنم؟
سەرەتا پێویستە ئێمە جەیکویری بانگ بکەین چونکە ئەم لایبرەریە لەگەڵ ئەو کاردەکات و دواتر لابیرەری Parsley.js واتە پێویستە ئەم دوانە لە پەڕەکەمان بانگ بکەن

  <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <script src="http://parsleyjs.org/dist/parsley.min.js" type="text/javascript">

وبەکارهێنانی ئاسانە و تەنیا بە نوسینی لاینێک ئیشەکەت جێبەجێ دەبێت بە نوسینی data-parsley-validate لەناو فۆڕم بەم شێوازە

<script src="jquery.js"></script>
<script src="parsley.min.js"></script>

<form data-parsley-validate>
...
</form>

یاخود بەم شێوازەش هەمان ئەنجامە

<form id="form">
...
</form>

<script>
  $('#form').parsley();
</script>

وە زمانی سەرەکی خۆی زمانی ئینگلیزیە بۆ بەکارهێنانی کوردی پێویستە ئەم کۆدە بنوسیت کە خۆم کردومە بە کوردی لەهەر پەڕەیەک کە دەتەوێت مەرج دابنێیت

<script>
Parsley.addMessages('ku', {
  defaultMessage: "ئەم خانەیە بەدروستی پڕبکەوە.",
  type: {
    email:        "پێویستە ئیمەیڵ بە دروستی بنوسی.",
    url:          "پێویستە بەستەر بەدروستی بنوسی.",
    number:       "پێویستە ژمارە بە دروستی بنوسی.",
    integer:      "پێویستە ژمارە بە دروستی بنوسی.",
    digits:       "پیویستە ئەم خانەیە بە دروستی پڕبکەیەوە.",
    alphanum:     "پێویستە ئەم خانەیە تەنها نوسینی تیابێت."
  },
  notblank:       "ئەم خانەیە نابێت بەتاڵ بێت .",
  required:       "ئەم خانەیە نابێت بەتاڵ بێت .",
  pattern:        "ئەم خانەیە دروست پڕبکەوە.",
  min:            "ئپێویستە ئەم خانەیە گەورەتربێت یان یەکسانبیت بە %s.",
  max:            "ئەم خانەیە پێویستە بچوکتربێت یاخود یەکسانبێت بە %s.",
  range:          "ئەم خانەیە پێویستە لە بەینی  %s و %s دابێت.",
  minlength:      "ڕێژەی پیتەکانی پێویستە یەکسانبێت بە %s یان زیاتر..",
  maxlength:      "پێویستە ڕێژەی پیتەکانی بچوکتربێت یاخود یەکسانبیت بە %s.",
  length:         "تکایە ئەم خانەیە بە دروستی پڕبکەوە.",
  mincheck:       "پێویستە %s دانە هەڵبژێریت یان  زیاتر.",
  maxcheck:       "پێویستە %s خانە هەڵبژێریت یان کەمتر.",
  check:          "پێویستە هەڵبژاردنەکانت لەبینی %s و %s دابێت..",
  equalto:        "ئەم خانانە نابێت وەکویەکبن.."
});

Parsley.setLocale('ku');
</script>

ئەم بۆ زمانی کوردی لە گیتهەب زمانەکانی تریش هەن کە بۆ وێبسایتی موڵتی لانگویج سودی دەبێت بۆتان، و زمانی کوردیشم بۆ ناردون و چاوەڕێم کە قبوڵی بکەن.

لایەنە باشەکانی:
- شێوازێکی جوان لای بەکارهێنەر لەکاتی نیشاندانی گەر شتێکی بەهەڵە نوسیبێت.
- لەهەموو گەڕۆکەکان (براوسەرەکان) بەبێ جیاوازی کاردەکات.
- دەتوانی کەستەمایزی بکەی و بەئارەزوی خۆت مەرجی جیاوازی پێ بدەیت.
- گەڕاندنەوەی کات بۆ بەکارهێنەر کە گەر زانیاریەکی بەهەڵە داخڵکردبێت یان بەجێ هێشتبێت ئەوا یەکسەر ئاگاداری دەکاتەوە.
- وزەیەکی کەمتر لە سێرڤەرەکەت سەرف دەبێت، وەک ڕونە هەموو ڕیکوێستێک و کردنەوەی پەڕەیەک هێزی پێویستە مەبەستم (bandwidth).

ئەمانەی سەرەوە باسم کردن بەسادەیی بوو  دەتوانین زۆر کرداری تری پێ ئەنجام بدەین بۆ خوێندەوەی زیاتر لەسەری سەردانی ماڵپەری سەرەکی بکەن
http://parsleyjs.org/doc/index.html

یان لە گیتهەب
https://github.com/guillaumepotier/Parsley.js/

بەهیوای سود.

2

وه‌ڵام: دانانی پێداچونەوە و مەرج بۆ فۆڕمەکانمان بەبەکاربردنی JS

ده‌ست خۆش كارێكى زۆر باشه‌
واته‌ جافاسكريبت ئاسانكارى زۆر ده‌كات له‌ كه‌مكردنه‌وه‌ى كۆده‌كان و خێراتره‌
ئايا بۆ هه‌مووشتێك به‌گشتى نا ده‌توانم پشت به‌ جافاسكريبت ببه‌ستم

هیچ شتێك ئه‌وه‌نده‌ باش نییه‌ نه‌توانرێت باشتر بكرێت (ئاسۆ نادرى).
Aso Nadri

3

وه‌ڵام: دانانی پێداچونەوە و مەرج بۆ فۆڕمەکانمان بەبەکاربردنی JS

world نووسی:

ده‌ست خۆش كارێكى زۆر باشه‌
واته‌ جافاسكريبت ئاسانكارى زۆر ده‌كات له‌ كه‌مكردنه‌وه‌ى كۆده‌كان و خێراتره‌
ئايا بۆ هه‌مووشتێك به‌گشتى نا ده‌توانم پشت به‌ جافاسكريبت ببه‌ستم

بەڵێ برام لە ئێستادا لایبرەری هەیە بۆ هەموو بابەتێک و ئاسانکاری تەواوت بۆ دەکات، بەڵام جاڤاسکریپتی کەباسم کردووە بەشی پێشەوەی ماڵپەڕە(Front-End) واتە ناتوانیت تەنیا بەوە پشتت قایم بکەی چونکە ئەمانە لە براوسەر ڕەن دەبن و بەکار هێنەر دەتوانێت دەستکاری بکات زیاتر بۆ ئاسانکاریە ئەوە و گەڕانەوەی کات.

4

وه‌ڵام: دانانی پێداچونەوە و مەرج بۆ فۆڕمەکانمان بەبەکاربردنی JS

ده‌سته‌كانت خۆشبێت تێگه‌يشتم لێت نوونه‌يه‌ك وه‌ك كۆپى نه‌كردنى بابه‌ته‌كانى مالپه‌ر جوانكارى
پرسيارێك ئه‌گه‌ر ده‌ستكارى كۆده‌كانى جافاسكريبت بكرێت به‌ زيادكراوێكى وێبگه‌ر ئه‌وكات ده‌توانم خانه‌كانى فۆرم پربكه‌مه‌وه‌
بابه‌ته‌كه‌ بنێرم هه‌رچى فلته‌ره‌ ناچالاك بكه‌م ئه‌وكات چى له‌كاتێكدا ته‌نها كۆدى جافا سكريبت هه‌يه‌

هیچ شتێك ئه‌وه‌نده‌ باش نییه‌ نه‌توانرێت باشتر بكرێت (ئاسۆ نادرى).
Aso Nadri

5

وه‌ڵام: دانانی پێداچونەوە و مەرج بۆ فۆڕمەکانمان بەبەکاربردنی JS

world نووسی:

ده‌سته‌كانت خۆشبێت تێگه‌يشتم لێت نوونه‌يه‌ك وه‌ك كۆپى نه‌كردنى بابه‌ته‌كانى مالپه‌ر جوانكارى
پرسيارێك ئه‌گه‌ر ده‌ستكارى كۆده‌كانى جافاسكريبت بكرێت به‌ زيادكراوێكى وێبگه‌ر ئه‌وكات ده‌توانم خانه‌كانى فۆرم پربكه‌مه‌وه‌
بابه‌ته‌كه‌ بنێرم هه‌رچى فلته‌ره‌ ناچالاك بكه‌م ئه‌وكات چى له‌كاتێكدا ته‌نها كۆدى جافا سكريبت هه‌يه‌

برام ئەوەی من دامناوە وەک باسیشم کرد لە Front-End کاردەکات واتە Client Sideـە ، بەڵێ دەتوانی دەستکاری بکەیت و مەرجەکان لاببەیت چونکە کۆدەکانی لە براوسەر ڕەن دەبێت، کەواتە لێرەوە بۆمان دەرکەوت کە ئەمە تەنیا ئیش بۆبەکارهێنەر ئاسان دەکات کە پێویست نەکات دووبارە زانیاریەکان بنوسێتەوە ئەمما تۆ گەر بچیەوە سەر لایەنی پاراستن ئەوا تۆ پێویستە بە زمانێک کە Server-Sideـە وەک (php,asp,python) یان هەر زمانێکی تری بزۆک پێداچونەوەی بۆ بکەیت ئەوکاتە کێشەی سکیوریتیش چارە دەبیت بۆ مەسەلەی ڤاڵیدەیشن.

6

وه‌ڵام: دانانی پێداچونەوە و مەرج بۆ فۆڕمەکانمان بەبەکاربردنی JS

ده‌ست خۆش بژى

هیچ شتێك ئه‌وه‌نده‌ باش نییه‌ نه‌توانرێت باشتر بكرێت (ئاسۆ نادرى).
Aso Nadri