Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!
  • Guest, before posting your code please take these rules into consideration:
    • It is required to use our BBCode feature to display your code. While within the editor click < / > or >_ and place your code within the BB Code prompt. This helps others with finding a solution by making it easier to read and easier to copy.
    • You can also use markdown to share your code. When using markdown your code will be automatically converted to BBCode. For help with markdown check out the markdown guide.
    • Don't share a wall of code. All we want is the problem area, the code related to your issue.


    To learn more about how to use our BBCode feature, please click here.

    Thank you, Code Forum.

JavaScript Refreshing Select tag

rbadis

New Coder
basically I'm calling the below JavaScript function to dynamically add Options to an html tag (Dropdown) and after adding all options I would like to set a specific value or index to be selected, its working and actually the required option is selected but not showing as selected in the dropdown box (see attched screen1).

For testing purposes I've set option 4 to be selected by default as example and it's not showing as selected in required dropdown (green)

but if I click on the dropdown box option 4 is selected, so its like I need to refresh the dropdown or something I've tried something like ctl.refresh() and ctl.reload() and didn't work?
1717709909721.png
1717709948584.png
<select name="Component" id="Component" class="ui-block-a" style="width:100%;height:auto;">
</select>

function addOptions(id)
{ var res=#server(..SetComponents(id))#
var ctl = document.getElementById('Component');
var dt=res.split('|')
var vals=dt[0].split('^')
var display=dt[1].split('^')
for (var i=1; i<vals.length; i++)
{
var opt = document.createElement('option');
opt.value = vals;
opt.innerHTML =display
ctl.appendChild(opt);
if (i==3)
{opt.selected=true;}

} ctl.options.selectedIndex=3; }
//$('#Component').prop('selectedIndex',1);

//ctl.options.selectedIndex=3;
I've tried diffrent code and yes they seems to select a specific option as required but not showing as default selected at the top of the list (screen2)?

Thanks
 
I am not sure what the SetComponents line is, is that valid JS?

You are setting opt.value to be vals however, that is an array. The same thing is going on with the option label. Plus, you are setting the values to be the exact same thing for every iteration of your for loop.
 

New Threads

Latest posts

Buy us a coffee!

Back
Top Bottom