Member 12845316 Ответов: 2

Как связать два выпадающих списка одновременно с помощью jquery из mysql

У меня есть два выпадающих списка как связать это с помощью jquery из бэк энда

Что я уже пробовал:

$.Аякс({
тип: "пост",
contentType: "application/json; charset=UTF-8",
url: "ddlBind. aspx/ddlDataBind",
данные: {},
тип данных: "json",
успех: функция (данные) {
ВАР SharedAOC = формат JSON.синтаксический анализ(данных.д);
ВАР в finaldata = SharedAOC.Стол;
отладчик;
$. each(finalData, function (key, value) {
$("#ddlCity").функции append ($("в<параметр&ГТ;&ЛТ;/вариант&ГТ;").функция val(значение.Город). html (значение.Город));
$("#ddlState").функции append ($("в<параметр&ГТ;&ЛТ;/вариант&ГТ;").функция val(значение.Состояние). html(значение.Государство));

});
отладчик;
$. each(finalData, function (key, value) {
$("#ddlState").функции append ($("в<параметр&ГТ;&ЛТ;/вариант&ГТ;").функция val(значение.Состояние). html(значение.Государство));

});

},

F-ES Sitecore

Что не так с кодом, который у вас есть на данный момент?

(подсказка: фраза "это не работает" не добавляет никакой ценности и не дает людям информации, которая им нужна, чтобы помочь вам)

2 Ответов

Рейтинг:
1

Karthik_Mahalingam

обратитесь встроенных комментариев

var stateCity = []; // state City Mapping Array
      $.each(finalData, function (key, value) {  // load all the state city to an array
          stateCity.push([value.State, value.City]);
      });

      var distinctState = [];
      stateCity.forEach(function (item) { // find the distinct state
          if(distinctState.indexOf(item.State)== -1)
              distinctState.push(item.State)
      });
      distinctState.forEach(function (item) { // populate the distinct state to state ddl
          $("#ddlState").append($("<option></option>").val(item).html(item));
      });

      populateCity($("#ddlState").val()); // load the city for selected state


      function populateCity(state)   // function to load the cities based on the selection of state
      {

          $("#ddlCity").empty();
          stateCity.forEach(function (item) {
              if(item.State == state)
                  $("#ddlCity").append($("<option></option>").val(item.City).html(item.City));
          });
      }


добавлять onchange событие в раскрывающемся списке ddlstate 

onchange="populateCity(this.value)"

Рейтинг:
1

Peter Leow

Во-первых, вы должны знать, как построить dropdownlist в HTML, то есть тег select, а затем реплицировать его в jQuery, см. Пример:

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    //Assuming the cityCode and cityName come from the back end
    var cityCode = "sg";
    var cityName = "Singapore";
    $("#ddlCity").append("<option value='"+ cityCode +"'>"+ cityName+"</option>");
});
</script>
</head>
<body>
<select id="ddlCity"></select>
</body>
</html>