获取MagicSuggest输入的值

Question

我有一个带有一些值的输入，我试图获得它的值。当我点击“有效”按钮时，它会显示“未定义”。这是我的jsfiddle：http://jsfiddle.net/pv2we0x3/1/

$(function() {
  $('.suggest-tag').magicSuggest({
    data: [{
      "Id": 1,
      "Name": "hello"
    }, {
      "Id": 2,
      "Name": "world"
    }, {
      "Id": 3,
      "Name": "no"
    }],
    valueField: 'Id',
    displayField: 'Name',
  });

  $('.btn').click(function() {
    alert($('.suggest-tag').serialize());
  })
});

Answer 1

根据documentation for MagicSuggest，您需要在您创建的库的实例上调用getValue()，以获取选定的标签值：

​

$(function() {
  var ms = $('.suggest-tag').magicSuggest({
    data: [{
      "Id": 1,
      "Name": "hello"
    }, {
      "Id": 2,
      "Name": "world"
    }, {
      "Id": 3,
      "Name": "no"
    }],
    valueField: 'Id',
    displayField: 'Name',
  });

  $('.btn').click(function() {
    console.log(ms.getValue());
  })
});

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/magicsuggest/2.1.4/magicsuggest.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/magicsuggest/2.1.4/magicsuggest.js"></script>

<form action="subscribe.php" method="post">
  <div class="form-group">
    <label>Tags</label>
    <div class="suggest-tag" value="[1,2,3]"></div>
  </div>
</form>

<input type="button" class="btn" value="Valid" />

​