我正在嘗試通過(guò)開(kāi)發(fā)一個(gè)簡(jiǎn)單的項(xiàng)目來(lái)向用戶展示不同時(shí)態(tài)的動(dòng)詞變形來(lái)學(xué)習(xí) ASP Core 和 Razor。作為項(xiàng)目的一部分,我在開(kāi)始時(shí)有一個(gè)選項(xiàng)頁(yè)面,其中有幾個(gè)下拉列表(使用 HTML 選擇組件)來(lái)選擇要呈現(xiàn)的動(dòng)詞以及呈現(xiàn)它們的順序。其中一個(gè)下拉菜單(訂單選擇器)按我的預(yù)期工作,即它顯示一個(gè)值,其右側(cè)有一個(gè)下拉箭頭,單擊時(shí)打開(kāi)列表(見(jiàn)下圖)。另一個(gè)(動(dòng)詞選擇器)在一個(gè)框中顯示 4 個(gè)項(xiàng)目,列表右側(cè)有一個(gè)滾動(dòng)條,并且沒(méi)有下拉選擇器。兩者都使用相同的代碼和基礎(chǔ)數(shù)據(jù),我無(wú)法理解為什么它們的行為不同。我希望它們都表現(xiàn)得像一個(gè)下拉菜單(單行,右側(cè)有下拉選擇器)。有誰(shuí)知道我怎樣才能讓他們以同樣的方式行事?下面包含屏幕截圖和代碼段。這是兩個(gè)選擇組件的屏幕截圖。動(dòng)詞選擇器位于頂部,順序選擇器位于下方。動(dòng)詞選擇器具有以下 HTML(它構(gòu)成一組選項(xiàng)的一部分,因此具有單選輸入,但這些組件之間沒(méi)有交互。我已注釋掉單選輸入,它對(duì)選擇組件的顯示方式?jīng)]有影響):<td> <input type="radio" name="selverbs" value="sel" id="sel" onclick="javascript:topenable()" /> <label for="top">Selected verbs </label> <select name="verbs" asp-for="selectedverbs" asp-items="Model.verbs"></select></td>訂單選擇器具有以下 HTML:<td> <label>Verb order: </label> <select name="order" asp-for="selectedorder" asp-items="Model.order"></select></td>兩個(gè)選擇器都使用其中包含 SelectListItems 的列表。動(dòng)詞選擇器的數(shù)據(jù)是這樣創(chuàng)建的:public List<SelectListItem> GetVerbs(){ List<SelectListItem> results = new List<SelectListItem>(); int rank = 1; foreach (string s in collection.AsQueryable().OrderBy(doc => doc.Rank).GroupBy(doc => doc.Rank).Select(g => g.First().Infinitive)) { results.Add(new SelectListItem(s, rank.ToString(CultureInfo.CurrentCulture))); rank++; } return results;}訂單選擇器的數(shù)據(jù)生成如下:[BindProperty]public List<SelectListItem> order { get; } = new List<SelectListItem>{ new SelectListItem { Value = "1", Text = "forward" }, new SelectListItem { Value = "-1", Text = "reverse" }, new SelectListItem { Value = "0", Text = "random" }};我嘗試在動(dòng)詞選擇器上設(shè)置 size="1" ,但這沒(méi)有任何區(qū)別。該組件仍然顯示滾動(dòng)條(請(qǐng)參見(jiàn)下面的屏幕截圖)。我認(rèn)為我的 CSS 文件中沒(méi)有任何內(nèi)容會(huì)導(dǎo)致這種差異,但我對(duì) CSS 知之甚少,因此在下面包含了完整的文件。這主要是我在設(shè)置項(xiàng)目時(shí)由 Visual Studio 創(chuàng)建的默認(rèn)文件,并添加了一些內(nèi)容。
1 回答

婷婷同學(xué)_
TA貢獻(xiàn)1844條經(jīng)驗(yàn) 獲得超8個(gè)贊
事實(shí)證明,這不是尺寸問(wèn)題,而是約束問(wèn)題。selectedverbs
它似乎是由頁(yè)面關(guān)聯(lián)的 c# 文件中的返回值 () 的綁定引起的,如下所示:
[BindProperty] public List<SelectListItem> selectedverbs { get; }
因?yàn)檫@將采用多個(gè)返回值,所以它multiple
針對(duì)select
組件進(jìn)行設(shè)置。當(dāng)我將其更改為時(shí),public string selectedverbs { get; }
該select
組件將作為標(biāo)準(zhǔn)下拉列表運(yùn)行,大概只允許選擇單個(gè)項(xiàng)目。
- 1 回答
- 0 關(guān)注
- 151 瀏覽
添加回答
舉報(bào)
0/150
提交
取消