WidgetNas

انتخاب چند تایی

لیست از موضوعات داریم که بیش از تعداد استاندارد جستجوی چشمی است، به دین منظور، نیاز داریم کابر بتواند روی این لیست اعمال فیلتر کند و با وارد کردن برخی حروف فقط موضوعاتی را نمایش دهد که آن حروف در آن باشد.

قبلا در قسمت فیلتر مشابه این موضوع را پیاده سازی کرده ایم. حال میخواهیم موضوعی پیش رفته تر را با استفاده از آن خاصیت نمایش دهیم.

نمایش لیست

برای استفاده از انتخاب چند تایی از مثال زیر استفاده کنید.

خصوصیت max: با تنظیم این خصوصیت، تعداد حداکثر انتخاب مجاز را میتوانید مشخص کنید. در صورتیکه مقدار صفر را مشخص کنید، بدون محدودیت قابل انتخاب است.

خصوصیت min-length مشخص کننده تعداد حداقل کاراکتر برای شروع جستجو است. مقدار پیش فرض 1 می باشد.

LTR

  • First Name
  • Last Name
  • Company
  • Address
  • City
  • Country
  • State/Province
  • ZIP/Postal Code
  • Phone 1
  • Phone 2
  • Email
  • Web
  • First Name
  • Last Name
  • Company
  • Address
  • City
  • Country
  • State/Province
  • ZIP/Postal Code
  • Phone 1
  • Phone 2
  • Email
  • Web
  • First Name
  • Last Name
  • Company
  • Address
  • City
  • Country
  • State/Province
  • ZIP/Postal Code
  • Phone 1
  • Phone 2
  • Email
  • Web
  • First Name
  • Last Name
  • Company
  • Address
  • City
  • Country
  • State/Province
  • ZIP/Postal Code
  • Phone 1
  • Phone 2
  • Email
  • Web

RTL

  • نام
  • نام خانوادگی
  • شرکت
  • آدرس
  • شهر
  • کشور
  • استان
  • کد پستی
  • تلفن 1
  • تلفن 2
  • پست الکترونیک
  • آدرس وب
  • نام
  • نام خانوادگی
  • شرکت
  • آدرس
  • شهر
  • کشور
  • استان
  • کد پستی
  • تلفن 1
  • تلفن 2
  • پست الکترونیک
  • آدرس وب
  • نام
  • نام خانوادگی
  • شرکت
  • آدرس
  • شهر
  • کشور
  • استان
  • کد پستی
  • تلفن 1
  • تلفن 2
  • پست الکترونیک
  • آدرس وب
  • نام
  • نام خانوادگی
  • شرکت
  • آدرس
  • شهر
  • کشور
  • استان
  • کد پستی
  • تلفن 1
  • تلفن 2
  • پست الکترونیک
  • آدرس وب

توابع جاوا اسکریپت

selectedItems
با استفاده از این خصوصیت میتوانید لیست موضوعات انتخاب شده را در قالب یک آرایه از نوع WNListNode یا WNTreeNode را دریافت کنید.
selectedItems: WNGeneralNode[]

selectedValue
با استفاده از این خصوصیت میتوانید مقدار لیست موضوعات انتخاب شده را در قالب یک آرایه از نوع string را دریافت کنید.
selectedValue: string[]

max
تعداد حداکثر انتخاب را مشخص میکند. مقدار 0 به معنی انتخاب به صورت نامحدود است.

search
این خصوصیت از جنس WNSearchList است. برای مشاهده خصوصیات آن به صفحه مرتبط مراجعه شود.

رخداد ها

selectionChanged
اگر میخواهید بعد از هر انتخاب تابعی اجرا شود از این رخداد استفاده کنید.
selectionChanged: (t: IWNMultiSelect, node: WNTreeNode | WNListNode) => void

beforeDeselect
اگر کاربر مقداری را انتخاب کرده بود و میخواست از حالت انتخاب در آورد، این رخداد قبل از حذف کردن آن اجرا میشود اگر این تابع مقدار false برگرداند، عملیات عدم انتخاب لغو میشود.
beforeDeselect: (t: IWNMultiSelect, node: WNGeneralNode) => Promise | boolean

afterDeselect
بعد از آنکه عمل عدم انتخاب انجام شد، این رخداد فراخوانی میشود.
afterDeselect: (t: IWNMultiSelect, node: WNGeneralNode) => void

