如何使用jsp页面中的复选框显示Json数据?

时间:2017-08-17 18:36:35

标签: javascript json checkbox

我正在创建一个基本网站,它有2个下拉菜单,它应该工作的方式是对于第一个下拉菜单,它应该显示来自数据库的选择查询中的数据,并根据用户选择的第一个下拉列表我想要使用JSON填充第二个下拉列表值。我使用了JSON数组并在index.jsp页面中解析它。但我需要帮助使用复选框显示JSON数据。这是我的JS代码,我使用表来显示JSON数据,但我需要复选框。我是编码的新手,所以任何帮助将不胜感激!

这是我的Index.jsp:

<div class="programFields">
  <label>Pick a client</label>
  <select id="clientName" name="clientDropDown" onchange="ref()">
  <% while(r.next()){%>
    <option><%= r.getString("acode")%>
    </option>
  <%} %>
  </select>
  <p id="demo"></p>
</div>

和我的JS在Index.jsp:

function ref() { 
    var code = document.querySelector("select[name=clientDropDown]").value;
    var x, myObj, txt  = '' ;
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function () {
        if (this.readyState === 4 && this.status === 200) {
            myObj = JSON.parse(this.responseText);
            txt += "<select>"
            for (x in myObj) {
                txt += "<option>" + myObj[x].payor_id + "</option>";
            }
            txt += "</select>"
            document.getElementById("demo").innerHTML = txt;
        }
    }

    xhttp.open("POST", "Server.jsp", true);
    xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhttp.send( "code=" + code);
}

1 个答案:

答案 0 :(得分:0)

只需更改您插入的HTML:

Add-AzureRMAccount -ServicePrincipal -Tenant ******** -Credential System.Management.Automation.PSCredential -EnvironmentName AzureCloud
Select-AzureRMSubscription -SubscriptionId 12345678-1234-1234-1234-1234567890AB -TenantId ********
// For the demo, myObj is already received and parsed
var myObj = [
  {name: "Ted",      id: 0, friend: false},
  {name: "Chandler", id: 1, friend: true },
  {name: "Monica",   id: 2, friend: true },
  {name: "Phoebe",   id: 3, friend: true },
  {name: "Donald",   id: 4, friend: false},
  {name: "Rachel",   id: 5, friend: true },
  {name: "Ross",     id: 6, friend: true },
  {name: "Joey",     id: 7, friend: true }
];

var txt = "";

for (var x in myObj) {
  txt += '<input type="checkbox" value="' + myObj[x].id + '" '
       + (myObj[x].friend ? 'checked' : '') + '>'
       + myObj[x].name
       + '<br />';
}

document.getElementById("demo").innerHTML = txt;