به تنظیمات پیشرفته کنترل(Advanced Settings) بروید و درقسمت "Store Client ID" گزینه YESرا انتخاب کنید.
سپس، مقادیر را به شکل زیر پیکربندی کنید:
-برای تکست باکس(Textbox): مقدارautocomplete textbox را ایجاد کنید.
-برای Dropdown: مقدار autocomplete dropdown را ایجاد کنید.
با این پیکربندی (تنظیمات)، کنترل ها با استفاده از جاوا اسکریپت قابل دسترسی هستند.
این کد را در site assets folder آپلود کنید.
- // JavaScript source code
- (function ($) {
- //Inputs Dropdown ClientID, Textbox client ID, characters length to perform search
- $.dropdownAutocomplete = function (dropDown1Id, textboxId, SearchTextLength) {
- //Declare Textbox
- var textbox = $("#" + textboxId);
- //Declare Dropdown
- var dropDown1 = $("#" + dropDown1Id.replace("_hid", ""));
- //Enabling textbox with Autocomplete
- textbox.autocomplete({
- //Source can be an Array, String or Function
- //Here we are using function as the source type to fetch the values from the dropdown
- source: function (request, response) {
- autocompleteVals = [];
- dropDown1 = $("#" + dropDown1Id.replace("_hid", ""));
- // Here data will be filtered based on the text coming through the re-quest
- $(dropDown1).children().each(function () {
- if ($(this).text() != "(None)" && $(this).text().toLowerCase().indexOf(request.term.toLowerCase()) >= 0) {
- autocompleteVals.push($(this).text());
- }
- });
- response(autocompleteVals);
- },
- //The minimum number of characters a user must type before a search is per-formed
- minLength: SearchTextLength,
- //Triggered when an item is selected from the menu, now same item will be selected in the dropdown which is a connected field
- select: function (event, ui) {
- var fieldOption = $("#" + dropDown1Id.replace("_hid", "") + " op-tion").filter(function () {
- return $(this).html() == ui.item.value;
- });
- $(fieldOption).attr("selected", true);
- $(dropDown1).change();
- }
- });
- }
- })(NWF$)
به ترتیب به آدرس زیر بروید: Nintex Form Settings—Advanced --Custom Javascript Included
در اینجا، url فایلِ کاملِ JS که دربخش Site Assists آپلود شده است را ایجاد کنید.
در همان صفحه، به قسمت Custom JavaScript بروید و کد زیر را آنجا کپی کنید:
- NWF$(document).ready(function() {
- NWF$.dropdownAutocomplete(autocompleteDropDown, autocompleteTextbox, 1);
- });
این کار تابع autocomplete را با 3 پارامتر ارائه شده، فراخوانی میکند.