2009-09-30 2 views
7

В настоящее время у меня есть раскрывающийся список данных на моем веб-сайте ASP.Net C# 2.0, в котором содержится около 400 элементов. Я хочу заменить его чем-то похожим на текстовое поле в google search, в котором вы вводите письмо, и только записи, начинающиеся с этих букв, появляются вверхТекстовое поле с раскрывающимися предложениями

Что такое хороший способ его реализации? Существуют ли уже существующие элементы управления, которые могут предложить любой?

ответ

1

Если они известны enrties, вы можете использовать JQuery, и на OnUpdate событие:

  1. , если это длинный список, сделайте запрос Ajax на ваш веб-сервер, получите наилучший вариант
  2. , если это короткий список, вы можете загрузить все варианты страницы и предоставить необязательные тексты без makin g запрос сервера.

Оформить заказ библиотеки JQuery для реализаций о том, как отобразить предложение.

1

В качестве дополнения к AJAX Control Toolkit для ASP.NET существует расширитель AutoComplete. Существует множество различных опций, которые вы можете установить для кеширования клиентов, интервала задержки. Просто укажите его на веб-службу или метод страницы, и уходите.

0

TextBoxValueToDropDownList

function AddNames(text) { 

     if (document.myForm.insertText.value == "") { 
      document.getElementById("insertText").style.border = "1px solid red"; 
      return false; 
     } 
     else { 
      var option = document.createElement("OPTION"); 
      option.text = text.value; 
      option.value = text.value; 
      document.getElementById("dropDownList").options.add(option); 
      document.myForm.insertText.value = ""; 
      document.getElementById("insertText").style.border = "1px solid green"; 
     } 
    } 




    <form name="myForm"> 
     <table> 
      <tr> 
       <td> 
        <input type="text" name="insertText" id="insertText" /></td> 
       <td></td> 
       <td> 
        <select name="dropDown" id="dropDownList"> 
        </select> 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <input type="button" value="Insert" id="button" onclick="AddNames(insertText);" /></td> 
      </tr> 
     </table> 
    </form> 
7

Один из способов сделать это с помощью HTML5 (для небольших наборов данных, конечно) является datalist:

<input list="users" name="users"> 
    <datalist id="users"> 
    <option value="Alice"> 
    <option value="Bob"> 
    <option value="Chuck"> 
    <option value="Chris"> 
    <option value="Duke"> 
    <option value="Emily"> 
    </datalist> 

Для больших наборов данных AJAX является лучшим способом пойти.

Смежные вопросы