Hello!
I believe the problem here is that it seems your code is preventing
Require.js from being loaded, thus causing the Uncaught TypeError: require
is not a function error and completely breaking the whole Tapestry's own
JavaScript. I'd try avoiding overriding/adding again the jQuery library,
which is included automatically when you use the jquery infrastructure,
then have your pms stack depend on the core stack (so it's guaranteed
jQuery and Require.js get included in the page).
On Mon, Jul 26, 2021 at 12:45 PM fred fred <fred54...@gmail.com> wrote:
> Hello!
>
> Almost 7 Several years ago I developed an application with Tapestry 5.3.8 +
> EasyUI 1.3.5 (with JQuery 1.8.3) + tomcat 8.0+JDK8+Spring+OpenJPA. Now for
> some reason I have to migrate the JDK8 to OpenJDK11. So I have to upgrade
> Tapestry to version 5.5.0 or higher. I did below things:
>
> JqueryStack.java (same as that in the application with Tapestry 5.3.8)
>
> public class JqueryStack implements JavaScriptStack {
> ...
> @Override
> public List<Asset> getJavaScriptLibraries() {
> List<Asset> ret = new ArrayList<Asset>();
> ret.add(assetSource.getContextAsset("jquery/jquery-1.8.3.min.js", null));
> ret.add(assetSource.getContextAsset("jquery/jquery.json-2.4.min.js",null));
> ret.add(assetSource.getContextAsset("jquery/jquery.easyui.min.js", null));
> ret.add(assetSource.getContextAsset("jquery/validatebox-filter.js",null));
> ret.add(assetSource.getContextAsset("jquery/easyui-lang-zh_CN.js", null));
> ret.add(assetSource.getContextAsset("jquery/datagrid-groupview.js", null));
> ret.add(assetSource.getContextAsset("jquery/datagrid-pagerfilter.js",
> null));
> ret.add(assetSource.getContextAsset("jquery/jquery.ajaxfileupload-min.js",
> null));
> ret.add(assetSource.getContextAsset("jquery/noconflict.js", null));
> ret.add(assetSource.getContextAsset("script/pms.obj.min.js", null));
> ret.add(assetSource.getContextAsset("script/pms.min.js", null));
> return ret;
> }
>
> AppModule.java
> @Contribute(SymbolProvider.class)
> @ApplicationDefaults
> public static void setupEnvironment(MappedConfiguration<String, Object>
> configuration)
> {
> configuration.add(SymbolConstants.JAVASCRIPT_INFRASTRUCTURE_PROVIDER,
> "jquery");
> }
> @Core
> @Contribute(JavaScriptStack.class)
> public static void overrideJquery(OrderedConfiguration<StackExtension>
> conf) {
> conf.override("jquery-library",
> StackExtension.library("context:jquery/jquery-1.8.3.min.js"));
> }
> @Contribute(JavaScriptStackSource.class)
> public static void addMyStack(
> MappedConfiguration<String, JavaScriptStack> configuration) {
> configuration.addInstance("pms", JqueryStack.class);
> }
>
> Then in Layout.java,
> @SetupRender
> void initScript() {
> javaScriptSupport.importStack("pms");
> }
>
> Deployed and started:
> The EasyUI tags are parsed and pages could be rendered correctly. But Tabs
> and Dialog did not works:
> Dialogs:
> <a href="javascript:changePass(1)">Administrator</a>
>
> function changePass(userId) {
> var href = contextPath + "/user/gadget/changepass";
> if (userId != null) {
> href += "/" + userId;
> }
>
> jQuery('#dd_edit').dialog({
> title : PMS.Messages.dialog_upass_change,
> width : 300,
> height : 190,
> closed : false,
> cache : false,
> href : href,
> modal : true,
> buttons : [ {
> text : PMS.Messages.btn_save_label,
> iconCls : 'icon-save',
> handler : saveUserPass
> } ],
> onLoad : function() {
> loadAdminView(userId);
> },onBeforeOpen:doNothing
> });
> }
>
> function loadAdminView(userId){
> if(userId != null){
> jQuery('.admin').hide();
> jQuery('#opassword').validatebox('disableValidation');
> }
> }
>
> When clicked on Administrator link, a blank page displayed, and browser
> console showed:
> pms.js.1.0.7.js (minified JavaScript library):4 Uncaught TypeError: require
> is not a function.
>
> It seems the RequireJS is not initialized.
>
> Tabs problem:
> <div id="page_tabs" class="easyui-tabs">
> <div title="${message:tab_structure}" style="padding:0 10px 10px 10px;">
> <div style="margin:10px;">
> <t:if test="isMaster">
> <a href="javascript:void(0)" class="easyui-linkbutton" onclick="addfund()"
> data-options="plain:true,iconCls:'icon-add'">${message:btn_fund_add}</a>
> <p:else>
> <a t:type="pagelink" page="structure/member" context="literal:list"
> class="easyui-linkbutton"
>
> data-options="plain:true,iconCls:'icon-back'">${message:btn_return}${workspace.masterFund.fundName}</a>
> </p:else>
> </t:if>
> <a href="javascript:void(0)" class="easyui-linkbutton"
> onclick="addpartner()"
> data-options="plain:true,iconCls:'icon-add'">${message:btn_partner_add}</a>
> </div>
> <table class="easyui-datagrid" data-options="onLoadSuccess:genDescTip"
> style="height:435px;">
> <thead>
> <tr>
> <th
>
> data-options="field:'name',width:fixWidthTable(0.10)">${message:column_name}</th>
> <th
>
> data-options="field:'fullName',width:fixWidthTable(0.25)">${message:column_full_name}</th>
> <th
>
> data-options="field:'holderType',width:fixWidthTable(0.10)">${message:column_type}</th>
> <th
>
> data-options="field:'joinTime',width:fixWidthTable(0.10)">${message:column_join_time}</th>
> <th
>
> data-options="field:'subscribeAmount',width:fixWidthTable(0.10),formatter:numberFormatter">${message:column_subscribe_amount}</th>
> <th
>
> data-options="field:'raiseFee',width:fixWidthTable(0.10),formatter:numberFormatter">${message:column_raise_fee}</th>
> <th
>
> data-options="field:'participationFee',width:fixWidthTable(0.10),formatter:numberFormatter">${message:column_participation_fee}</th>
> <th
>
> data-options="field:'description',width:fixWidthTable(0.05),formatter:formatDescription">${message:column_description}</th>
> <th
>
> data-options="field:'operation',width:fixWidthTable(0.08),align:'center'">${message:column_operations}</th>
> </tr>
> </thead>
> <tbody>
> <tr t:type="Loop" t:source="funds" t:value="fund">
> <td>
> <t:pagelink page="structure/member"
> context="${parentNav}_${fund.holder.holderId}">${fund.fundName}
> </t:pagelink>
> </td>
> <td>${fund.fullName}</td>
> <td>${messages.get(fund.fundType)}</td>
> <td>
> <t:output format="format" value="fund.setupAt" />
> </td>
> <td></td>
> <td></td>
> <td></td>
> <td>${fund.description}</td>
> <td>
> <a href="javascript:editfund(${fund.fundId})"
> class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-edit'">
> </a>
> </td>
> </tr>
> <tr t:type="Loop" t:source="partners" t:value="partner">
> <td>${partner.partnerName}</td>
> <td>${partner.fullName}</td>
> <td>${messages.get(partner.partnerType)}</td>
> <td>
> <t:output format="format" value="partner.setupAt" />
> </td>
> <td>${partner.baseValue}</td>
> <td>${partner.raiseFee}</td>
> <td>${getPartiFee(partner)}</td>
> <td>${partner.description}</td>
> <td>
> <a href="javascript:viewpartner(${partner.partnerId})"
> class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-tip'">
> </a>
> </td>
> </tr>
> </tbody>
> </table>
> </div>
> <div title="${message:tab_cashin}" style="padding:0 10px 10px 10px;"
>
> data-options="cache:false,href:'${contextPath}/structure/gadget/listcashin'">
> </div>
> </div>
>
> When clicked on the tab:
> <div title="${message:tab_cashin}" style="padding:0 10px 10px 10px;"
>
> data-options="cache:false,href:'${contextPath}/structure/gadget/listcashin'">
> </div>
>
> Exceptions showed:
> pms.js.1.0.7.js:4 Uncaught TypeError: require is not a function
>
> The same error. It seems the RequireJS is not initialized.
>
> I tried different versions of JQuery. For JQuery 1.8.3, if the lib is not
> included into the JavaScript stack:
> @Override
> public List<Asset> getJavaScriptLibraries() {
> List<Asset> ret = new ArrayList<Asset>();
> //ret.add(assetSource.getContextAsset("jquery/jquery-1.8.3.min.js", null));
> ret.add(assetSource.getContextAsset("jquery/jquery.json-2.4.min.js",null));
> ret.add(assetSource.getContextAsset("jquery/jquery.easyui.min.js", null));
>
> The EasyUI tags will not be parsed, the page is a mess. I checked the
> core.js, it's there. If putting it in the JS library, the pages are parsed
> fine. But obviously the Jquery lib is duplicated.
>
> But if using JQuery 3+, don't need Jquery.js to be put inJS libraries, just
> let it in the core.js, the page would be parsed. Tabs and Dialog did not
> work with Jquery 3.1 either. But this time no errors are reported in the
> browser console.
>
> This bothered me for a long time. If you ever experienced such problems or
> if you have any suggestions, I will appreciate it greatly.
>
> Thank you very much.
>
> Fred
>
--
Thiago
