Modular Window(Modal) and JqxTabs are not working together

[nandkumarpansareParticipant]

Hello Team,

I am using widgets tabs with tabs div id ‘accessReqConfrimationTabs’ inside my application but when i am trying to remove the tabs i am getting error.

Observation : when i am putting div of tabs outside of modular window (modal with id = “myModal”) then tabs remove is working fine but because of it is inside of modular window it is not working . not sure what is conflicting between modular window class and tabs. Please help.

Getting error :
TypeError: this._selectionTracker is undefined

when i am removing ‘selectionTracker: true’ from tabs creation code then i am getting error as
TypeError: this._headerWrapper is undefined

—————————————————————
//JSP Code

<div class=”modal fade” id=”myModal” tabindex=”-1″ role=”dialog” aria-labelledby=”myModalLabel” aria-hidden=”true”>
<div class=”modal-dialog”>
<div class=”modal-content”>
<div class=”modal-header”>
<button type=”button” id=”popupTopCloseButton” class=”close” data-dismiss=”modal”><span aria-hidden=”true”>×</span><span class=”sr-only”>ClOSE</span></button>
<h4 class=”modal-title” id=”myModalLabel”>Access Request Confirmation List</h4>
</div>

<div class=”modal-body”>

<div id=’accessReqConfrimationTabs’>

<li style=”margin-left: 30px;”>Additional Account Options
• Confirm Access Request
• Terms And Conditions

<div id=”tab1″>
tab1 data
</div>
<div id=”tab2″>
tab2 data
</div>
<div id=”tab3″>
tab3 data
</div>

</div>
</div>

<div class=”modal-footer”>
<button type=”button” class=”btn btn-default” data-dismiss=”modal”>CANCEL</button>
SUBMIT
</div>
</div>
</div>
</div>
———————————

// tabs creation
$(‘#accessReqConfrimationTabs’).jqxTabs({
width: ‘100%’,
height: 400,
position: ‘top’,
selectionTracker: true
});

———————————

//code to remove the tabs at position

$(‘#accessReqConfrimationTabs’).jqxTabs(‘removeAt’, 2);

I am using JQuery with jquery-1.11.1.min.js and JQWidgets 3.7.1 and included jqxtabs.js

[ivailoParticipant]

Hi Nandkumar,

We recommend to be used the latest version(3.8.2).

Also for better compatibility try to use jqxWindow in modal mode. This will solve your problem.
Please try this demo.

Best Regards,
Ivailo Ivanov

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts