无法使用angular.js和php在下拉列表中设置值

时间:2015-10-20 12:16:18

标签: javascript php angularjs

从数据库中取出后,将数据设置为下拉选择值,我面临一点问题。我正在解释下面的代码。

  

plan.html:

<div class="input-group bmargindiv1 col-md-12">
 <span class="input-group-addon ndrftextwidth text-right" style="width:180px">Date :</span>
<datepicker date-format="MMMM d, y" date-min-limit="2010/01/01" date-max-limit="2020/01/01"button-prev='<i class="fa fa-arrow-circle-left"></i>' button-next='<i class="fa fa-arrow-circle-right"></i>'> 
<input type="text" name="birthdate" class="form-control" ng-model="date" placeholder="Add date" />
 </datepicker>
</div> 
<div class="input-group bmargindiv1 col-md-12">
<span class="input-group-addon ndrftextwidth text-right" style="width:180px">Topic :</span>
<input type="text" name="topic" class="form-control" ng-model="topic" placeholder="Add Topic" />
</div> 
<div class="input-group bmargindiv1 col-md-12">
<span class="input-group-addon ndrftextwidth text-right" style="width:180px">Section:</span>
<select id="coy" name="coy" class="form-control" ng-model="section" ng-options="sec.name for sec in listOfSection track by sec.value " >
<option value="">Select section</option>
</select>
</div>

相关的控制器文件代码如下所示。

$scope.listOfSection=[];
    $http({
        method:'GET',
        url:"php/userplan/getSectionData.php",
        headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
    }).then(function successCallback(response){
        angular.forEach(response.data,function(obj2){
            var data={'name':obj2.section_name,'value':obj2.section_id};
            $scope.listOfSection.push(data);
        });
    },function errorCallback(response) {
    });
$http({
            method:'POST',
            url:"php/userplan/editPlanData.php",
            data:planid,
            headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
        }).then(function successCallback(response){
            $scope.date=response.data[0].date;
            $scope.topic=response.data[0].topic;
            $scope.section=response.data[0].section_id;
            $scope.buttonName="Update";
            $scope.showCancel =  true;
        },function errorCallback(response) {
        });

此处response.data[0].section_id应在下拉菜单中设置为值,并且应显示相应的名称。我尝试添加$scope.section.value=response.data[0].section_id,但它给了我错误。我的要求是section_id应设置为下拉值和相应的名称应该显示。请帮我解决这个问题。

1 个答案:

答案 0 :(得分:0)

you can use like this



<select ng-model="ContentAdditionalInfoModel.AdditionalInfoId"  class="form-control" ng-required="true"
                                                ng-options="item.AdditionalInfoId as item.AdditionalInfoName for item in  AdditionalInfoList">
                                            <option value="" selected="selected">Select</option>
                                        </select>

here AdditionalInfoList come from your database