Hello,
I am showing two dropdowns in grid toolbar. Dropdowns are appearing correctly in toolbar but both dropdowns show same contents when opened.
The code I used to show drop down buttons is as below:-
toolbar: {
items: [
{
type: 'button',
label: "Export",
cls: 'btn btn-secondary btn-sm',
attr: 'id="Exportdropdownoption"'
},
{
type: 'button',
label: "Grid settings",
cls: 'btn btn-secondary btn-sm',
attr: 'id="Gridsettingsdropdownoption"'
},
]
}
In grid's complete method I did styling for buttons so that they will appear as dropdowns:
complete: function (evt, ui) {
$("#Exportdropdownoption").replaceWith('<button class="btn btn-outline-primary btn-sm dropdown-toggle" type="button" id="Exportdropdownoption" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Export data</button><div class="dropdown-menu" aria-labelledby="Exportdropdownoption"><a class="dropdown-item" href="javascript: void (0);"onclick="ExportData()">Export Data</a><a class="dropdown-item" href="javascript: void (0);" onclick="ExportGridView()">Export grid view</a></div>');
$("#Gridsettingsdropdownoption").replaceWith('<button class="btn btn-outline-primary btn-sm dropdown-toggle" type="button" id="Gridsettingsdropdownoption" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Grid settings</button><div class="dropdown-menu" aria-labelledby="Gridsettingsdropdownoption"><a class="dropdown-item" href="javascript: void (0);"onclick="ResetProjectMappingGrid()">Reset grid</a><a class="dropdown-item" href="javascript: void (0);" onclick="SaveProjectMappingGridSetting()">Save grid settings</a><a class="dropdown-item" href="javascript: void (0);" onclick="RestoreProjectMappingGridSetting()">Restore default grid settings</a></div>');
},
But the grid shows same contents in both dropdowns as attached in this topic.
Looking for help.
Thanks,
Dilip
