AJAX 動態加載后台數據 綁定select


 <select id="select">
 <!--下拉框數據動態加載-->
 </select>

 js:(使用jquery) 

$(document).ready(function () { //此處頁面打開即請求api
                $.ajax({
                    type:'GET',
                    url:"{:url('Room/houseData')}",
                    contentType: "application/json; charset=utf-8",
                    async : true ,
                    dataType: "json",
                    success: function (date) {
                        var optionstring = "";
                        for (var j = 0; j < date.length;j++) {
                            console.log(date[j].house_name);
                            console.log(date[j].id);
                            optionstring += "<option value=\"" + date[j].id + "\" >" +date[j].house_name+" " + "</option>";
                            $("#select").html("<option value='0'>請選擇...</option> "+optionstring);
                        }
                    },

                    error: function (msg) {
                        layer.msg('數據出錯了!!');
                    }
                });
            });

  頁面效果:


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM