0

I need help representing an integer as any string of my choice (not just the actual string representation of the integer).

Context- I have a dropdown box on a web app consisting of numbers placed into an array [10, 5, 0, -5, -10]. On the web application I need the 0 to appear as the string "Select", but still maintain the functionality of the int 0. There may be an HTML or CSS solution to this if it is not possible in JavaScript. Thank you.

5
  • 2
    Why not use key value pairs? Commented Oct 9, 2015 at 16:50
  • In coding what you have tried? Just update your question with your code Commented Oct 9, 2015 at 16:50
  • 3
    Have you tried this: w3schools.com/tags/att_option_value.asp? Commented Oct 9, 2015 at 16:51
  • 1
    You should definitely elaborate on your specific question. You can cast anyway you like and interchangeably use operands of any type: ''+123 == '123' && ~~'123' === parseInt('123',10) Commented Oct 9, 2015 at 16:54
  • Welcome to SO. Please visit the help center to see how to ask a question here Commented Oct 9, 2015 at 16:55

3 Answers 3

1

If you have a dropdown (i.e. select element), the value attribute of the option elements are independent of the text displayed to the user.

You can have an

<option value="value that you want to have in code">
    Text that your user should see
</option>`

If the select needs to be populated from an array, then you can use JavaScript to create DOM elements and add them to the corresponding select node.

HTML

<select id="selectbox"></select>

JS

array.forEach(function(e) {
    var option = document.createElement('option');
    option.value = e;
    option.textContent = e ? e : 'Select';
    document.getElementById('selectbox').appendChild(option);
});

Should generate

<select>
  <option value="10">10></option>
  <option value="5">5></option>
  <option value="0">Select</option>
  <option value="-5">-5></option>
  <option value="-10">-10></option>
</select>
Sign up to request clarification or add additional context in comments.

1 Comment

Note that if you want "Select" to be the first item in the dropdown you should change the order of your array to have 0 first. If you just want it to be default, but still in the middle (with + numbers above it, - numbers below), use the selected attribute on the 0 option.
0

You can use the value property of the options:

<select id="my-select">
   <option value="0">Select</option>
   <option value="10">10</option>
   <option value="-5">-5</option>
</select>

Javascript to get current value:

var ele = document.getElementById('my-select');
var myValue = ele.options[ele.selectedIndex].value;

Comments

0

Simple as that:

var selectValues = [10, 5, 0, -5, -10];
$.each(selectValues, function(key, value) {   
     if(value==0){
       $('#cars')
         .append($("<option ></option>")
         .attr("value",value)
         .text("Select")); 
     }else{
       $('#cars')
         .append($("<option ></option>")
         .attr("value",value)
         .text(value)); 
     }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form action="demo_form.asp">
  <select id="cars" name="cars">
    
  </select>
  <input type="submit" value="Submit">
</form>

2 Comments

jQuery was not specified
If all they need is to create a select, jQuery is huge overkill and has a learning curve for this obvious noob.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.