Hari Prakash Hari Prakash - 3 months ago 13
Javascript Question

Jquery dropdown list set Id automatically

index.html.haml

I have a form which has a dropdown list which has several fields. I want a customer to choose the field which has to be displayed in a form.And the rest of the fields should be hidded from the form.



.col-xs-12.table-responsive
= form_for(@customer_detail) do |f|
.field-list
= f.label :field_list,"Choose the fields to be displayed", class: "col-sm-3 control-label text-right"
= f.select :field_list, options_for_select(CustomerDetail::INSERT_FIELD_LIST_CUSTOMER),{}, {prompt: "Field List", class: "checkbox_list_for_tax_org form-control form-width", "data-live-search": "true", multiple:"multiple"}

%table.table.table-striped
%thead
%tr
- hash_value.each do |f|
%th{id:"#{f[0]}"} Customer Name
%th{id:"#{f[0]}"} Customer ID
%th{id:"#{f[0]}"} Address
%th{id:"#{f[0]}"} State
%th{id:"#{f[0]}"} Email
%th{id:"#{f[0]}"} Website
%th{id:"#{f[0]}"} Service Tax No
%th{id:"#{f[0]}"} Local Sales Tax No
%th{id:"#{f[0]}"} Residential Type
%th{id:"#{f[0]}"} Attention To
%th{id:"#{f[0]}"} City
%th{id:"#{f[0]}"} Pin Code
%th{id:"#{f[0]}"} Contact No
%th{id:"#{f[0]}"} Business Type
%th{id:"#{f[0]}"} PAN No
%th{id:"#{f[0]}"} Central Sales Tax No
%th{id:"#{f[0]}"} Business Center
%th{id:"#{f[0]}"} Opening Bal
%th{id:"#{f[0]}"} Currency Type
%th{id:"#{f[0]}"} Name
%th.closed Address
%th.closed State
%th.closed Contact No
%th.closed Pin Code
%th.closed Delivery Address

%tbody
- @customer_details.each do |customer|
%tr
- hash_value.each do |f|
%td{id:"#{f[0]}"}= customer.customer_name
%td{id:"#{f[0]}"}= customer.customer_id
%td{id:"#{f[0]}"}= customer.address
%td{id:"#{f[0]}"}= customer.state
%td{id:"#{f[0]}"}= customer.email
%td{id:"#{f[0]}"}= customer.website
%td{id:"#{f[0]}"}= customer.service_tax_reg_no
%td{id:"#{f[0]}"}= customer.local_sales_tax_reg_no
%td{id:"#{f[0]}"}= customer.residential_type
%td{id:"#{f[0]}"}= customer.attention_to
%td{id:"#{f[0]}"}= customer.city
%td{id:"#{f[0]}"}= customer.pin_code
%td{id:"#{f[0]}"}= customer.contact_no
%td{id:"#{f[0]}"}= customer.business_type
%td{id:"#{f[0]}"}= customer.pan_no
%td{id:"#{f[0]}"}= customer.central_sales_tax_no
%td{id:"#{f[0]}"}= customer.business_center
%td{id:"#{f[0]}"}= customer.opening_bal
- if customer.goods_address.present?
%td.closed= customer.goods_address.name
%td.closed= customer.goods_address.contact_no
%td.closed= customer.goods_address.address
%td.closed= customer.goods_address.state
%td.closed= customer.goods_address.pin_code
%td.closed= customer.goods_address.delivery_address







$(function () {
$(".field-list").change(function(){
var checked = $(this).find("option:checked").val();
alert(checked);
($(this).val()).show();

});

});




The problem is I dont know how to set Id for each field. I need to display only the fields which has been selected in dropdown.can someone plz help me. thanks in advance!!

Answer
var checked = $(this).val();
console.log(checked)
var currentSelectedArray = []
if (checked) {
 var selectedOption = [];
 var slectedIncrement = 0;
 jQuery.grep(checked, function(el) {
  if (jQuery.inArray(el, selectedValues) == -1)                  
   selectedOption.push(el);
   slectedIncrement++;

});