beforeFilterChanged
قبل از اینکه فیلتر عملیات فیلتر کردن را آغاز کند این رخداد فراخوانی میشود. اگر این تابع مقدار false برگرداند، عملیات فیلتر کردن لغو میشود.
برای مثال شما میخواهید به صورت پویا دیتای فیلتر کردن را از سرور بگیرید، در این رخداد دیتای جدید را خوانده و به لیست خود نسبت میدهد. سپس این تابع را با مقدار false برمیگردانید تا ادامه عملیات متوقف شود.
این تابع را با خصوصیت خطی onbeforefilterchanged نیز میتوانید مقدار دهی کنید.

مثال پویا

  • First Name
  • Last Name
  • Company
  • Address
  • City
  • Country
  • State/Province
  • ZIP/Postal Code
  • Phone 1
  • Phone 2
  • Email
  • Web

دریافت اطلاعات از سرور

برای دریافت اطلاعات از سرور، رخداد onbeforefilterchanged در قسمت خصوصیات تگ و یا رخداد beforeFilterChanged را مقدار دهی کنید. تا زمانیکه عبارتی تایپ میشود، این تابع فراخوانی شود.
سپس بر اساس، موارد مندرج در مثال زیر و مشخصات این رخداد، اقدام به پر کردن لیست خود کنید.

فقط خواندنی و غیر فعال

LTR

  • First Name
  • Last Name
  • Company
  • Address
  • City
  • Country
  • State/Province
  • ZIP/Postal Code
  • Phone 1
  • Phone 2
  • Email
  • Web
  • First Name
  • Last Name
  • Company
  • Address
  • City
  • Country
  • State/Province
  • ZIP/Postal Code
  • Phone 1
  • Phone 2
  • Email
  • Web
  • First Name
  • Last Name
  • Company
  • Address
  • City
  • Country
  • State/Province
  • ZIP/Postal Code
  • Phone 1
  • Phone 2
  • Email
  • Web
  • First Name
  • Last Name
  • Company
  • Address
  • City
  • Country
  • State/Province
  • ZIP/Postal Code
  • Phone 1
  • Phone 2
  • Email
  • Web
  • First Name
  • Last Name
  • Company
  • Address
  • City
  • Country
  • State/Province
  • ZIP/Postal Code
  • Phone 1
  • Phone 2
  • Email
  • Web
  • First Name
  • Last Name
  • Company
  • Address
  • City
  • Country
  • State/Province
  • ZIP/Postal Code
  • Phone 1
  • Phone 2
  • Email
  • Web
  • First Name
  • Last Name
  • Company
  • Address
  • City
  • Country
  • State/Province
  • ZIP/Postal Code
  • Phone 1
  • Phone 2
  • Email
  • Web
  • First Name
  • Last Name
  • Company
  • Address
  • City
  • Country
  • State/Province
  • ZIP/Postal Code
  • Phone 1
  • Phone 2
  • Email
  • Web

RTL

  • نام
  • نام خانوادگی
  • شرکت
  • آدرس
  • شهر
  • کشور
  • استان
  • کد پستی
  • تلفن 1
  • تلفن 2
  • پست الکترونیک
  • آدرس وب
  • نام
  • نام خانوادگی
  • شرکت
  • آدرس
  • شهر
  • کشور
  • استان
  • کد پستی
  • تلفن 1
  • تلفن 2
  • پست الکترونیک
  • آدرس وب
  • نام
  • نام خانوادگی
  • شرکت
  • آدرس
  • شهر
  • کشور
  • استان
  • کد پستی
  • تلفن 1
  • تلفن 2
  • پست الکترونیک
  • آدرس وب
  • نام
  • نام خانوادگی
  • شرکت
  • آدرس
  • شهر
  • کشور
  • استان
  • کد پستی
  • تلفن 1
  • تلفن 2
  • پست الکترونیک
  • آدرس وب
  • نام
  • نام خانوادگی
  • شرکت
  • آدرس
  • شهر
  • کشور
  • استان
  • کد پستی
  • تلفن 1
  • تلفن 2
  • پست الکترونیک
  • آدرس وب
  • نام
  • نام خانوادگی
  • شرکت
  • آدرس
  • شهر
  • کشور
  • استان
  • کد پستی
  • تلفن 1
  • تلفن 2
  • پست الکترونیک
  • آدرس وب
  • نام
  • نام خانوادگی
  • شرکت
  • آدرس
  • شهر
  • کشور
  • استان
  • کد پستی
  • تلفن 1
  • تلفن 2
  • پست الکترونیک
  • آدرس وب
  • نام
  • نام خانوادگی
  • شرکت
  • آدرس
  • شهر
  • کشور
  • استان
  • کد پستی
  • تلفن 1
  • تلفن 2
  • پست الکترونیک
  • آدرس وب