'Why does my filter using DropDownMenu only work the first time and how can I get it to work consistently?
I am trying to build a filter using a dynamically populated DropDownMenu that gets "categories" from an API endpoint and then upon one of these categories being selected, filters and only displays the organizations that fall into the selected category. This list of organizations is built using either OrganizationListWidget or OrganizationByCategoryListWidget depending on whether the user has currently selected some category or not yet, respectively. The issue is, this only works successfully the first time a user picks a category, beyond this, anytime the user picks a different category from the dropdown the organization list remains unchanged and I am unsure why this is occurring. I am brand new to Flutter so I apologize for poor code quality/if this is trivial. If anyone could explain why this is happening and a possible fix it would be much appreciated.
Edit: The API is working, the organizations initially load in and build into the list fine, and they are filtered correctly the first time a category is selected.
import 'package:flutter/material.dart';
import 'package:myteam_app/categoryform.dart';
import 'package:myteam_app/screens/organization_form.dart';
import 'package:myteam_app/models/organization.dart';
import 'package:myteam_app/resources/size_resource.dart';
import 'package:myteam_app/utility/myteam_event_listener.dart';
import 'package:myteam_app/widgets/myteam_screen.dart';
import 'package:myteam_app/widgets/myteam_search_bar.dart';
import 'package:myteam_app/widgets/organization_by_category_list_widget.dart';
import 'package:myteam_app/widgets/organization_list_widget.dart';
import 'package:myteam_app/api/myteam/api.dart';
/// HomeScreen is the home page or starting page of the app when the user is logged in
///
class HomeScreen extends StatefulWidget {
@override
_HomeScreenState createState() => _HomeScreenState();
}
class _HomeScreenState extends State<HomeScreen> {
String _currentSelection = "";
static const String ADD_ORGANIZATION_CHOICE = 'Add Organization';
static const String ADD_CATEGORY_CHOICE = 'Add Category';
//var widg = OrganizationByCategoryListWidget(_currentSelection);
// reference: how to programmatically open drawer https://stackoverflow.com/a/57748219/17836168
final GlobalKey<ScaffoldState> _key = GlobalKey();
final List<String> items = [ADD_ORGANIZATION_CHOICE, ADD_CATEGORY_CHOICE];
final Future<List<String>> categories = API().getCategories();
final myteamEventListener<void, void> onDrawerOpenEvent =
myteamEventListener();
@override
void initState() {
super.initState();
}
@override
Widget build(BuildContext context) => myteamScreen(
key: _key,
onOpenDrawerEvent: onDrawerOpenEvent,
body: Column(
// padding: EdgeInsets.symmetric(vertical: 30.0),
children: <Widget>[
myteamSearchBar(),
Padding(
padding: const EdgeInsets.symmetric(
horizontal: SizeResource.standardMargin,
vertical: SizeResource.smallStandardMargin,
),
child: DropdownButton<String>(
hint: Text("Add..."),
items: items.map(buildMenuItem).toList(),
onChanged: (value) {
switch (value) {
case ADD_ORGANIZATION_CHOICE:
{
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => OrganizationForm()),
);
break;
}
case ADD_CATEGORY_CHOICE:
{
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => CategoryForm()),
);
break;
}
}
},
),
),
FutureBuilder<List<String>>(
future: API().getCategories(),
builder: (context, snapshot) {
if (snapshot.hasData) {
//print("we have called anew.");
//print(snapshot.data);
}
return snapshot.hasData
? Padding(
padding: const EdgeInsets.symmetric(
horizontal: SizeResource.standardMargin,
vertical: SizeResource.smallStandardMargin,
),
child: DropdownButton<String>(
hint: Text("Select a category"),
items: snapshot.data?.map((item) {
return DropdownMenuItem<String>(
value: item, child: Text(item));
}).toList(),
onChanged: (value) {
setState(() {
print(
"cur selection is + " + _currentSelection);
_currentSelection = value.toString();
//status += 1;
//print(_currentSelection);
//OrganizationByCategoryListWidget(
// _currentSelection);
});
},
value: _currentSelection == ""
? null
: _currentSelection,
))
: Padding(
padding: const EdgeInsets.symmetric(
horizontal: SizeResource.standardMargin,
vertical: SizeResource.smallStandardMargin,
),
child: DropdownButton<String>(
hint: Text("Select a category"),
items: snapshot.data?.map((item) {
return DropdownMenuItem<String>(
value: item, child: Text(item));
}).toList(),
onChanged: (value) {
setState(() {
//print("ok");
_currentSelection = value.toString();
//status += 1;
//OrganizationByCategoryListWidget(
//_currentSelection);
});
},
value: _currentSelection,
));
}),
_currentSelection == ""
? OrganizationListWidget()
: OrganizationByCategoryListWidget(
_currentSelection, UniqueKey())
// homeContent(),
],
),
);
Widget createCard(Organization organization) {
return Card(
margin: const EdgeInsets.all(SizeResource.cardMargin),
child: Padding(
padding: const EdgeInsets.all(SizeResource.cardInnerPadding),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(organization.name),
Text("Description"),
],
),
));
}
DropdownMenuItem<String> buildMenuItem(String item) => DropdownMenuItem(
value: item,
child: Text(
item,
style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20),
),
);
}
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
