ow do I change panel width dynamically?

[SerdarParticipant]

hello I’m using dynamic expanding div,How do I change panel width dynamically? (leftPanel)
example : left panel

droplist checkbox

   $("#ItemChoice").on('checkChange', function (event) {
            if (event.args) {
                var item = event.args.item;
                if (item.Label==='Country') {
                  $('#mainSplitter'){ ? };  
                }
            }
        });
 
 

 <div id="mainSplitter">
    <div id="leftPanel">
    </div>
    <div>
        <div id="rightPanel">
            <div id="CrewTopDetail">
            </div>
            <div id="bottomPanel">
            </div>
        </div>
    </div>
</div>

 $(‘#mainSplitter’).jqxSplitter({ width: ’100%’, height: ’730px’, panels: [{ size: 310, min: 310, max: 410 }, { size: 650, collapsible: false }] });
$(‘#rightSplitter’).jqxSplitter({ width: ’100%’, height: ’100%’, orientation: ‘horizontal’, panels: [{ size: 150, max: 150, min: 150, collapsible: false }] }); 

thank you

[Peter StoevKeymaster]

Hi Serdar,

You can use the following sample as a solution: http://jsfiddle.net/rL4LP/. The Splitter’s panels property is set. Btw, if you use percentage size, use them as width for splitter and panels. It is also wrong to set panels size to a Fixed number when the Splitter’s size is in percentages, because 310 + 650 in your case could be less or more than the Splitter’s total size which is “100%”.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[SerdarParticipant]

thank you so much peter

[Author]

Posts