Can I hide some things from the dropdown menu?

[Jack_Tauson_Sr]

I have the following Ajax Call and right now I have the description, name and id of the company in the dropdown menu.
However, I am wondering if I can hide something like data.company[i].id. Basically this will be hidden from the UI but I still want it because when a user selected a project, I am grabbing the id in my other logic.

$.ajax({
	   
	    url: 'myurl',
	    type : 'GET',
 
	    dataType:'json',
	    success : function(data) {
	             $.each(data.company, function (i) { 
	            $("#mylist").append('<option>'+data.company[i].description+' | '+data.company[i].name+' | '+data.company[i].id+'</option>');
	          	            
	            });
	           
	            
	            
	     },
	    error : function(request,error)
	    {
	    	 $.growl.error({title: "Error", message: "Webservice request failed!" });
             
	    	
	    }
	});

[m3g4p0p]

@Jack_Tauson_Sr

Basically this will be hidden from the UI but I still want it because when a user selected a project, I am grabbing the id in my other logic.

Hi @Jack_Tauson_Sr, I suppose the value attribute would be a good choice then – an option without a value doesn’t seem particularly useful anyway.

[Jack_Tauson_Sr]

@Jack_Tauson_Sr

$("#mylist").append('<option>'+data.company[i].description+' | '+data.company[i].name+' | '+data.company[i].id+'</option>');

Hi @m3g4p0p,

You mean, I should consider adding a unique value to each value of the option tag?
For example:

<select id="mylist" >
    <option value="v1">c1desc | c1name | 01</option>
    <option value="v2">c2desc | c2name | 02</option>
    <option value="v3"> c3desc | c3name | 03  </option>
    <option value="v4">c4desc | c4name | 04</option>
  </select>

If yes, then I am wondering I would still need to hide the company id values 01,02,03,04 and how value attribute is going to help her?

Thanks !

[m3g4p0p]

I meant using the IDs as values, and not include them in the text content at all…

$("#mylist").append(
  '<option value="' + data.company[i].id + '">' + 
  data.company[i].description + ' | ' +
  data.company[i].name + '</option>'
)

PS: Or maybe for better readability:

var $option = $('<option />', {
  value: data.company[i].id,
  text: data.company[i].description + ' | ' + data.company[i].name
})

$('#mylist').append($option)