Search code examples
javascriptjqueryhtmldropdownbox

Displaying text next to a drop down box

I'm looking to display a sales price in text next to a drop down box, but there's a catch.

Here is my current code:

<SELECT name="SELECT___TK46BW___9" onChange="change_option('SELECT___TK46BW___9',this.options[this.selectedIndex].value)">
<OPTION value="124" SELECTED>1 Box</OPTION>
<OPTION value="125" >2 per Case [Add $10.95]</OPTION>
<OPTION value="126" >6 per Case [Add $50.00]</OPTION>
</SELECT>

Now, the rub is I can't change that part of the code. I can put HTML and Javascript underneath it, but the above is automatically generated by the platform that I'm using.

I hope I was specific enough in this post. Thank you for any help!

EDIT

If possible, I'm looking for it to look something like this: enter image description here

Solution

  • Here my attempt at solving this, in this example on clicking the button we update the option with the value "126".

    DEMO https://jsfiddle.net/xor4f0rs/

    HTML:

    <SELECT name="SELECT___TK46BW___9" onChange="change_option('SELECT___TK46BW___9',this.options[this.selectedIndex].value)">
  <OPTION value="124" SELECTED>1 Box</OPTION>
  <OPTION value="125" >2 per Case [Add $10.95]</OPTION>
  <OPTION value="126" >6 per Case [Add $50.00]</OPTION>
</SELECT>

<button id="btn">click me</button>

    JS: 

    $('#btn').click(function(){
    $("option[value='126']").html('6 per Case [Add $99.99]')
});

    Edit: SOLUTION https://jsfiddle.net/xor4f0rs/9/