How to fix New Promise not support in IE browser issue?

we can use New Promise function to write asyncronization call to improve the application performance.

here is sample call to use the New Promise feature from ES6/Javascript

loadLanguage: function () {
                   return new Promise(
                        function (resolve, reject) {
                            var PreferredLanguages = [{ Description: "English", Code: "en" },
                             { Description: "French", Code: "fr" }];
                            dataViewModel.preferredLanguages(PreferredLanguages);
                            if (PreferredLanguages) {
                               
                                resolve(PreferredLanguages);
                            }
                            else{
                                reject("no Language load");
                            }
                        }
                    );
            },


however this feature is currently not support by all browser which it does not work in IE11 and below.

fortunately we still can make it work around with $.Deferred from JQuery

the code below will demonstrate the same result as the previous code within  new Promise constructor.

 loadLanguage: function () {
                var deferred = $.Deferred();

                var PreferredLanguages = [{ Description: "English", Code: "en" },
                { Description: "French", Code: "fr" }];
                dataViewModel.preferredLanguages(PreferredLanguages);
                if (PreferredLanguages) {

                    deferred.resolve(PreferredLanguages);
                }
                else {
                    deferred.reject("no Language load");
                }
                return deferred.promise();
            },

how to prevent user to close your modal popup with ESC key?

it is very useful to have a modal to block the page content being accessed by user, when we allow user to modify the data in the Modal Popup. However, the user can close the modal by press the Escape key without clicking on the close button.

the fix is quite easy, we just have to add a new element attribute data-keyboard="false" to the DIV

here is sample code to prevent the user close the modal by pressing the escape

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-keyboard="false" style="overflow-y: auto;">

How to customize the Canada Post Autocomplete in its Option Setting?

if you initialize the Canada Post Autocomplete in the docment ready event or anything script loading event. we can handle it with the following code.


 var fields = [
             {
                 element: customerType + "street-address", field: "Line1"
             },
             {
                 element: "street-address2", field: "Line2", mode: pca.fieldMode.POPULATE
             },
             {
                 element: "city", field: "City", mode: pca.fieldMode.POPULATE
             },
             {
                 element: "province", field: "ProvinceCode", mode: pca.fieldMode.POPULATE
             },
             {
                 element: "postalCode", field: "PostalCode"
             },
             { element: "country", field: "CountryIso3", mode: pca.fieldMode.COUNTRY }
        ],
           options = {
               key: myKey,
               countries: {defaultCode: "CAN", value: "CAN", prepopulate: false, populate:false},
               bar: { visible: false, showCountry: false, showLogo: true, logoLink: false, logoClass: "aclogo"}
                  
            },

          control = new pca.Address(fields, options);

there is an Options paramenters on new Canada Post Address Autocomplete initialization, which will allow us to customize the look and features on the address autocomplete control. the picture shows all the settings that allow us modified in the control

here is the rule for setting up your own values

Key:Value

if there is a group in one attribute. then we have to the curly bracket to organize them together.

Key:{key1:value1, key2:value2......................}

How to implement localization on MVC web application with ActionFilterAttribute?

when we implement the asp.net web application. we can easily to localize the web UI with Resource files. we just need to override the InitializeCulture Method in the Page class to initialize the Culture and UICulture information for the page.

However the approach is quite different in the MVC app implement. we will create new ActionFilterAction attribute to render the content in the OnActionExecuting event.


 public override void OnActionExecuting(ActionExecutingContext filterContext)
        {
            your business logic on localization handling
        }

put the above inside your class that extend the ActionFilterAttribute.

public class LanguageAttribute : ActionFilterAttribute
    {
    
        public override void OnActionExecuting(ActionExecutingContext filterContext)
        {
            //put yPostsour logic here to handle the localization
        }
    }