Question

如何通过在文本框中键入非唯一项来唯一标识记录。例如，使用自动填充我键入学生姓名，它建议任何三个名称，现在我应该如何确定哪一个是正确的。我在数据库表中有学生ID，但我想让它更加用户友好，所以我不想在前端使用id。

Answer 1

Drupal通过将id附加到值来解决这个问题所以它看起来像：James Kirk [10] 然后通过拉动最后一个[]对的内容来解析该值。但显然这不是你想要做的。它很脏，对用户来说看起来不太好。

我通过使用带有隐藏表单项的jquery自动完成控件来解决此问题，该隐藏表单项存储id和存储用户可读值的可见表单项。

使用jquery ui完全控制html

<div class="form-item type-autocomplete_ajax name-employer">
    <label for="employer"> Employer          </label>
    <input type="autocomplete_ajax" name="employer-label" maxlength="60" size="30" value="EAS" class="ui-autocomplete-input" autocomplete="off">
    <input type="hidden" name="employer" value="14">
    <div class="description">Begin typing to see your options. You may add your own value if the desired value is not available</div>
    <script>
      $('.name-employer input[name="employer-label"]').autocomplete({source: function( request, response )
    {
      var form_id = "patient_info_form";
      var form_item = "employer";
      $.ajax({
        url: "/ajax/options?term=" + request.term,
        dataType:"json"
      })
        .done(function(list)
        {
          $(".ui-autocomplete-loading").removeClass("ui-autocomplete-loading");
          response(list);
        })
        .fail(function()
        {
          $(".ui-autocomplete-loading").removeClass("ui-autocomplete-loading");
          list = [{"label": "No results found", "value": 0, "id": 0}];
          response(list);
        })
    },select: function (event, ui)
    {
      if (ui.item.id != 0)
      {
        $('.name-employer input[name="employer-label"]').val(ui.item.label);
        $('.name-employer input[name="employer"]').val(ui.item.value);
      }
      return false;
    }, focus: function (event, ui) {
      if (event.keyCode == null)
      {
        return false;
      }
      $('.name-employer input[name="employer-label"]').val(ui.item.label);
      return false;
    }});$('.name-employer input[name="employer-label"]').focusout(function() {
      if ($(this).val() == "")
      {
        $('.name-employer input[name="employer"]').val("");
      }
    });    </script>
  </div>

注意两个输入。第一个是jquery ui构建的autocoplete。 xecond只是一个隐藏的输入，用于存储＆＃34;键＆＃34;用户不需要查看的唯一ID值。

然后在提交时忽略自动填充值，只检查隐藏值。

用户输入学生姓名和ajax我希望学生的所有数据都按姓名显示。用户可能不知道id，比如facebook的朋友搜索

1 个答案: