1

I have a dropdown which has three options User, Instructor and Player.

Now i have a table which displays the list of all users from the database.

The username, firstname, lastname and a 'change authority' column. This change authority column has the dropdown with three options 'user', 'player' and 'instructor' and also a save button are present.

Now i want to have the drop down to auto select the authority of it's user.

For ex: if A person has authority of Player the dropdown should have player as selected and if B person has authority as instructor he should have the corresponding dropdown with instructor selected.

Can anyone help me with this. Thanks.

The initial one was

     <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>

So, i tried something like

<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
  • 1
    show what you have tried so far Commented Mar 23, 2016 at 19:56

4 Answers 4

2

Solution to display the selected drop-box : code below where $dispatched is the value got from the database

<select name="dispatched">
 <option></option>
 <option value="YES"<?php if($dispatched=="YES"){ echo'selected="selected"';}>>YES</option>
 <option value="NO"<?php if($dispatched=="NO"){ echo'selected="selected"';}?>>NO</option>
</select>
Sign up to request clarification or add additional context in comments.

Comments

0

I think this is what you're looking for. If you want to select a specific option in a <select> dropdown by default, just add the selected attribute to that <option>

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

To set it in JavaScript:

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

Comments

0

Here is one example of many to automatically select a drop down value from the database.

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>
    }
}

Comments

0

Here a working solution using angular. You just have to provide a REST api on your server. I can do an example in PHP and MySQL...

 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>

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.