如何将数据从ajax传递给html

时间:2015-09-14 20:48:29

标签: javascript jquery html ajax

我不知道如何将数据从ajax传递给html。我需要将ajax中的recived数据传递给控制器​​的html代码我发送字符串我想拆分它并放入新的下拉菜单..这里是代码

@(postOffices: List[PostOffice])

@adminmain("制作路线"){     

  $(document).ready(function(){

      // for any form on this page do the follofing

       $('#selectOffice').blur(function(){
          var valueOfSelect = $('#selectOffice').val();
          $.ajax({
             url: "@routes.PostOfficeController.createRoute()",
             method: "POST",
             data: "valueOfSelect="+valueOfSelect
          }).success(function(response){
              $("#trackForm").show();
          }).error(function(response){
             alert(response + valueOfSelect);
          })
       })
  );

</script>

HTML

<div class="row">

    <div class="col-md-4">

        <select name="postOffices" id="selectOffice">

        @for(postOffice <- postOffices) {

            <option value="@postOffice.name">@postOffice.name</option>

        }


        </select>

    </div>


</div>


<form id="trackForm" name="trackForm" method="POST" style="display : none ;">
    <div class="row">

        <div class="col-md-4">

            <select name="postOffices" id="selectOffice">

            @for(postOffice <- postOffices) {

                <option value=""></option>

1 个答案:

答案 0 :(得分:0)

ajax的返回是一个JSON?在这种情况下,您可以这样做:

$.ajax({
         url: "@routes.PostOfficeController.createRoute()",
         method: "POST",
         data: "valueOfSelect="+valueOfSelect
      }).success(function(response){
          $("#trackForm").show();
         var select = document.getElementById('selectOffice'); //get the select element
         var respJson = JSON.parse(response); //get the response (in text) and transform to JSON object
         respJson.forEach(function(item, itemIndex){ //for in the JSON object
            var opt = document.createElement('option') //create a new option element
            opt.value = item.value; //set the value of otion (NOTE: item.value, where "value" is the parameter os the yout value in the JSON
            opt.innerHTML = item.text;
            select.appendChild(opt); //appende the option in to the select
          })            

      }).error(function(response){
         alert(response + valueOfSelect);
      })