javascript - Select option of dropdown and make it not active? -

i got select :

<select class="form-control" id="category_id_select" name="category_id">   @foreach (var category in model.categories){     <option value="@category.id">@category.name</option>   } </select> 

and got input set value must selected on page load :

<input type="text" class="form-control" id="cat_id" value="@model.categoryid"/> 

my js file :

$(document).load(function () {   $('.combobox').combobox();   var catid = $("#cat_id").val();   $("#category_id_select ").val(catid);   $("#add_prop").click(function () {     alert(catid); }); 

what doing wrong?

i hide input , wanna have not active dropdown selected value.whats solution jquery?

you need trigger value change made :

$("#category_id_select").val(catid).change(); //or   $("#category_id_select").val(catid).trigger('change'); 

note : remove space you've in selector :

$("#category_id_select "). ______________________^ 

and try use ready function :

$(function(){      //your code here }) 

hope helps.

$(function () {      var catid = $("#cat_id").val();      $("#category_id_select").val(catid);  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <select class="form-control" id="category_id_select" name="category_id">      <option value="c1">category 1</option>      <option value="c2">category 2</option>      <option value="c3">category 3</option>  </select>    <input type="text" class="form-control" id="cat_id" value="c3"/>