Receiving input from the "Enter" key is functional in Internet Explorer but not Firefox when utilized in Cognos

Working with Cognos, I'm currently tackling the challenge of capturing the enter key to validate user input before submitting the prompt.

If you're not familiar with Cognos, that's okay - any insights on my code are welcome :) This tool is primarily designed for creating business reports through a drag-and-drop interface.

On my Cognos prompt page, I've placed a Text Box Prompt and specified a minimum of 3 characters for user input. Enclosed within an HTML div tag, here's how it looks:

<div onKeyDown="return keyMon(event)"> Cognos Text Box </div>

Additionally, I've included another HTML Item housing the keyMon() function which handles key events:

<script>
function keyMon(e3)
{
    var key = e3 || window.event;

    if(key.keyCode == 13){

        var fW = (typeof getFormWarpRequest == "function" ?
        getFormWarpRequest() : document.forms["formWarpRequest"]);
        if ( !fW || fW == undefined) {
            fW = ( formWarpRequest_THIS_ ?
            formWarpRequest_THIS_ : formWarpRequest_NS_ );
        }
    
        var custValue = fW._textEditBoxCustomerPrompt;  

        if(custValue.value.length > 0){
            if(custValue.value.length >= 3){
                promptAction('next'); //Proceed to next step
            }else{
                alert("Please enter a search value that is 3 or more characters long.");
                return false;
            }
        }
    }
}
</script>

While this implementation functions smoothly in Internet Explorer, trouble arises when using Firefox. Upon hitting Enter, the alert momentarily displays then vanishes, allowing the process to continue. It seems that the line "return false;" isn't effectively stopping the action.

Any assistance on resolving this issue would be greatly appreciated.

Answer №1

After putting a band-aid on the issue, I found a workaround solution. Instead of just returning false, I decided to clear out the Parameter Text Box to prevent the prompt from submitting. Then, I triggered an alert.

If anyone has the answer to my original question that's been bothering me, please share it!

<script>
function keyMon(e3)
{
    var key = e3 || window.event;

    if(key.keyCode == 13){

        var fW = (typeof getFormWarpRequest == "function" ?
        getFormWarpRequest() : document.forms["formWarpRequest"]);
        if ( !fW || fW == undefined) {
            fW = ( formWarpRequest_THIS_ ?
            formWarpRequest_THIS_ : formWarpRequest_NS_ );
        }

        var custValue = fW._textEditBoxCustomerPrompt;  

        if(custValue.value.length > 0){
            if(custValue.value.length >= 3){
                promptAction('next'); //Submit the user's input
            }else{
                //Delaying the alert box so that the user's enter press will not exit the alert box.
                setTimeout("alert('Please enter a search value that is 3 or more characters long.')",250);
                fW._textEditBoxCustomerPrompt.value = "";   
            }
        }
    }
}
</script>

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the best method for searching through all keys of an object?

