尝试使用它:
下拉框依赖于另一个下拉框中选择的选项。使用jQuery根据第一个下拉列表选项更改第二个选择列表。
<asp:HiddenField ID="hdfServiceId" ClientIDMode="Static" runat="server" Value="0" />
<asp:TextBox ID="txtOfferId" CssClass="hidden" ClientIDMode="Static" runat="server" Text="0" />
<asp:HiddenField ID="SelectedhdfServiceId" ClientIDMode="Static" runat="server" Value="0" />
<asp:HiddenField ID="SelectedhdfOfferId" ClientIDMode="Static" runat="server" Value="0" />
<div class="col-lg-2 col-md-2 col-sm-12">
<span>Service</span>
<asp:DropDownList ID="ddlService" ClientIDMode="Static" runat="server" CssClass="form-control">
</asp:DropDownList>
</div>
<div class="col-lg-2 col-md-2 col-sm-12">
<span>Offer</span>
<asp:DropDownList ID="ddlOffer" ClientIDMode="Static" runat="server" CssClass="form-control">
</asp:DropDownList>
</div>
在你的网页中使用jQuery库。
<script type="text/javascript">
$(document).ready(function () {
ucBindOfferByService();
$("#ddlOffer").val($('#txtOfferId').val());
});
$('#ddlOffer').on('change', function () {
$("#txtOfferId").val($('#ddlOffer').val());
});
$('#ddlService').on('change', function () {
$("#SelectedhdfOfferId").val("0");
SetServiceIds();
var SelectedServiceId = $('#ddlService').val();
$("#SelectedhdfServiceId").val(SelectedServiceId);
if (SelectedServiceId == '0') {
}
ucBindOfferByService();
SetOfferIds();
});
function ucBindOfferByService() {
GetVendorOffer();
var SelectedServiceId = $('#ddlService').val();
if (SelectedServiceId == '0') {
$("#ddlOffer").empty();
$("#ddlOffer").append($("<option></option>").val("0").html("All"));
}
else {
$("#ddlOffer").empty();
$(document.ucVendorServiceList).each(function () {
if ($("#ddlOffer").html().length == "0") {
$("#ddlOffer").append($("<option></option>").val("0").html("All"));
}
$("#ddlOffer").append($("<option></option>").val(this.OfferId).html(this.OfferName));
});
}
}
function GetVendorOffer() {
var param = JSON.stringify({ UserId: $('#hdfUserId').val(), ServiceId: $('#ddlService').val() });
AjaxCall("DemoPage.aspx", "GetOfferList", param, OnGetOfferList, AjaxCallError);
}
function OnGetOfferList(response) {
if (response.d.length > 0)
document.ucVendorServiceList = JSON.parse(response.d);
}
function SetServiceIds() {
var SelectedServiceId = $('#ddlService').val();
var ServiceIdCSV = ',';
if (SelectedServiceId == '0') {
$('#ddlService > option').each(function () {
ServiceIdCSV += $(this).val() + ',';
});
}
else {
ServiceIdCSV += SelectedServiceId + ',';
}
$("#hdfServiceId").val(ServiceIdCSV);
}
function SetOfferIds() {
var SelectedServiceId = $('#ddlService').val();
var OfferIdCSV = ',';
if (SelectedServiceId == '0') {
$(document.ucVendorServiceList).each(function () {
OfferIdCSV += this.OfferId + ',';
});
}
else {
var SelectedOfferId = $('#ddlOffer').val();
if (SelectedOfferId == "0") {
$('#ddlOffer > option').each(function () {
OfferIdCSV += $(this).val() + ',';
});
}
else {
OfferIdCSV += SelectedOfferId + ',';
}
}
}
</script>
在您的网页中使用后端代码。
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
ServiceList();
}
}
public void ServiceList()
{
ManageReport manageReport = new ManageReport();
DataTable ServiceList = new DataTable();
ServiceList = manageReport.GetServiceList();
ddlService.DataSource = ServiceList;
ddlService.DataTextField = "serviceName";
ddlService.DataValueField = "serviceId";
ddlService.DataBind();
ddlService.Items.Insert(0, new ListItem("All", "0"));
}
public DataTable GetServiceList()
{
SqlParameter[] PM = new SqlParameter[]
{
new SqlParameter("@Mode" ,"Mode_Name" ),
new SqlParameter("@UserID" ,UserId )
};
return SqlHelper.ExecuteDataset(new SqlConnection(SqlHelper.GetConnectionString()), CommandType.StoredProcedure, "Sp_Name", PM).Tables[0];
}
[WebMethod]
public static String GetOfferList(int UserId, String ServiceId)
{
var sOfferList = "";
try
{
CommonUtility utility = new CommonUtility();
ManageReport manageReport = new ManageReport();
manageReport.UserId = UserId;
manageReport.ServiceId = ServiceId;
DataSet dsOfferList = manageReport.GetOfferList();
if (utility.ValidateDataSet(dsOfferList))
{
sOfferList = utility.ConvertToJSON(dsOfferList.Tables[0]);
}
return sOfferList;
}
catch (Exception ex)
{
return "Error Message: " + ex.Message;
}
}
public DataSet GetOfferList()
{
SqlParameter[] sqlParameter = new SqlParameter[]
{
new SqlParameter("@Mode" ,"Mode_Name" ),
new SqlParameter("@UserID" ,UserId ),
new SqlParameter("@ServiceId" ,ServiceId )
};
return SqlHelper.ExecuteDataset(new SqlConnection(SqlHelper.GetConnectionString()), CommandType.StoredProcedure, "Sp_Name", sqlParameter);
}
select2
的所选值?这些值不是唯一的,那么什么区分香蕉和苹果? - Ja͢ck