Maison > interface Web > js tutoriel > le corps du texte

Introduction détaillée à l'utilisation du plugin de suggestion d'amorçage de contrôle JS

黄舟
Libérer: 2017-03-25 14:18:01
original
2929 Les gens l'ont consulté

Cet article présente principalement comment utiliser le plugin JS control bootstrap suggest, qui a une certaine valeur de référence. Les amis intéressés peuvent s'y référer

Cet article est partagé avec tout le monde bootstrap-suggest. -plugin plug-in, il s'agit d'un simple contrôle d'invite d'édition pour votre référence. Le contenu spécifique est le suivant

adresse du plug-in bootstrap-suggest-plugin

.

La page est telle que montrée ci-dessous, en utilisant ce contrôle

<p class="form-group">
          <label class="col-xs-3 text-right control-label">库管员:</label>
          <p class="col-xs-9">
            <p class="input-group">
              <input type="text" class="form-control no-padding" id="keeperUserName" value="${keeperUserName}" />
              <p class="input-group-btn" style="width:1px;">
                <ul class="dropdown-menu dropdown-menu-right" role="menu"></ul>
              </p>
        </p>
    </p>
</p>
Copier après la connexion

Les deux champs keeperUserName et keeperUser sont utilisés ici côté js. Parmi eux, keeperUser est l'ID utilisé pour enregistrer les données utilisateur, car la base de données enregistrée par de nombreux formulaires contient l'ID des données, pas la valeur d'affichage des données.

 $(&#39;#keeperUserName&#39;).bsSuggest({
      url:ctx+&#39;/fontalUser/find?filter_likes_name=&#39;,
      getDataMethod:&#39;url&#39;,
      effectiveFields:[&#39;username&#39;,&#39;name&#39;,&#39;phone&#39;],
      effectiveFieldsAlias:{username:&#39;用户账号&#39;,name:&#39;姓名&#39;,phone:&#39;手机号&#39;},
      showHeader:true,
      allowNoKeyword:false,
      multiWord:false,
      idField:&#39;id&#39;,
      keyField:&#39;name&#39;
    }).on(&#39;onSetSelectValue&#39;, function (e, keyword, data) {
      $(&#39;#keeperUser&#39;).val(data.id);
    });
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal