layui 修改信息时下拉列表无法渲染

html部分

  <div class="layui-inline" id="typeId">
	       <label class="layui-form-label layui-bg-green">所属项目(优化):</label>
			 <div class="layui-input-block layui-form"">
				     <select name="typeName" id="typeBox" lay-verify="required"   >
                  </select>
			</div> 
			</div>



js部分

//动态返回下拉选项
                       var pid=edit.b_item_id;
               		   var option ="<option value ='0'>请选择项目</option>";
               		   $.post("ItemInfo.htm?action=getAllPage&viewName=ItemInfo",function(data){
               			   for(i=0;i<data.data.length;i++){
               				  option +="<option value= '"+data.data[i].item_id+"' " ;
               		          if(data.data[i].item_id==pid){
               		        	  option+="selected";
               		          }
               				   option+=">"+data.data[i].item_name+"</option>";
               				  $('#typeBox').append(option);
               			   }
               			   alert("---选项---"+option)
               			   
               			  form.render('select');//重新渲染select
               			 //form.render();
               		   },"json");
                    
                }

 

$('#typeBox').append(option);这句代码移到for循环外面