آموزشگاه برنامه نویسی تحلیل داده
آموزشگاه برنامه نویسی تحلیل داده

آموزش KnockoutJS-آموزش submit binding در KnockoutJS

دوره های مرتبط با این مقاله

آموزش KnockoutJS-آموزش submit binding در KnockoutJS

هدف

کار این binding اضافه کردن یک event handler است به گونه ای که پس از submit شدن المان مربوطه ی DOM تابع انتخاب شده ی جاوا اسکریپت تان احضار خواهد شد. معمولا از این binding در المان های form استفاده می شود.
زمانی که در یک form از این binding استفاده کنید، در این صورت KnockoutJS از انجام default submit action برای آن form توسط مرورگر جلوگیری میکند. به بیان دیگر مرورگر تابع handler تان را فراخوانی خواهد کرد اما form را به سرور submit نمی کند. این پیش فرض می تواند کمک زیادی به شما بکند زیرا شما وقتی از submit binding استفاده می کنید که بخواهید از form به عنوان رابطی به view model تان استفاده کنید. نه به عنوان یک HTML form معمولی. اگر می خواهید کار submit کردن form مانند یک HTML form معمولی انجام شود، تنها کافیست مقدار true را از submit handler خود برگشت دهید.

مثال:

< form data-bind="submit: doSomething" >
    ... form contents go here ...
    < button type="submit" >Submit< /button >
< /form >
 
< script type="text/javascript" >
    var viewModel = {
        doSomething : function(formElement) {
            // ... now do something
        }
    };
< /script >

همانطور که در این مثال نشان داده شده است، KnockoutJS المان form را به عنوان پارامتری به تابع submit handler تان تحویل می دهد. اگر مایل باشید می توانید از این پارامتر صرف نظر کنید، یا برای مثال در زمینه های زیر از آن استفاده کنید:

  • استخراج حالت یا داده های اضافی ( additional data or state) از المان های form
  • فعال کردن اعتبارسنجی در سطح رابط کاربری ( UI-level validation) با استفاده از کتابخانه ای مانند jQuery Validation با استفاده از کد مشابهی با if ($(formElement).valid()) { /* do something */ }

چرا نمی توان فقط یک click handler را در submit button قرار داد؟

به جای استفاده از submit در form می توانید در submit button از click استفاده کنید. به دلیل اینکه در submit می توانید با استفاده از راه های جایگزین مانند فشار دادن کلید اینتر در زمان تایپ کردن داخل یک text box، form را submit کنید، submit نسبت به click مزیت بیشتری دارد.

پارامترها

  • پارامتراصلی
    • پارامتراصلی تابعی است که می خواهید به رویداد submit مربوط به المان مقید کنید.
    • محدودیتی در اشاره به توابع جاوا اسکریپت برای شما وجود ندارد (لزومی ندارد که حتما تابعی در view model تان وجود داشته باشد). می توانید با نوشتن submit: someObject.someFunction در هر شیئی که بخواهید به تابعی اشاره کنید.
    • توابعی که در view model تان هستند اندکی خاص می باشند زیرا می توانید به آن ها با نوشتن submit: doSomething اشاره کنید. لزومی ندارد که حتما این کد را به صورت submit: viewModel.doSomething بنویسید (هرچند که از نظر فنی انجام این کار ایرادی ندارد).
  • پارامترهای اضافی
    • ندارد
نکته:

برای دریافت اطلاعات بیشتر در رابطه با چگونگی تحویل پارامترهای بیشتر به تابع submit handler خود یا برای اینکه بدانید که چگونه بعد از احضار توابعی که در view model شما وجود ندارند this handle را کنترل کنید به نکات مربوط به click binding مراجعه کنید. تمامی نکات بیان شده در بخش click binding در submit handler ها نیز صدق می کند.

وابستگی ها

به غیر از کتابخانه ی اصلی KnockoutJS وابستگی دیگری ندارد.

  • 194
  •    156
  • تاریخ ارسال :   1397/05/20

دانلود PDF دانشجویان گرامی اگر این مطلب برای شما مفید بود لطفا ما را در GooglePlus محبوب کنید
رمز عبور: tahlildadeh.com یا www.tahlildadeh.com
ارسال دیدگاه نظرات کاربران
شماره موبایل دیدگاه
عنوان پست الکترونیک

ارسال

آموزشگاه برنامه نویسی تحلیل داده
آموزشگاه برنامه نویسی تحلیل داده

تمامی حقوق این سایت متعلق به آموزشگاه تحلیل داده می باشد .