How to get selected dropdown list value

ionic-v1
1

  • Hi, I am building my first app as a mobile programmer (I have a Windows C# background). I have a view which has a series of rows with three column items: a label, a pre-populated dropdown box and an adjacent textbox. The textbox should only be enabled if ‘Other’ is selected in the dropdown box. Here’s one of the rows:

div class="col col-30">Placement:</div>
                        <div class="col col-30">
                            <select ng-model="SelectedItem.Placements" ng-options="placement as placement.Title for placement in Placements"></select>
                        </div>
                        <input type="text"  ng-model="newMix.Placement" style="background-color:#ffd800"
                               ng-disabled="(SelectedItem.Placements !="Other")>

                    </div>
</div>

It doesn’t work. The controller has the following code to populate this dropdown box in the view:
$scope.Placements = [{ id: ‘1’, Title: ‘Tailgate’ },
{ id: ‘2’, Title: ‘Line Pump’ },
{ id: ‘3’, Title: ‘Grout Pump’ },
{ id: ‘4’, Title: ‘Boom Pump’ },
{ id: ‘5’, Title: ‘Other’ }]

The documentation suggest that I use the GetValue function in the controller to retrieve the selected value. I tried this for the above row:

$scope.GetValue = function (placement) {
var placementId = $scope.SelectedItem.Placements;
var placementName = $.grep($scope.Placements, function (placement) {
return placement.Id == placementId;
})[0].Name;
$window.alert("Selected Value: " + placementId + "\nSelected Text: " + placementName);
}
Last statement was debug – it didn’t execute.
That didn’t work either. Do I need to overload this function for each dropdown box? Do I need to wrap each row with a new ng-controller? Is it possible to get the selected value directly without using this function?
Regards,
Bob Fidelman

2

Well that didn’t show the HTML coding very well at all. I’ll try it without the left caret on each line.:
div class="row"
div class=“col col-30”>Placement:
div class=“col col-30”>
select ng-model=“SelectedItem.Placements” ng-options=“placement as placement.Title for placement in Placements”>
/div>
input type=“text” ng-model=“newMix.Placement” style=“background-color:#ffd800"
ng-disabled=”(SelectedItem.Placements !=“Other”)>

                /div>
3

Maybe it is my mobile, but I can’t read most of what you wrote there.

From my understand, [0].name shouldn’t be there. Your placement array doesn’t have name value. I think it should be title?

Second i don’t know $grep but i assume it selects the row or array with the placementid. But why would you use [0]?

4

I don’t know $.grep either! I copied the coding from a different source… This was my first post — I will read up on how to post a better one and resubmit. Thanks for responding.
Bob F.

5

no problem :D. could I have a look at the link you used please?

6

OK, I found the solution—all in HTML.

<div class="row">
   <div class="col col-30">Placement:</div>
   <div class="col col-30">
           <select ng-model="Placement" ng-options="placement as                placement.Title for placement in Placements"></select>
   </div>
   <input type="text" ng-model="PlacementText" style="background-color: lightgrey" ng-hide="Placement.Title !='Other'" />
   </div>