disable last toolbar button - Angular, Vue, React, Web Components, Javascript, HTML5 Widgets

Tagged: disableTool, jqxToolBar

This topic contains 2 replies, has 2 voices, and was last updated by pepe 6 years, 10 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)

Author

disable last toolbar button Posts
February 24, 2018 at 11:42 pm disable last toolbar button #98903

pepe
Participant

Good evening, I tell you about the problem that I have. I want that when loading the page only the last two buttons of the toolbar are disabled.
The problem is that the last button is not disabled.
A greeting.

<!DOCTYPE html>
<html lang=”en”>
<head>
<title id=”Description”>jqxToolBar automatically separates buttons in groups, which
are specified by inserting separators (“|”) in the tools definition.</title>
<meta name=”description” content=”jqxToolBar automatically separates buttons in groups, which are specified by inserting separators (‘|’) in the tools definition.” />
<link rel=”stylesheet” href=”jqwidgets/styles/jqx.base.css” type=”text/css” />
<meta http-equiv=”X-UA-Compatible” content=”IE=edge,chrome=1″ />
<meta name=”viewport” content=”width=device-width, initial-scale=1 maximum-scale=1 minimum-scale=1″ />
<style type=”text/css”>
.buttonIcon
{
margin: -5px 0 0 -2px;
width: 18px;
height: 17px;
}
</style>
<script type=”text/javascript” src=”scripts/jquery-1.12.4.min.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxcore.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxbuttons.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxtoolbar.js”></script>
<script type=”text/javascript” src=”scripts/demos.js”></script>
<script type=”text/javascript”>
$(document).ready(function () {
$(“#jqxToolBar”).jqxToolBar({ width: 400, height: 35, tools: ‘button button button button button button’,
initTools: function (type, index, tool, menuToolIninitialization) {
var icon = $(“<div class=’jqx-editor-toolbar-icon jqx-editor-toolbar-icon-” + theme + ” buttonIcon’></div>”);

$(“#jqxToolBar”).jqxToolBar(“disableTool”, 3, true);
$(“#jqxToolBar”).jqxToolBar(“disableTool”, 4, true);
$(“#jqxToolBar”).jqxToolBar(“disableTool”, 5, true);

switch (index) {
case 0:
icon.addClass(“jqx-editor-toolbar-icon-bold jqx-editor-toolbar-icon-bold-” + theme);
icon.attr(“title”, “Bold”);
tool.append(icon);
break;
case 1:
icon.addClass(“jqx-editor-toolbar-icon-italic jqx-editor-toolbar-icon-italic-” + theme);
icon.attr(“title”, “Italic”);
tool.append(icon);
break;
case 2:
icon.addClass(“jqx-editor-toolbar-icon-underline jqx-editor-toolbar-icon-underline-” + theme);
icon.attr(“title”, “Underline”);
tool.append(icon);
break;
case 3:
icon.addClass(“jqx-editor-toolbar-icon-justifyleft jqx-editor-toolbar-icon-justifyleft-” + theme);
icon.attr(“title”, “Align Text Left”);
tool.append(icon);
break;
case 4:
icon.addClass(“jqx-editor-toolbar-icon-justifycenter jqx-editor-toolbar-icon-justifycenter-” + theme);
icon.attr(“title”, “Center”);
tool.append(icon);
break;
case 5:
icon.addClass(“jqx-editor-toolbar-icon-justifyright jqx-editor-toolbar-icon-justifyright-” + theme);
icon.attr(“title”, “Align Text Right”);
tool.append(icon);
break;
}
}
});
});
</script>
</head>
<body>
<div id=”jqxToolBar”>
</div>
</body>
</html>

February 26, 2018 at 9:48 am disable last toolbar button #98905

Stanislav
Participant

Hello pepe,

We did some test and that re-created this behavior.

Thank you for the report! This will be resolved in the near future.

Best Regards,
Stanislav

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

February 26, 2018 at 8:23 pm disable last toolbar button #98912

pepe
Participant

Thanks for the answer, but how can I do so that when I load the page the last button appears disabled.

A greeting.
Author

Posts

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.