來自 json 的 Asp.net jquery 下拉列表

Question

我想在單擊組時加載帶有乳制品和蛋制品、脂肪和油等食物組的下拉菜單當乳制品計時時應加載食物當我單擊奶酪時應加載所有奶酪時應顯示卡路里。附加相同的 json 文件.在這個例子中，奶酪paremesan低鈉451應該被顯示出來

<%@ Page Language="C#" AutoEventWireup="true" MasterPageFile="~/Site.Master" CodeBehind="Consumed.aspx.cs" Inherits="Weight.Consumed" %>

<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
<head>
    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" >
    <title>METS APP</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script>
        $(document).ready(function () {
            setOption();
            $('#CategoryDDL').change(function () {
                setOption();
            });

            $('#Calculate').click(function Calculate() {
             
                var CALORIES = $("#DescriptionDDL option:selected").val();
               
           
                $('#result').val(CALORIES);
            });
        });

        function setOption() {
            $('#DescriptionDDL').html('');
            var DefaultOption = '<option selected  disabled>' + "- Select -" + '</option>';
            $('#DescriptionDDL').append(DefaultOption);
            var Category = $("#CategoryDDL option:selected").val();
            alert(Category); 
            if (Category != '- Select -') {
                $.getJSON('cons.json', function (data) {
                    for (var cons of data.consmaster.Consumed) {

                       
                        if (cons.GRP  == Category) {
                            var option = '<option value=' + cons.VAL + '>' + cons.DESCRIPTION + '</option>';
                            $('#DescriptionDDL').append(option);
                        }
                    }
                });
            }
        }
    </script>
</head>





<div>

    <h1>Consumed Calories</h1>
    
     <br />
    Activity: <select name="CategoryWgt" id="CategoryWgt">
        <option selected="selected" value="- Select -" disabled="">- Select -</option>
        <option value="100">Dairy and Egg Products</option>
         <option value="200">Spices and Herbs</option>
        <option value="300">Baby Foods</option>
        <option value="400">Fats and Oils</option>
        <option value="500">Poultry Products</option>
        <option value="600">Soups, Sauces, and Gravies</option>
        <option value="700">Sausages and Luncheon Meats</option>
        <option value="800">Breakfast Cereals</option>
        <option value="900">Fruits and Fruit Juices</option>
        <option value="1000">Pork Products</option>
        <option value="1100">Vegetables and Vegetable Products</option>
        <option value="1200">Nut and Seed Products</option>
        <option value="1300">Beef Products</option>
        <option value="1400">Beverages</option>
        <option value="1500">Finfish and Shellfish Products</option>
        <option value="1600">Legumes and Legume Products</option>
        <option value="1700">Lamb, Veal, and Game Products</option>
          <option value="1800">Baked Products</option>
        <option value="1900">Sweets</option>
        <option value="2000">Cereal Grains and Pasta</option>
        <option value="2100">Fast Foods</option>
           <option value="2200">Meals, Entrees, and Side Dishes</option>
        <option value="2500">Snacks</option>
        <option value="3500">American Indian/Alaska Native Foods</option>
        <option value="3600">Restaurant Foods</option>

    </select>
    <br />
    Description: <select id="DescriptionDDL"></select>
    <br />
    <button type="button" id="Calculate" value="Calculate">Calculate</button>
    <br />
    Calories in 100gms: <input name="result" type="text" id="result" />


</div>

</asp:Content>


{
  "consmaster": {
    "Consumed": [
      {
        "CODE": 42258,
        "GRP": 100,
        "DESCRIPTION": "Cheese product, pasteurized process, cheddar, reduced fat",
        "WEIGHT": 28,
        "VALMEASURE": 67.2,
        "VAL": 240,
        "MEASURE": "1 slice 1 oz"
      },
      {
        "CODE": 43340,
        "GRP": 100,
        "DESCRIPTION": "Cheese, parmesan, low sodium",
        "WEIGHT": 100,
        "VALMEASURE": 451,
        "VAL": 451,
        "MEASURE": "1 cup, grated"
      },
      {
        "CODE": 42117,
        "GRP": 100,
        "DESCRIPTION": "Imitation cheese, american or cheddar, low cholesterol",
        "WEIGHT": 113,
        "VALMEASURE": 440.7,
        "VAL": 390,
        "MEASURE": "1 cup, shredded"
      }

Answer 1

將 name="CategoryWgt" id="CategoryWgt"> 更改為 '#CategoryDDL' 並開始工作

來自 json 的 Asp.net jquery 下拉列表

問題描述

1 個解決方案

解決方案1
0 2022-07-14 02:26:15

來自 json 的 Asp.net jquery 下拉列表

問題描述

1 個解決方案

解決方案1 0 2022-07-14 02:26:15

解決方案1
0 2022-07-14 02:26:15