标签: dropdown

我正在使用react-native-select-dropdown并静态设置数据数组，但不知道如何使用id从api动态设置数据数组

代码 ：

  const countries = ["Egypt", "Canada", "Australia", "Ireland"]

  <SelectDropdown
  data={countries}
  // defaultValueByIndex={1}
  // defaultValue={'Egypt'}
  onSelect={(selectedItem, index) => {
    console.log(selectedItem, index);
  }}
  defaultButtonText={"Select"}
  buttonTextAfterSelection={(selectedItem, index) => {
    return selectedItem;
  }}
  rowTextForSelection={(item, index) => {
    return item;
  }}
/>

如何动态设置国家数组列表，我需要所选项目的标题和 ID，从 api 获取数据是：

const countries = [
  {namd: 'Egypt', id: 1},
  {namd: 'Canada', id: 2},
  {namd: 'Australia', id: 3},
  {namd: 'Ireland', id: 4},
];

我希望你一切都好。我有一个小问题，我想根据另一个 DropdownButton 的值动态更改 DropdownButton 的值。

好吧，我将解释我的处境以及问题所在：

首先我有一个包含 3 个元素的StudyCycle列表；

final _studyCycles = const <StudyCycle>[
    StudyCycle(cycle: Cycles.elementary, classrooms: <ClassroomsLevels>[
      ClassroomsLevels.cp,
      ClassroomsLevels.ce1,
      ClassroomsLevels.ce2,
      ClassroomsLevels.cm1,
      ClassroomsLevels.cm2,
    ]),
    StudyCycle(cycle: Cycles.primary, classrooms: <ClassroomsLevels>[
      ClassroomsLevels.sixth,
      ClassroomsLevels.fifth,
      ClassroomsLevels.fourth,
      ClassroomsLevels.third,
    ]),
    StudyCycle(cycle: Cycles.secondary, classrooms: <ClassroomsLevels>[
      ClassroomsLevels.second,
      ClassroomsLevels.first,
      ClassroomsLevels.terminal,
    ])
  ];

