How can i get the selected Id of the DropDownMenuItem in Jetpack Compose-CodePudding

I have a drop down spinner where i am able to get the category_title . how to get selected category_id i have created a two mutableStateOf of selected title and Id .is there any other way to get the selected category id

var mSelectedText by remember { mutableStateOf("") }

var mSelectedCategoryId by remember { mutableStateOf("") }

data class

data class MainCategory(
var category_id: String? = null,
var category_name: String? = null,
var categoryImage_url: String? = null,
var category_priority:Int? = null

)

list variable

val mCategories = mainCategories.mapTo(arrayListOf()){it.category_name}

DropDownMenu

 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun MainCatDownloadContent(
   mainCategories: Categories,
    mainCategoryOnClick: (categoryId: String, categoryTitle: 
String) -> Unit,
) {
var mExpanded by remember { mutableStateOf(false) }
val mCategories = mainCategories.mapTo(arrayListOf()){it.category_name}


var mSelectedText by remember { mutableStateOf("") }

var mSelectedCategoryId by remember { mutableStateOf("") }

var mTextFieldSize by remember { mutableStateOf(Size.Zero) }

// Up Icon when expanded and down icon when collapsed
val icon = if (mExpanded)
    Icons.Filled.KeyboardArrowUp
else
    Icons.Filled.KeyboardArrowDown

Column(Modifier.padding(20.dp)) {

    OutlinedTextField(
        value = mSelectedText, onValueChange = { mSelectedText = it },
        modifier = Modifier
            .fillMaxWidth()
            .onGloballyPositioned { coordinates ->
                mTextFieldSize = coordinates.size.toSize()
            },
        readOnly = true,
        label = { Text(text = "Select MainCategory")},
        trailingIcon = {
            Icon(icon,"contentDescription",
                Modifier.clickable { mExpanded = !mExpanded })
        }
    )



        mCategories.forEach{ mainCategory ->
            DropdownMenuItem(onClick = {
                mSelectedText = mainCategory.toString()
                mExpanded = false }) {
                
                Text(text = mainCategory.toString())
            }
        }
    }

}

For ex if there is list of items like this

[MainCategory(category_id=11, category_name=Fruits, 
  categoryImage_url=https:www category_priority=1), 
MainCategory(category_id=22, category_name=Vegetable , 
  categoryImage_url=https:www, category_priority=2), 
MainCategory(category_id=33, category_name=Greens, 
  categoryImage_url=https:www, category_priority=3)

if selected item lets assume is "Fruits"! how to get its category_id which is "11" and assign to the mSelectedCategoryId variable

CodePudding user response：

You can use something different.

Add the

Finally in your case is better to use a ExposedDropdownMenuBox ExposedDropdownMenu as described in this question.

CodePudding user response：

as @Gabriele Mariotti says you need to create rememberSaveable State Just elaborating his answer

I assume mainCategories: Categories // is a List<> so State you can by

 val selectCategory by rememberSaveable {
    mutableStateOf(mainCategories)
}

Other two variables which you have

var mSelectedText by remember { mutableStateOf("") }

var mSelectedCategoryId by remember { mutableStateOf("") }

Your are missing the DropDownMenu and i assume you just need to show the categoryName and get the selected id of the drop down menu from your question you can do this way

 Column(Modifier.padding(20.dp)) {

    OutlinedTextField(
        value = mSelectedText,
        onValueChange = { mSelectedText = it },
        modifier = Modifier
            .fillMaxWidth()
            .onGloballyPositioned { coordinates ->
                mTextFieldSize = coordinates.size.toSize()
            },
        readOnly = true,
        label = { Text(text = "Select MainCategory") },
        trailingIcon = {
            Icon(icon, "contentDescription",
                Modifier.clickable { mExpanded = !mExpanded })
        }
    )

    DropdownMenu(expanded = mExpanded,
        onDismissRequest = { mExpanded = false },
        modifier = Modifier.width(with(
            LocalDensity.current) {
            mTextFieldSize.width.toDp()
        })) {
        selectCategory.forEach {
            DropdownMenuItem(onClick = {
                mSelectedText = it.category_name.toString()
                mSelectedCategoryId = it.category_id.toString()
                mExpanded = false
            }) {

                Text(text = it.category_name.toString())
            }
        }
    }
}

Log.i(TAG,"Get the category_name: $mSelectedText and category_id: $mSelectedCategoryId" )