如何在dropboxlist内部显示数据，使用代码后面的静态方法填充dropdownlist

Question

这个想法是用数据库中的信息、调试过的代码和存储在dropdownlist中的信息来填充dropdownlist.问题是，你看不到任何建议。

我不会使用更新面板。

javascript函数正在调用代码后面的方法，唯一的问题是我看不到的信息

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div class="grid3">
<asp:Label runat="server" Text="Provincia"></asp:Label>
<asp:DropDownList ID="droplistProvincia" ClientIDMode="Static"  AutoPostBack="false"  OnSelectedIndexChanged="droplistProvincia_SelectedIndexChanged" onclick="" Width="100%" runat="server" Height="30px">
<asp:ListItem Text="Seleccione"></asp:ListItem>
</asp:DropDownList>
<asp:Label runat="server" Text="Cantón"></asp:Label>
<asp:DropDownList ID="droplistCanton" CssClass="item15"  AutoPostBack="true" OnSelectedIndexChanged="droplistCanton_SelectedIndexChanged" Width="100%" runat="server" Height="30px">
<asp:ListItem Text="Seleccione"></asp:ListItem>
</asp:DropDownList>
<asp:Label runat="server" CssClass="item16" Text="Distrito"></asp:Label>
<asp:DropDownList ID="droplistDistrito" CssClass="item17"  runat="server" Height="30px">
<asp:ListItem Text="Seleccione"></asp:ListItem>
</asp:DropDownList>
<div runat="server" id="checkProvincia"  class="mensaje req6 diseñoReqObli">
<div runat="server" id="mensaje6" class="iconoMensaje">
<i class="fa fa-exclamation-circle fa-2x" aria-hidden="true" ></i>
</div>
<div runat="server" id="txtMensaje6" style="margin-top:5px;"></div>
</div>
<div runat="server" id="checkCanton"  class="mensaje req7 diseñoReqObli">
<div runat="server" id="mensaje7" class="iconoMensaje">
<i class="fa fa-exclamation-circle fa-2x" aria-hidden="true" ></i>
</div>
<div runat="server" id="txtMensaje7" style="margin-top:5px;"></div>
</div>
<div runat="server" id="checkDistrito"  class="mensaje req8 diseñoReqObli">
<div runat="server" id="mensaje" class="iconoMensaje">
<i class="fa fa-exclamation-circle fa-2x" aria-hidden="true" ></i>
</div>
<div runat="server" id="txtMensaje8" style="margin-top:5px;"></div>
</div>

</div>
</ContentTemplate>
</asp:UpdatePanel>

编写脚本

provincia.addEventListener('change', (e) => {
e.preventDefault();
PageMethods.Provincia(provincia.value);
console.log(provincia.value);
})

背后的代码

[System.Web.Services.WebMethod()]
[System.Web.Script.Services.ScriptMethod()]
public static void Provincia(string dato)
{
MessageBox.Show(dato);
DropDownList dropCanton = new DropDownList();
dropCanton = HttpContext.Current.Session["dropCanton"] as DropDownList;
if (dato != "Seleccione")
{
int idProvincia = int.Parse(dato);
_servicio2 = _servicio2 ?? new Servicio<Canton>();
dropCanton.DataTextField = "nom_Canton";
dropCanton.DataValueField = "cod_Canton";
dropCanton.DataSource = _servicio2.TraerTodoEspecificoPor(new Query<Canton> { Where = x => x.cod_Provincia == idProvincia });
dropCanton.DataBind();
dropCanton.Items.Insert(0, "Seleccione");
dropCanton.SelectedIndex = 0;

}
}

页面加载

protected void Page_Load(object sender, EventArgs e)
{
Session["dropCanton"] = this.droplistCanton;
}

Answer 1

页面方法的一个常见误解是：无法从静态WebMethod/page方法访问页面上的控件。必须将数据返回到调用该方法的javascript，然后从javascript方法更新控件(dropdownlist(。

由于该方法是静态的，因此在每个页面上都是相同的方法。如果你网站上有4个用户打开了页面，并且方法说"更新此控件"，那么应该更新哪个页面上的下拉列表？不可能知道。这就是为什么你必须将数据发送回调用它的页面上的脚本