此StudyCycle列表用于构建第一个 DropdownButton

 DropdownButton<StudyCycle>(
          value: _selectedStudyCycle,
          items: List<DropdownMenuItem<StudyCycle>>.generate(
            _studyCycles.length,
            (index) => DropdownMenuItem<StudyCycle>(
              value: _studyCycles[index],
              child: Text(_studyCycles[index].cycle.toString()),
            ),
          ),
          hint: const Text('Your Study Cycle'),
          onChanged: (StudyCycle? studyCycle) {
            if (studyCycle != _selectedStudyCycle) {
              if (_selectedStudyCycle != null) …

我正在 nextjs 应用程序中工作。我只是想制作一个下拉菜单。

这是我的完整代码：

import React from 'react'
import Link from 'next/link'
import styles from './header.module.css'

const Header = () => {
    /* When the user clicks on the button,
toggle between hiding and showing the dropdown content */
    const myFunction =()=>{
        document.getElementById(styles.myDropdown).classList.toggle("show");
    }

    // Close the dropdown menu if the user clicks outside of it
    if (typeof window !== "undefined") {
        window.onclick = function (event) {
            if (!event.target.matches('.dropbtn')) {
                var dropdowns = document.getElementsByClassName("dropdown-content");
                var i;
                for (i = 0; …

如何将微调器中的第一个值(默认值)设置为空.意味着,直到用户从列表中选择值,微调器才会没有值.我在下面试过

list.add(""); 

但是,它不会起作用.以下是我的代码:

if(values.contains("options")){
       spinner.setOnItemSelectedListener(MyClass.this);
       List<String> list = new ArrayList<String>();
       list.add("");
       list.add("Test");
       list.add("Working");
       ArrayAdapter<String> adapter = new ArrayAdapter<String>(mContext, android.R.layout.simple_spinner_item, list) {};

      adapter.setDropDownViewResource(R.layout.custom_spinner_list);
      spinner.setAdapter(adapter);     
   }
 }

我有一个简单计算器的以下代码.代码工作正常,但我希望下拉列表中的值在提交后保留在那里.我该怎么做？基本上,我希望运算符在计算完成后保持选中状态.目前,它只显示一个'+',即使总和是25/5.

<?php 

$number1 = $_POST['number1'];
$number2 = $_POST['number2'];
$operation = $_POST['operator'];


Switch ($operation) {
case 'add': $answer = $number1 + $number2;
break;
case 'minus': $answer = $number1 - $number2; 
break;
case 'divide': $answer = $number1 / $number2; 
break;
case 'multiply': $answer = $number1 * $number2;
break;
}


?>

<form name='calculator' method='post' action=''>
<table>
    <tr>
        <td>
            <input name="number1" type="text" value="<?php     i    if(isset($_POST['number1'])) { echo  htmlentities($_POST['number1']);}?>"         />
        </td>
        <td>
            <select name="operator">
                <option value="add">+</option>
                <option value="minus">-</option>
                <option value="divide">/</option>
                <option value="multiply">x</option>
            </select>
        </td>
        <td> …

我尝试过很多方法:

选择字段角2的验证

如何将所需的验证应用于角度2的下拉列表

这有助于我在下拉列表中添加验证.但我有一个问题,验证运行正常但当我点击提交按钮时,如果下拉值有效或无效,则提交表格.如果下拉列表的值为"select",我不想提交表单.

这是我的HTML代码:

<form name="form" (ngSubmit)="f.form.valid && SaveSymbol()" #f="ngForm" novalidate>
       <div class="form-group" [ngClass]="{ 'has-error': f.submitted && !DisplayGroupID.valid && !manageSymbolViewModel.DisplayGroupID }"> 
          <label for="DisplayGroupID">Display Group</label>
          <select class="form-control" name="manageSymbolViewModel.DisplayGroupID" #DisplayGroupID id="manageSymbolViewModel.DisplayGroupID" [(ngModel)]="manageSymbolViewModel.DisplayGroupID" required>
             <option value="0" selected disabled>Select</option>
             <option *ngFor="let group of result.DisplayGroups" value={{group.DisplayGroupId}}>
                  {{group.DisplayGroup}}
              </option>
          </select>
          <div *ngIf="f.submitted && !DisplayGroupID.valid && !manageSymbolViewModel.DisplayGroupID" class="help-block">Display Group is required</div>
      </div>

 <div class="form-group">
      <button [disabled]="loading" type="submit" class="btn btn primary">Save</button>
       <a [routerLink]="['/login']" class="btn btn-link">Cancel</a>
 </div>
</form>

这是组件代码:

SaveSymbol() {
       this.manageSymbolService.Save(this.manageSymbolViewModel).subscribe(data => {
                    debugger;

                },
                    error => …

我想在primeng下拉列表中获取之前选择的值.

<p-dropdown [options]="options" [filter]="true" [(ngModel)]="selectedType" (onChange)="onSelectType($event)" formControlName="alertType"></p-dropdown>

在更改事件时,我想使用api检查所选类型是否有效,但是如果它无效则需要还原.由于我使用的是ngModel,因此只要下拉列值发生更改,selectedType的值就会发生变化.

那么我怎样才能获得之前选择的值？

查看代码显示客户端下拉菜单 -

<select ng-model="employee.DeptId" class="form-control ng-pristine ng-invalid ng-invalid-required" required="">
<option disabled="disabled" value="">---Please Select---</option>
 <option ng-repeat="Dep in ShowDep" value="{{Dep.Id}}">{{Dep.Name}}</option>
</select>

编辑案例中的角度代码----

$scope.EmployeeEdit = function (rowNumber) {
args = employeeArr[rowNumber];
$scope.employee.DeptId = args.DeptId;
 }

有什么方法可以强制priming下拉菜单在顶部显示选项，而不是下拉菜单，因为下拉菜单会在内部滚动。

有人可以帮我DropdownField在SilverStripe 3 中将其设置为默认值吗？

目前这是我的代码:

DropdownField::create(
    'HowHear',
    'How did you hear of this job?',
    array(
        'Indeed' => 'Indeed',
        'Caterer' => 'Caterer',
        'Gumtree' => 'Gumtree',
        'Word of mouth' => 'Word of mouth',
        'Other' => 'Other',
    )
)->addExtraClass('full-width'),