Load Page in Div Conflict

[Rodolfo HillParticipant]

I have a problem

1) I develop a System that has a menu, and will have like 30 programs
2) The menu is similar to https://www.jqwidgets.com/jquery-widgets-demo/demos/interactivedemos/fitnessmanager/

<div style=”background-color: white; height:80px;”>
<div style=”max-width: 1200px; margin: 0px auto 0px auto;”>

<!– <div id=’jqxWidget’ style=’height: 300px;’> –>
<div id=’jqxMenu’ style=’visibility: hidden; margin-left: 5px; margin-top: 20px;’></div>

</div>
</div>

<div class=”breadcrumb-containter”>
<div class=”breadcrumb”> <span>Sistema de Auditorias</span>
<span id=”page”></span></div>
</div>

3) Within the menu create a div (content), where I load the menu options (which are html pages), as

   <div id = “content”> </ div>

$.ajax({
type: ‘POST’,
url: “/getPage”,
contentType: “application/x-www-form-urlencoded”,
//datatype : “text/plain”,
data: {
opcion: event.args.id
},
success: function (data, textStatus, xhr) {

if(data.length > 0) {

$(“#content”).load(data);

}

}
});

   where data is the name of an html
  �
4) All the java scripts of jqwidgets (they are in the page menu.html) only.
5) Almost all options use grid, with windows and inside each window with form.
6) Most pages (htmls) have 2 o 3 grids, one or two nested

The options (htmls) do not include the jqwidgets js

when I was testing the application note that some buttons inside forms that are embedded in a window, did not have the theme and did not respond to the click event. This happened when I visit the program in the second selected option or the second option. If it was the first option the program worked well.

Initially I cleaning the div, removing the div and creating it, etc. After 5 hours, detect
that the problem is that the id of some buttons is repeated, but in different programs = options = html.

I do not want to have to change the id of each button in each html.
Since some grid also have similar names and I consider that this is not the root solution

Later I tried many alternatives, and I still have the problem. I have tried with jqxsplitter
and the behavior is similar

How can I solve the problem I have?
Is there any recommendation by jqwidgets, how to fix this?
What is the comendations for mañage options (programs) ?

thans

[HristoParticipant]

Hello Rodolfo Hill,

I would like to suggest you look at this demo:
https://www.jqwidgets.com/jquery-widgets-demo/demos/jqxtabs/wizard.htm?light

If you use classes for different buttons I would like to suggest you invest their parent and based on this to add different logic.
Also, if you create buttons in jqxWindows it will be better to use initContent of the Window. You could collect reference for each one button.

I saw in your example the word “breadcrumb” and I would suggest you look at this forum topic:
https://www.jqwidgets.com/community/topic/click-button/
(also, this demo)

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[Author]

Posts