2016-03-23 17 views
0

User,InstructorおよびPlayerという3つのオプションを持つdropdownがあります。データベースからの値に基づいて選択されたドロップダウンで値を設定する方法

今私はlist of all usersをデータベースから表示するtableを持っています。

usernamefirstnamelastname「変更権限」の列。この変更権限の列には、 'user'、 'player'、 'instructor'の3つのオプションを持つdropdownがあり、保存ボタンもあります。

ここでは、のauthorityを自動選択するようにドロップダウンしたいと考えています。 EXのために

A人はPlayerauthorityを持っている場合B人は、彼が選択したインストラクターと対応するドロップダウンリストを持っている必要がありauthorityinstructorとして持っている場合 と を選択して、ドロップダウンは、プレーヤーが必要です。

誰でも私にこれを手伝ってもらえますか?ありがとう。

初期1は

 <select > 

     <option value="${user[1]}" selected> 
<c:out value="${user[1]}" /></option> // this gives the current authority of person from database 
       <option value="1"> User </option> 
     <option value="2"> Player </option> 
     <option value="3"> Instructor </option> 
       </select> 

だから、私は、これはあなたが探しているものだと思います

<select> 
<option value="1" <c:if test="${user[1] == User}"> 
         </c:if>>User</option> 
<option value="2" <c:if test="${user[1] == Player}"> 
        </c:if>> Player </option> 
<option value="3" <c:if test="${user[1] == Instructor}"> 
        </c:if>> Instructor</option> 
+1

は、あなたがこれまでにしようとしているかを示す... PHPとMySQLの例を行うことができます – Moumit

答えて

0

のようなものを試してみました。ここで

document.getElementById('role').value = 'player'; 
0

は、多くの一例は、以下のとおりです。あなたは、デフォルトで<select>ドロップダウンで特定のオプションを選択したい場合は、単にJavaScriptでそれを設定すること<option>

<select id="role"> 
    <option value="user">User</option> 
    <option value="instructor">Instructor</option> 
    <option value="player" selected>Player</option><!-- selected by default --> 
</select> 

selected属性を追加自動的にデータベースからドロップダウン値を選択します。ここで

public List<DefaultDropDownListModel> LoadTurnAroundTimesTypes(ESAMPR_Entities db) 
    { 
     List<DefaultDropDownListModel> list = new List<DefaultDropDownListModel>(); 

     var qry = db.AR_TAT.OrderBy(x => x.SEQUENCE); 
     foreach(var i in qry) 
     { 
      DefaultDropDownListModel model = new DefaultDropDownListModel(); 
      model.Value = i.AR_TAT_NUM; 
      model.Name = i.AR_TAT_NUM; 
      model.Selected = i.DEFAULT_SELECTION == "1" ? true : false; 
      list.Add(model); 
     } 

     return list; 
    } 
<select id="AR_TAT" class="form-control" name="arvm.AR_TAT"> 
<option value=""></option> 
@foreach (var item in Model.TurnAroundTypes) 
{ 
    if (item.Selected) 
    { 
     <option value="@item.Value" selected>@item.Name</option> 
    } 
    else 
    { 
     <option value="@item.Value">@item.Name</option> 
    } 
} 

0

角度使って作業溶液。サーバーにREST APIを提供するだけです。私は

var app = angular.module('app', []) 
 
     .controller('MainCtrl', function($scope, $http) { 
 
     // you should get users from server 
 
     /*$http.get('yourServerApiUrl').then(function(responseFromApi) { 
 
      $scope.simulatedUser = responseFromApi; 
 
     });*/ 
 
     // lets just simulate them 
 
     $scope.simulatedUsers = [{ 
 
      username: 'username1', 
 
      firstname: 'John', 
 
      lastname: 'Bon', 
 
      autority: 'Player' 
 
     }, { 
 
      username: 'user2', 
 
      firstname: 'Alex', 
 
      lastname: 'Noi', 
 
      autority: 'User' 
 
     }, { 
 
      username: 'username3', 
 
      firstname: 'Fred', 
 
      lastname: 'Mer', 
 
      autority: 'Player' 
 
     }, { 
 
      username: 'username4', 
 
      firstname: 'Gal', 
 
      lastname: 'Ban', 
 
      autority: 'User' 
 
     }, { 
 
      username: 'user5', 
 
      firstname: 'Va', 
 
      lastname: 'Ben', 
 
      autority: 'Instructor' 
 
     }]; 
 
     // array of possible autorities 
 
     $scope.autorities = ['User', 'Player', 'Instructor']; 
 

 
     //submit to the server 
 
     $scope.submit = function() { 
 
      //$http.post('yourServerApiUrl', $scope.simulatedUsers); 
 
      alert('users saved'); 
 
     }; 
 
     });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<!DOCTYPE html> 
 
<html ng-app="app"> 
 
<head> 
 
    <link data-require="[email protected]" data-semver="3.3.6" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css" /> 
 
</head> 
 
<body ng-controller="MainCtrl"> 
 
    <form ng-submit='submit()'> 
 
    <table class="table table-responsive table-hover"> 
 
     <thead> 
 
     <tr> 
 
      <th>username</th> 
 
      <th>firstname</th> 
 
      <th>lastname</th> 
 
      <th>autority</th> 
 
     </tr> 
 
     </thead> 
 
     <tbody> 
 
     <tr ng-repeat="u in simulatedUsers"> 
 
      <td>{{ u.username }}</td> 
 
      <td>{{ u.firstname }}</td> 
 
      <td>{{ u.lastname }}</td> 
 
      <td> 
 
      <select class='form-control' ng-model="u.autority" ng-options="o for o in autorities"></select> 
 
      </td> 
 
     </tr> 
 
     </tbody> 
 
    </table> 
 
    <button class='btn btn-success'>Save</button> 
 
    </form> 
 
</body> 
 
</html>

関連する問題