Question

我有1个值，我传入kendocombobox又名下拉

$("#AllCounty").data('kendoComboBox').val("Some Value")

以上这条线工作得非常漂亮，现在我在这里有价值＆＃34;有些价值＆＃34; ;

($("#FindCountry").val()).trigger("change");

如何将($("#seachcountry").val()).trigger("change");值包含到.val("Some Value")

中

现在我有$("#txtBaCountryRegion").data('kendoComboBox').val()($("#seachcountry").val()).trigger("change");

这是示例代码

＆＃13;

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <style type="text/css" media="screen">
      .map_canvas { float: left; }
      form { width: 300px; float: left; }
      fieldset { width: 320px; margin-top: 20px}
      fieldset label { display: block; margin: 0.5em 0 0em; }
      fieldset input { width: 95%; }
	  #examples a {
  text-decoration: underline;
}

#geocomplete { width: 200px}

.map_canvas { 
  width: 100%; 
  height: 400px; 
  margin: 10px 20px 10px 0;
}

#multiple li { 
  cursor: pointer; 
  text-decoration: underline; 
}
.pac-container {
            z-index: 10000 !important;
        }

            .pac-container:after {
                background-image: none !important;
                height: 0px;
            }
        .map_canvas {
            float: left;
            z-index: 10000 !important;
        }

        .pac-container {
            background-color: #FFF;
            z-index: 20;
            position: fixed;
            display: inline-block;
            float: left;
        }

        .modal {
            z-index: 20;
        }

        .modal-backdrop {
            z-index: 10;
        }

    </style>
</head>
<body>

<!-- Trigger the modal with a button -->



<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Google Search Map </h4><h6>(Map only shows after you reseize the browser page and back) nb: Don't forget to refresh input field's value</h6>
      </div>
      <div class="modal-body">
	  
	  <div class="form-group">
  <label for="usr">Search:</label>
 
 <input id="geocomplete" class="form-control" type="text" placeholder="search for a company..." value="" />

  <br/>
  <form>
  <label>Country</label>
  
  <input id="seachcountry" class="form-control" name="country" type="text" value="">
  </form>
</div>

        <div class="map_canvas"></div>
      </div>
      <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Cancel Process</button>
          <button  type="button" id="done" class="btn btn-success" data-dismiss="modal">Copy to Page</button>
        
      </div>
    </div>

  </div>
</div>

<div class="container">
  <h3></h3> <hr> <p></p>  <p></p>  <p></p>  <p></p>
<button type="button" class="btn btn-danger btn-xl" data-toggle="modal" data-target="#myModal">Find Your City</button>
<div class="panel">
  <h4>Senario: we only have 1 country in the drop down but the form in the modal can generate 200s countries, how to get any of the 200s countries (value) in the dropdown</h4>
  <select class="form-control" id="AllCounty">
    <option>Finland</option>
 
  </select>
  <p></p>
  <label>INPUT TEST (works GREAT)</label>
  <input placeholder="I want this value into the drop down list" id="INPUTTEST" class="form-control">
  </div>
</div>
</div>

</body>

    <script src="http://maps.googleapis.com/maps/api/js?sensor=false&amp;libraries=places"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/geocomplete/1.7.0/jquery.geocomplete.js"></script>

    <script>
      $(function(){
        $("#geocomplete").geocomplete({

		map: ".map_canvas",
		details: "form",
		types: ["geocode", "establishment"],
  })
  .bind("geocode:result", function(event, result){
     var map = $("#geocomplete").geocomplete('map');
     google.maps.event.trigger(map, "resize");
     map.setCenter(result.geometry.location);
  })
;
      });
    </script>
<script>
  $(document).ready(function () {
            $('#done').click(function () {
                var countryValue = $('#seachcountry');
                $("#AllCounty").val($("#seachcountry").val()).trigger("change");
                //TESTING AN IPUT FIELD
                $("#INPUTTEST").val($("#seachcountry").val()).trigger("change");

                //REAL TEST BELOW
                $("#AllCounty").data('kendoComboBox').val("Some Value")
                
            });
        });
</script>

</body>
</html>

＆＃13;

请将代码复制到使用Google地方的HTML文件

Answer 1

我不知道您是否尝试设置选择标记的选定选项或尝试向选择标记添加新选项，但以下是：

从输入中选择选项：

var countryValue = $('#seachcountry').val()
$("#AllCounty").val(countryValue)

为选择添加新选项：

var countryValue = $('#seachcountry').val()
var $optionElement = $('<option/>',{'value':countryValue }).append(countryValue)
$("#AllCounty").append($optionElement)

顺便说一下你必须设置属性＆＃34;值＆＃34;在每个选项标签上，例如：

<select class="form-control" id="AllCounty">
    <option value="Finland">Finland</option>
</select>

jQuery：如何将ID的值包含到.value（）中

1 个答案: