jquery - How to change select box values based on the other drop down list values in rails query ajax -

here have model user , usertype. if change usertype user belongs particular usertype listed in drop down. code.

*.html

<div class="control-group string optional payslip_user_type_id">     <label class="string optional control-label" for="payslip_user_type_id">employee type</label>     <div class="controls">         <%= f.collection_select :user_type_id, usertype.all, "id", "name", prompt: '--select--' %>     </div> </div> <div class="control-group string optional payslip_user_id">     <label class="string optional control-label" for="payslip_user_id">employee name</label>     <div class="controls">         <%= f.collection_select :user_id, @users, "id", "name", prompt: '--select--' %>         </div> </div> 

the jquery file is

$("#payslip_user_type_id").change(function(){     var url = '/payslips/new?user_type_id=' + $(this).val() + ''   $.ajax({     url: url,     datatype: 'script',     type: 'get',     success: function(data){ $("#payslip_user_id").html(data); }   }); }) 

the controller code is

if params[:user_type_id].present?       @users = usertype.find(params[:user_type_id]).users       respond_to |format|         format.js        end     end 

and new.js.erb file is

<% if @users.present? %>     <%= select_tag 'payslip_user_id', options_from_collection_for_select(@users, "id", "name") %> <% else %>     <%= select_tag 'payslip_user_id', '' %> <% end %> 

when ajax request made, see select options in browser console. not changed in html. please 1 me.

try changing

datatype: 'script' 

to accept html

datatype: 'html'