подключение значений данных к флажку и установка их в флажок

#javascript #html #jquery

Вопрос:

Я пытаюсь установить правильные флажки для проверки на основе значений, которые извлекаются из базы данных. Поэтому в моем коде на C# у меня есть функция, которая извлекает данные, и в моем индексе я получаю их. Вот функция JavaScript/jQuery, с помощью которой я получаю данные:

 $.ajax({
                   type: 'POST',
                   url: '@Url.Action("getRequestType", "Garage")?garageId='   garageId,
                   dataType: 'JSON',
                   data: {
                       garageId: garageId
                },
                success: function (data) {
                    Values = data;
                    console.log(garageId, data);

                    if (data.length > 0) {
                        console.log("Has values: "   data);
                    }
                    else if (data.length <= 0) {
                        console.log("Has no values");
                    }
                }
            });
 

При использовании console.log я могу видеть значения, поэтому, например, это может быть: garageId: 4 Has values: 4, 5, 8 «. Теперь я хотел бы, чтобы эти значения были связаны с этими флажками:

        @foreach (var items in Model)
        {
            <style>
                .ab {
                    margin-right: 8px;
                }
            </style>

            <div style=" width: 40%; display: block; float: right; margin-right: 10%; margin-top: 10%;">
                <h4>Choose request types for garage:</h4><br />
                <div class='form-group'>
                    <div class="rowa">
                        <label class="ab">Claim</label>
                        <input type="checkbox" class="checkbclass" name="@items.Claim" id="Claim" placeholder="Claim" value="1" /> <!-- values for request type -->
                    </div>
                </div>
                <div class='form-group'>
                    <div class="rowa">
                        <label class="ab">Scheduled Service</label>
                        <input type="checkbox" class="checkbclass" name="@items.ScheduledService" id="ScheduledService" placeholder="Scheduled" value="2" />
                    </div>
                </div>
                <div class='form-group'>
                    <div class="rowa">
                        <label class="ab">Tires</label>
                        <input type="checkbox" class="checkbclass" name="@items.Tires" id="Tires" placeholder="Tires" value="3" />
                    </div>
                </div>
                <div class='form-group'>
                    <div class="rowa">
                        <label class="ab">Rent Replacement Car</label>
                        <input type="checkbox" class="checkbclass" name="@items.RentRepalcementCar" id="RentRepalcementCar" placeholder="Tires" value="4" />
                    </div>
                </div>
                <div class='form-group'>
                    <div class="rowa">
                        <label class="ab">Other Work</label>
                        <input type="checkbox" class="checkbclass" name="@items.OtherWork" id="OtherWork" placeholder="Tires" value="5" />
                    </div>
                </div>
                <div class='form-group'>
                    <div class="rowa">
                        <label class="ab">Insurance</label>
                        <input type="checkbox" class="checkbclass" name="@items.Insurance" id="Insurance" placeholder="Tires" value="6" />
                    </div>
                </div><br />
            </div>
        }
 

Я пробовал код, похожий на:

 for (i = 0; i < Values.length; i  ) {
                if (Values == 1) {
                    $("#Claim").prop("checked", true);
                }
                if (Values == 2) {
                    $("#ScheduledService").prop("checked", true);
                }
                if (Values == 3) { 
                    $("#Tires").prop("checked", true);
                }
                if (Values == 4) {
                    $("#RentRepalcementCar").prop("checked", true);
                }
                if (Values == 5) {
                    $("#OtherWork").prop("checked", true);
                }
                if (Values == 6) {
                    $("#Insurance").prop("checked", true);
                }
                return Values;
 

И:

  $.ajax({
                   type: 'POST',
                   url: '@Url.Action("getRequestType", "Garage")?garageId='   garageId,
                   dataType: 'JSON',
                   data: {
                       garageId: garageId
                },
                success: function (data) {
                    Values = data;
                    console.log(garageId, data);

                    if (data.length > 0) {
                        //console.log("Has values: "   data);

                        if (data == 1) {
                            $("#Claim").prop("checked", true);
                        }
                        if (data == 2) {
                            $("#ScheduledService").prop("checked", true);
                        }
                        if (data == 3) {
                            $("#Tires").prop("checked", true);
                        }
                        if (data == 4) {
                            $("#RentRepalcementCar").prop("checked", true);
                        }
                        if (data == 5) {
                            $("#OtherWork").prop("checked", true);
                        }
                        if (data == 6) {
                            $("#Insurance").prop("checked", true);
                        }
                    }
                    else if (data.length <= 0) {
                        console.log("Has no values");
                    }
                }
            });
 

Но у меня не было никакого успеха. Последний метод позволяет устанавливать флажки там, где garageid имеет одно значение (так что в основном можно установить один флажок). Был бы очень признателен за любую помощь в этом, если у кого-то есть какие-либо предложения!

Комментарии:

1. какова связь между Values кодом на C# и флажками Id . например, как вы узнаете значения Insurance в базе данных?

2. Вместо того, чтобы проверять Values == 1 , не следует ли вам использовать Values[i] == 1 ? Я также предложил бы вам переработать код, чтобы не использовать деревья «если/иначе, если». Вместо этого у вас есть словарь или массив какого-либо рода, в котором вы сопоставляете значение с идентификатором элемента.

3. @PeterKrebs вы очень правы, [я] исправил это, большое вам спасибо!! И вы снова правы, если/иначе не является отличным решением.. но спасибо, если вы не хотите публиковать это в качестве ответа, я могу это принять 🙂

4. @AlirezaAhmadi, я просто использую оператор select, в котором получаю значения на основе garageId!

5. Примечание Values является массивом, поэтому вам необходимо использовать Values [i]

Ответ №1:

Обратите внимание, что Values это массив, и вы должны использовать [i] его для этого:

 for (i = 0; i < Values.length; i  ) {
    if (Values[i] == 1) {
        $("#Claim").prop("checked", true);
    }
    else if (Values[i] == 2) {
        $("#ScheduledService").prop("checked", true);
    }
....
 

Также вы можете использовать switch case тоже, что является лучшим вариантом:

 for (i = 0; i < Values.length; i  ) {
    switch (Values[i]) {
        case 1:
            $("#Claim").prop("checked", true);
            break;
        case 2:
            $("#ScheduledService").prop("checked", true);
            break;
        ....
        default:
            console.log("Error");
    }
}
 

Комментарии:

1. Спасибо!!! и это правда, я попробую переключиться вместо этого