Multiple documents contain a key called userId, where this key is always an object: { "id": { "$oid": "22fc6b11a0ff111d598b114f" }, "userId": { "KEY1" : ["..."], "KEY2" : ["..."], ...

Tips for refining search criteria with a combination of checkbox and range slider in Angular 2

In an attempt to refine the results for the array "db," I have implemented three filters: price, duration, and category. I have experimented with using the filter() method to apply these filters. You can find the code I have worked on here: https://stack ...

Tips for running a function in CodeBehind triggered by jQuery?

In my Aspx code, I have the following: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Index.aspx.cs" Inherits="WebSite.View.Index" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> ...

"Enable a smooth transition and switch the visibility of a div element when clicked

How to create a dropdown form with a transition effect that triggers on click of an element? Once triggered, the transition works smoothly but clicking again only hides the div element without triggering the transition. See the demo here: Check out the fu ...

The ts-loader seems to be malfunctioning (It appears that a suitable loader is required to handle this file type, as no loaders are currently set up to process it)

I'm currently in the process of integrating TypeScript into a JavaScript project, but it seems like webpack is not recognizing the ts-loader for files with the .tsx extension. I've attempted to use babel and even tried awesome-ts-loader, but none ...

Exploring the benefits of utilizing useState and localStorage in Next.js with server-side

Encountering an error consistently in the code snippet below: "localstorage is not defined" It seems like this issue arises because next.js attempts to render the page on the server. I made an attempt to place the const [advancedMode, setAdvanced ...

Guide on importing table information into an array using jQuery

I am facing an issue where I want to extract values from a dynamically generated table and then send those values in an AJAX call. The problem is that even though I am able to increase the number of rows in the table dynamically, when I try to capture the ...

The application is resetting when the "$http" method accesses the initial ADAL "protected" URL for the first time

I have created a page inspired by the Angular SPA ADAL sample which can be found here Upon returning from the Microsoft login page and accessing my API secured with AAD, the angular .config() function is called multiple times. This causes issues with upda ...

What could be causing the props to appear empty in a Child component within a Quasar framework and Vue 3 application?

I am facing an issue while passing props to a Child component table in my Quasar Vue3 app. The content is not being rendered, and I can't figure out why. Strangely, the console is clear of any errors. In the parent component, I am creating an object w ...

VIDEOJS ERROR: A peculiar mistake has occurred. TypeError: The property 'value' cannot be read since it is undefined in the context of

Recently, I came across a fascinating plugin called videojs-thumbnails for video.js, and I'm eager to incorporate it into my angular component. However, I keep encountering an error that says: VIDEOJS: ERROR: TypeError: Cannot read property 'val ...

What is the best way to remove words from an object's value that begin with a specific keyword using JavaScript?

Here is a sample array. I need to remove the words row-? from the className property. [ { type: "text", name: "text-1632646960432-0", satir: "1", className: "form-control col-lg-3 row-1" }, { ...

Incorporating OpenLayers and TypeScript: Issue with Event.map.forEachFeatureAtPixel, where the argument type is not compatible with the parameter type

I am currently attempting to implement Open Layers v7.2.2 with TypeScript. {When not using TypeScript, the code functions properly} function OnMapClick(event: MapBrowserEvent<UIEvent>) { event.map.forEachFeatureAtPixel(event.pixel, function(curren ...

Maintain the fancybox open even in case of ajax errors

I'm having an issue with my code where the fancybox closes automatically after displaying the error message briefly. I want it to remain open so that users have more time to fix their errors. What could be causing this problem? $(document).ready(func ...

The issue I am facing is that the Vuetify v-data-table is failing to display the data

I'm relatively new to working with javascript and vue/vuetify. Currently, I have a v-data-table that I can fill with static data. However, I'm looking to populate it upon clicking through a Flask API call. This is what I have so far: index.htm ...

Issue with ExpressJS Regex not correctly matching a path

I'm currently struggling with a simple regex that is supposed to match words consisting of letters (0-5) only, but for some reason it's not working as expected. Can anyone help me figure out the correct expression and how to implement it in Expre ...

Browsing using the "touchmove" feature feels extremely laggy

I implemented a workaround to achieve "position:fixed" on mobile devices, specifically my Android device. This involved creating two divs with heights that combined to match the screen height through JavaScript, and adding touch listeners to the bottom div ...

Effortlessly submit form data in Codeigniter without the need for page refreshing using jQuery ajax

I've been working on submitting form data in the codeigniter framework using ajax and jQuery to prevent page refreshing, but I keep getting a fail message. Since I'm new to ajax, can someone help me troubleshoot this error? This is my Controlle ...

Enhance your webpage's body by zooming in using jQuery on Mozilla Firefox

I have a webpage and I would like to zoom its body when it loads using jQuery. However, the CSS zoom feature is not working in Mozilla Firefox. This is what I currently am using: $("body").css("zoom", "1.05"); It worked in Chrome, Opera, and Edge, but un ...

Is it more advantageous to create two distinct projects for the frontend and backend along with an API, or should I consolidate them into a

Asking for some guidance on a few queries I have. I've developed a backend node server with express & mongo to run specific tasks and store them in the database, along with creating an admin page using express & bootstrap. Everything is functioning s ...

Guide to showcasing a placeholder in MUI's Select component

How can I add the placeholder "Select a brand" to this select element? I've tried different options with no luck. Here is the code snippet I am working with: <FormControl fullWidth> <InputLabel id="demo-multiple-name-label" ...