Réaliser l'effet de lien entre la zone de saisie et la zone déroulante

Cette fois, je vais vous apporter les précautions pour obtenir l'effet de liaison entre la zone de saisie et la zone déroulante Ce qui suit est un cas pratique, jetons un coup d'oeil.

Comme indiqué sur l'image :

code html

<tr>
 <th scope="row">奖励类型：</th>
 <td><input value="" type="text" name="item" id="reward" style="width: 60px;height: 20px;" placeholder="输入关键字" />
  <select name="reward_id" id="reward_id"> 
   <option value="">---请选择---</option>
   {foreach $reward as $value}
   <option value="{$value[&#39;material_id&#39;]}">{$value['material_name']}</option>
   {/foreach}
  </select>
 </td>
</tr>

Code JQuery

<script type="text/javascript">
 $('#reward').bind('input propertychange', function() {reward();});
 function reward()
 {
  var search = $("#reward").val();
  $.ajax({ 
   type:"get", 
   url:"/mall/config_commodity_info/search_commodity_info", 
   data:{search:search}, 
   success:function(select){ 
     var reward_id = $("#reward_id"); 
     if (select) {
     $("option",reward_id).remove();
     var obj = JSON.parse(select);
     for (var key in obj) {
      var option = "<option value=&#39;"+key+"&#39;>"+obj[key]+"</option>"; 
      reward_id.append(option); 
     }
     } 
   } 
 });
 } 
</script>

Code PHP

public function add_alms()
{
 $reward = $this->materials->selReward();
 $this->assign('reward',$reward);
 return $this->fetch();
}
public function do_add_alms()
{
 $data = Request::instance()->param();
 $this->alms->addAlms($data);
}

Je crois que vous avez lisez le cas dans cet article Après avoir maîtrisé la méthode, veuillez prêter attention aux autres articles connexes sur le site Web php chinois pour un contenu plus passionnant !

Lecture recommandée :

Comment réaliser une acquisition dynamique des données de la liste déroulante Jquery

Ajax et Jquery combinés avec la base de données à implémenter Lien secondaire de la liste déroulante

jQuery implémente la fonction de couche infinie récursive

jquery obtient le valeur et texte de la balise select

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!