Home/ Questions/Q 8778589
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T19:34:39+00:00

I’ve created a layout with Maqetta. Now I want to add the logic to

  • 0

I’ve created a layout with Maqetta. Now I want to add the logic to the layout. Therefore I have downloaded the whole workspace from Maqetta and imported the files/libaries into a new Rails project. At first I had some problems, that Rails didn’t loaded the dojo,js file, but I’ve solved that problem.
Now I have another problem. The page won’t render. I’ve commented everything out except one widget (a button) and this works fine. But if I undo this, nothing happens. Unfortunately I also don’t get any warnings/errors or anything like that from dojo.
After a little bit trying, I changed the parseOnLoad property and now I get a warning:

Unhandled Error: Tried to register widget with id==appLayout but that id is already registered

Here is the include tag:

<%= javascript_include_tag "lib/dojo/dojo/dojo", :'data-dojo-config' => "'async':true,
        'packages':[{'name':'maqetta','location':'../../maqetta'},{'name':'gridx','location':'../gridx'},{'name':'clipart','location':'../../clipart'},{'name':'shapes','location':'../../shapes'},
        {'name':'maqettaSamples','location':'../../../samples'},{'name':'zazl','location':'../../zazl'},{'name':'widgets','location':'../../custom'}]" %>

Here is the HTML part (I have simplified it, and now I’m just useing the example from the tutorial):

<body class="claro" data-maq-flow-layout="true" data-maq-ws="collapse" id="myapp" data-maq-appstates="{}">

<input type="button" data-dojo-type="dijit.form.Button" intermediateChanges="false" label="Search" iconClass="dijitNoIcon" onclick="alert('hi');"></input>
<div
id="appLayout" class="demoLayout"
data-dojo-type="dijit/layout/BorderContainer"
data-dojo-props="design: 'headline'">
    <div
    class="centerPanel"
    data-dojo-type="dijit/layout/ContentPane"
    data-dojo-props="region: 'center'">
        <div>
            <h4>Group 1 Content</h4>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
        </div>
        <div>
            <h4>Group 2 Content</h4>
        </div>
        <div>
            <h4>Group 3 Content</h4>
        </div>
    </div>
    <div
    class="edgePanel"
    data-dojo-type="dijit/layout/ContentPane"
    data-dojo-props="region: 'top'">Header content (top)</div>
    <div
    id="leftCol" class="edgePanel"
    data-dojo-type="dijit/layout/ContentPane"
    data-dojo-props="region: 'left', splitter: true">Sidebar content (left)</div>
</div>

And here is the parser:

require(["dojo/parser","dojo/domReady!"], function(parser){
     parser.parse();
});

I’m trying for hours now, and I’m still as clueless as at the beginning. Has somebody an idea what I can try?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Unhandled Error: Tried to register widget with id==appLayout but that id is already registered

    This error is because you are parsing twice. Once on load and second in the require statement. The second parse will try registering a second widget with the same id, thus the error.

    Remove one of the parsing calls and give the border container a specific width and height.

    <div id="appLayout" class="demoLayout" 
  data-dojo-type="dijit/layout/BorderContainer"
  data-dojo-props="design: 'headline'"     
  style="width: 800px; height: 400px">
    • 0