cancel
Showing results for 
Search instead for 
Did you mean: 
SOLVED

Open virtual keypads by JavaScript

Open virtual keypads by JavaScript

HmiGuide
Community Moderator
Community Moderator
I want to open the virtual numeric keypad, when pressing a button. I do not want to use a input field because of design issues. Can anybody provide an example for both keypads: - numeric keypad (for interger and float) - textual keypad (for text) I'm not able to find this information in the documentation.
3 REPLIES 3

HmiGuide
Community Moderator
Community Moderator
Hello WebIQ, can you please give some hints where to find this information in the documenatation or share an example.

webiq-sk
Frequent Contributor

The numpad and overlay keyboards are opened automatically in WebIQ if enabled and cannot be triggered manually.

HmiGuide
Community Moderator
Community Moderator

Define a UI Action with a parameter ItemName (parameters[0]) and call shmi.numpad(p).

(function() {
    var actions = shmi.pkg("visuals.session.userActions"); //get reference to userActions object
    actions["_Open-NumPad"] = function(parameters) {
    const im = shmi.visuals.session.ItemManager;
    oVal = im.readValue(params[0]);
    if (oVal===null) {
        alert(params[0] + " item not defined");
    } else {
        let p = {
            unit:      "",   // unit for display
            label:     "",   // label for display
            value:     oVal, // initial value for edit
            callback:  function(value) {
                im.writeValue(p.item, value);
            },
            min:       0,    // min. value
            max:       100,  // max. value
            type:      2,    // 2=INT 3=REAL
            precision: 2,    // number of digits
            item:      parameters[0]  // item name e.g. "SInt"
        };
        shmi.numpad(p);
    }   
    };
}());
 

 

Icon--AD-black-48x48Icon--address-consumer-data-black-48x48Icon--appointment-black-48x48Icon--back-left-black-48x48Icon--calendar-black-48x48Icon--center-alignedIcon--Checkbox-checkIcon--clock-black-48x48Icon--close-black-48x48Icon--compare-black-48x48Icon--confirmation-black-48x48Icon--dealer-details-black-48x48Icon--delete-black-48x48Icon--delivery-black-48x48Icon--down-black-48x48Icon--download-black-48x48Ic-OverlayAlertIcon--externallink-black-48x48Icon-Filledforward-right_adjustedIcon--grid-view-black-48x48IC_gd_Check-Circle170821_Icons_Community170823_Bosch_Icons170823_Bosch_Icons170821_Icons_CommunityIC-logout170821_Icons_Community170825_Bosch_Icons170821_Icons_CommunityIC-shopping-cart2170821_Icons_CommunityIC-upIC_UserIcon--imageIcon--info-i-black-48x48Icon--left-alignedIcon--Less-minimize-black-48x48Icon-FilledIcon--List-Check-grennIcon--List-Check-blackIcon--List-Cross-blackIcon--list-view-mobile-black-48x48Icon--list-view-black-48x48Icon--More-Maximize-black-48x48Icon--my-product-black-48x48Icon--newsletter-black-48x48Icon--payment-black-48x48Icon--print-black-48x48Icon--promotion-black-48x48Icon--registration-black-48x48Icon--Reset-black-48x48Icon--right-alignedshare-circle1Icon--share-black-48x48Icon--shopping-bag-black-48x48Icon-shopping-cartIcon--start-play-black-48x48Icon--store-locator-black-48x48Ic-OverlayAlertIcon--summary-black-48x48tumblrIcon-FilledvineIc-OverlayAlertwhishlist