CODEWITHSUNDEEP
jquery
Majid Fouladpour
Majid Fouladpour

Reputation: 30272

JQuery fails to set the correct value of select

This is the markup:

<select id="fontsize">
    <option value="8pt">8pt</option>
    <option value="10pt">10pt</option>
    <option value="12pt">12pt</option>
    <option value="14pt">14pt</option>
    <option value="18pt">18pt</option>
    <option value="24pt">24pt</option>
    <option value="36pt">36pt</option>
</select>

and I have this in ready function:

$(document).ready(function(){

    // init
    $('#fontsize').val(font_size);
    ...
});

and fontsize is a global variable set to '14pt'

<script type="text/javascript">
var font_size = '14pt';
...

but when the page is viewed, the select shows the first option ('8pt'). In firebug console the same instruction, $('#fontsize').val(font_size);, successfully changes the select; why is is failing in ready?

Live page here. Link updated

Upvotes: 1

Views: 121

Answers (1)

regilero
regilero

Reputation: 30546

Your "14pt" is set when you ask for it but the call to columnize seems to reinit all elements (use Firebug breakpoints to see code execution step by step). Trying to call columnize() before seems to fix the problem.

$('#ipsum').columnize({columns:nc}); 
$('#fontsize').val(font_size);
set_style();

Upvotes: 2

Related Questions