This following customization will show you how to implement Alertify Code into Javascript Template Files that used by PHPMaker 10.0.1. There are some files that need to be modified so that we can use the Alert and Confirmation Dialog Box code from Alertify properly. In other words, we will not use the built-in alert and confirmation dialog box from the browser anymore. Let's use Alertify for displaying alert and confirmation dialog box.




I wrote this customization in this article just wanted to let you know about the changes that should be applied into the template. However, I strongly not recommend you to customize your PHPMaker template by following the changes in this article, as this customization has been handled nicely by MasinoFixedWidthSite10 extension. You should use this extension instead of customizing your PHPMaker template by yourself. I wrote this article in order to keep the documentation regarding the changes I made, since this is very useful for me if I want to make the next changes for the next release of PHPMaker.
I think, this might be useful for you to see how we can implement Alertify easily into PHPMaker template. That's why now I was sharing this to you, too.
[hidepost]
-
Open \Script\ewp.js file, and find this code:
// Submit selected records for update/delete/custom action function ew_SubmitSelected(f, url, msg, action) { if (!f) return; if (!ew_KeySelected(f)) { alert(ewLanguage.Phrase("NoRecordSelected")); } else { if ((msg) ? ew_Confirm(msg) : true) { var $ = jQuery, $f = $(f); if (action) $("<input/>").attr({ type: "hidden", name: "useraction" }).val(action).appendTo($f); $f.prop("action", url).submit(); } } }
then change it become:
// Submit selected records for update/delete/custom action function ew_SubmitSelected(f, url, msg, action) { if (!f) return; if (!ew_KeySelected(f)) { alertify.alert(ewLanguage.Phrase("NoRecordSelected")); // Modification Alertify by Masino Sinaga, October 14, 2013 } else { var $ = jQuery, $f = $(f); //if ((msg) ? ew_Confirm(msg) : true) { if ((msg) ) { // ? ew_Confirm(msg) : true // Begin of modification Alertify by Masino Sinaga, October 14, 2013 alertify.confirm(msg, function (ask) { // if confirm, then multiple-delete if (ask) { // begin of moved out if (action) $("<input/>").attr({ type: "hidden", name: "useraction" }).val(action).appendTo($f); $f.prop("action", url).submit(); // end of moved out return true; } else { return false; }}); // End of modification Alertify by Masino Sinaga, October 14, 2013 // moved out to above ... } else { $f.prop("action", url).submit(); // no confirmation, then multiple-update } } }
-
Still in the \Script\ewp.js file, find again this code:
// Submit selected records for export function ew_SubmitSelectedExport(f, a, val) { if (!f) return; if (!ew_KeySelected(f)) { alert(ewLanguage.Phrase("NoRecordSelected")); } else { if (f.exporttype && val) f.exporttype.value = val; f.submit(); } }
then change it become:
// Submit selected records for export function ew_SubmitSelectedExport(f, a, val) { if (!f) return; if (!ew_KeySelected(f)) { alertify.alert(ewLanguage.Phrase("NoRecordSelected")); // Modification Alertify by Masino Sinaga, October 14, 2013 } else { if (f.exporttype && val) f.exporttype.value = val; f.submit(); } }
-
Still in the \Script\ewp.js file, find again this code:
// Show error message function ew_OnError(frm, el, msg) { alert(msg); if (frm) { if (frm.MultiPage) { // Multi-page frm.MultiPage.GotoPageByElement(el); } else if (frm.$Element.is("div")) { // Multiple Master/Detail var $pane = frm.$Element.closest(".tab-pane"); if ($pane[0] && !$pane.hasClass("active")) $pane.closest(".tabbable").find("a[data-toggle=tab][href='#" + $pane.attr("id") + "']").click(); } } jQuery.later(100, this, "ew_SetFocus", el); // Focus later to make sure editors are created return false; }
then change it become:
// Show error message function ew_OnError(frm, el, msg) { alertify.alert(msg); // Modification Alertify by Masino Sinaga, October 14, 2013 if (frm) { if (frm.MultiPage) { // Multi-page frm.MultiPage.GotoPageByElement(el); } else if (frm.$Element.is("div")) { // Multiple Master/Detail var $pane = frm.$Element.closest(".tab-pane"); if ($pane[0] && !$pane.hasClass("active")) $pane.closest(".tabbable").find("a[data-toggle=tab][href='#" + $pane.attr("id") + "']").click(); } } jQuery.later(100, this, "ew_SetFocus", el); // Focus later to make sure editors are created return false; }
-
Still in the \Script\ewp.js file, find again this code:
alert("Server Error " + o.status + ": " + o.statusText);
then change it become:
alertify.alert("Server Error " + o.status + ": " + o.statusText); // Modification Alertify by Masino Sinaga, October 14, 2013
-
Still in the \Script\ewp.js file, find again this code:
if (oArg.sel && !ew_KeySelected(oArg.f)) { alert(ewLanguage.Phrase("NoRecordSelected")); return; }
then change it become:
if (oArg.sel && !ew_KeySelected(oArg.f)) { alertify.alert(ewLanguage.Phrase("NoRecordSelected")); // Modification Alertify by Masino Sinaga, October 14, 2013 return; }
-
Still in the \Script\ewp.js file, find again this code:
// Show message dialog function ew_ShowMessage(msg) { var $ = jQuery, $div = $("div.ewMessageDialog:first"); var html = msg || ($div.length ? (EW_IS_MOBILE ? $div.text() : $div.html()) : ""); if ($.trim(html) == "") return; if (EW_IS_MOBILE) { alert(html); } else { var $dlg = $("#ewMsgBox"); $dlg.find(".modal-body").html(html); $dlg.modal("show"); } }
then change it become:
// Show message dialog function ew_ShowMessage(msg) { var $ = jQuery, $div = $("div.ewMessageDialog:first"); var html = msg || ($div.length ? (EW_IS_MOBILE ? $div.text() : $div.html()) : ""); if ($.trim(html) == "") return; if (EW_IS_MOBILE) { alertify.alert(html); // Modification Alertify by Masino Sinaga, October 14, 2013 } else { var $dlg = $("#ewMsgBox"); $dlg.find(".modal-body").html(html); $dlg.modal("show"); } }
-
Still in the \Script\ewp.js file, find again this code:
if ($.isNumber(cnt) && ar.length > cnt) { alert(ewLanguage.Phrase("UploadErrMsgMaxNumberOfFiles")); return false; } var l = parseInt($fs.val(), 10); if ($.isNumber(l) && l > 0 && ar.join(",").length > l) { alert(ewLanguage.Phrase("UploadErrMsgMaxFileLength")); return false; }
then change it become:
if ($.isNumber(cnt) && ar.length > cnt) { alertify.alert(ewLanguage.Phrase("UploadErrMsgMaxNumberOfFiles")); // Modification Alertify by Masino Sinaga, October 14, 2013 return false; } var l = parseInt($fs.val(), 10); if ($.isNumber(l) && l > 0 && ar.join(",").length > l) { alertify.alert(ewLanguage.Phrase("UploadErrMsgMaxFileLength")); // Modification Alertify by Masino Sinaga, October 14, 2013 return false; }
-
Still in the \Script\ewp.js file, find again this code:
// Delete a row from grid function ew_DeleteGridRow(el, infix) { var $ = jQuery, $grid = $(el).closest("." + EW_GRID_CLASSNAME), $row = $(el).closest("tr"), $tbl = $row.closest("." + EW_TABLE_CLASSNAME); if (!el || !$grid[0] || !$row[0] || !$tbl[0]) return; var rowidx = parseInt($row.data("rowindex"), 10); var $form = $grid.find("div.ewForm[id^=f][id$=grid]"); if (!$form[0]) $form = $grid.find("form.ewForm[id^=f][id$=list]"); var frm = $form.data("form"); if (!$form[0] || !frm) return; var suffix = ($form.is("div")) ? "_" + $form.attr("id") : ""; var keycntname = "#key_count" + suffix; var $elkeycnt = $form.find(keycntname); var cf = ($.isFunction(frm.EmptyRow)) ? !frm.EmptyRow(infix) : true; if (cf && !confirm(ewLanguage.Phrase("DeleteConfirmMsg"))) return; $row.remove(); ew_SetupTable(-1, $tbl[0], true); if (rowidx > 0) { var $keyact = $form.find("#k" + rowidx + "_action" + suffix); if ($keyact[0]) { $keyact.val(($keyact.val() == "insert") ? "insertdelete" : "delete"); } else { $form.find(keycntname).after($("<input>").attr({ type: "hidden", id: "k" + rowidx + "_action" + suffix, name: "k" + rowidx + "_action" + suffix, value: "delete" })); } return true; } return false; }
then change it become:
// Delete a row from grid function ew_DeleteGridRow(el, infix) { var $ = jQuery, $grid = $(el).closest("." + EW_GRID_CLASSNAME), $row = $(el).closest("tr"), $tbl = $row.closest("." + EW_TABLE_CLASSNAME); if (!el || !$grid[0] || !$row[0] || !$tbl[0]) return; var rowidx = parseInt($row.data("rowindex"), 10); var $form = $grid.find("div.ewForm[id^=f][id$=grid]"); if (!$form[0]) $form = $grid.find("form.ewForm[id^=f][id$=list]"); var frm = $form.data("form"); if (!$form[0] || !frm) return; var suffix = ($form.is("div")) ? "_" + $form.attr("id") : ""; var keycntname = "#key_count" + suffix; var $elkeycnt = $form.find(keycntname); var cf = ($.isFunction(frm.EmptyRow)) ? !frm.EmptyRow(infix) : true; //if (cf && !confirm(ewLanguage.Phrase("DeleteConfirmMsg"))) // return; // Begin of modification Alertify by Masino Sinaga, October 14, 2013 if (cf) { alertify.confirm(ewLanguage.Phrase("DeleteConfirmMsg"), function (ask) { if (ask) { $row.remove(); ew_SetupTable(-1, $tbl[0], true); if (rowidx > 0) { var $keyact = $form.find("#k" + rowidx + "_action" + suffix); if ($keyact[0]) { $keyact.val(($keyact.val() == "insert") ? "insertdelete" : "delete"); } else { $form.find(keycntname).after($("<input>").attr({ type: "hidden", id: "k" + rowidx + "_action" + suffix, name: "k" + rowidx + "_action" + suffix, value: "delete" })); } return true; } return false; } else { return; }}); return; // <-- old still used? } // End of modification Alertify by Masino Sinaga, October 14, 2013 // start without confirm below ... $row.remove(); ew_SetupTable(-1, $tbl[0], true); if (rowidx > 0) { var $keyact = $form.find("#k" + rowidx + "_action" + suffix); if ($keyact[0]) { $keyact.val(($keyact.val() == "insert") ? "insertdelete" : "delete"); } else { $form.find(keycntname).after($("<input>").attr({ type: "hidden", id: "k" + rowidx + "_action" + suffix, name: "k" + rowidx + "_action" + suffix, value: "delete" })); } return true; } return false; }
-
Open \Script\ew_addon.js file, and find this code:
alert(ewLanguage.Phrase("NoFieldSelected"));
then change it become:
alertify.alert(ewLanguage.Phrase("NoFieldSelected")); // Modification Alertify by Masino Sinaga, October 14, 2013
-
Still in the \Script\ew_addon.js file, find again this code:
alert(ewLanguage.Phrase("NoAddRecord"));
then change it become:
alertify.alert(ewLanguage.Phrase("NoAddRecord")); // Modification Alertify by Masino Sinaga, October 14, 2013
-
Open \Script\info.php file, and find this code:
return "javascript:alert(ewLanguage.Phrase('InvalidRecord'));";
then change it become:
return "javascript:alertify.alert(ewLanguage.Phrase('InvalidRecord'));"; // Modification Alertify by Masino Sinaga, October 14, 2013
[/hidepost]
Leave a Reply
You must be logged in to post a comment.