JQuery изменить функцию по раскрывающемуся значению

Question

У меня есть выпадающий список, к которому я хочу применить jquery (значение ajax onChange). Таким образом, данные JSon, переданные для выбранного значения действием контроллера, отображаются в том же представлении путем замены некоторого идентификатора этого представления
Выпадающее

<div><select id="package_master" name="package_master"><option value="">
--select package--</option>
<option value="1">JPMC Package1</option>
<option value="2">JPMC Package 2</option>
<option value="3">JPMC Package1</option>
<option value="5">Select Package</option>
<option value="6">Select Package</option>
</select></div>

То, что я сейчас делаю, это

<script type="text/javascript">
$(function () { //$(document).ready(function () {
    $("#package_master").change(function () {
        var value = $('#package_master').val();
        jQuery.ajax({
        type: "POST",

        url: "@Url.Content("~/Test/getPackageDetails/")",
        data: "packageID="+value,
       success: function(data){//here i want to Replace come id with json data passed by action
</script>

URL-адрес url: "@Url.Content("~/Test/getPackageDetails/")",

Выполнить вышеуказанный сценарий

Обновлено:
Я использовал следующий скрипт для выполнения своей задачи, который тоже работает нормально, но данные отображаются в формате массива, например ["abc", "xyz"]
Теперь здесь я нужна помощь для форматирования данных JSON в формате строки, т.е. по 1 строке для каждого элемента массива, например
abc
xyz

`

    <script type="text/javascript">
      $(function () { //$(document).ready(function () {
      $("#package_master").change(function () {
        var value = $('#package_master').val();
        jQuery.ajax({
        type: "POST",

        url: "@Url.Content("~/Test/getPackageDetails/")",
        data: "packageID="+value,

      success: function(data){

        $("#packageDetails").html(JSON.stringify(data));

        },
        error: function(data){
        alert("Request couldn't be processed. Please try again later. the reason "+data);
        }
        });

    });
});

`

Answer 1

<script type="text/javascript">
$(function () { //$(document).ready(function () {
    $("#package_master").change(function () {
        var value = $('#package_master').val();
        jQuery.ajax({
        type: "POST",

        url: "@Url.Content("~/Test/getPackageDetails/")",
        data: "packageID="+value,
       success: function(data){
      data = $.map(data, function (item, a)
      {
      return " "+item+ "<br>";
      });
      $("#packageDetails").html(data.join(""));

       },

        error: function(data){
        alert("Request couldn't be processed. Please try again later. the reason        "+data);
        }
        });

    });
});

Answer 2

<script>
    $(function () {
        $("#package_master").change(function () {
            var data = { packageID: $(this).val() }
            $.post("url", data, function (backdata, status) {
                // callback, do something
            }, "json");
        });
    });
</script>

Answer 3

 $(function () { $(document).ready(function () {
    $("#package_master").change(function () {
        var packageID = $('#package_master').val();

        $.post("@Url.Content("~/Test/getPackageDetails/")", {packageID : packageID},         function (data) {
      $("#packageDetails").html("");
       $.each(data,function(i,field){
       $("#packageDetails").append(i+1+" "+field+"<br/>");
       });

        }, "json");
     }); 
   });

В качестве альтернативы вы можете использовать

$("#packageDetails").$(selector).load(url,data,function(response,status,xhr))

для других решений, см. Здесь .И я бы рекомендовал избегать использования $.ajax, если у вас есть некоторые альтернативные значения.

Answer 4

Функция jQuery ajax имеет опцию: dataType: "json"

Поскольку вы используете JSON.stringify(data), вам нужен этот параметр как dataType: "text"

Так что нет нужды в JSON.stringify(data).