Implementing Java script for onkeypress event in a search bar that does not require a button

Currently utilizing this javascript to trigger an event on key press:

function myFunction() {
   if (window.event || window.event.keyCode == 13) {   
      changeSource();
   } 
}

function changeSource(){
   document.getElementById("frame1").src="Log-In.aspx";
   window.alert("wow");
}

This is where I plan to use my onkeypress event:

<input id= "Text1" placeholder="Search here..." type="text" onkeypress="myFunction()"/>

And this is the iframe that I want the event to affect:

<iframe id="frame1" width="100%" height="100%" frameborder="0" name="page" src="about:blank" ></iframe>

The issue lies in being unable to change the src attribute of my iframe despite the event being triggered.

Answer №1

Try using setAttribute to modify the attribute value.

document.getElementById("frame1").setAttribute('src',"Home.html");

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

ASP.NET Templating allows developers to create dynamic web pages

We are currently developing a custom HttpModule for a text templating engine that replaces tags in our HTML with content from an XML file. The XML file is loaded into memory as a string/string Dictionary to facilitate quick lookup and replacement using reg ...

Swapping React components within a list: How to easily change classes

For my latest project, I am building a straightforward ecommerce website. One of the key features on the product page is the ability for users to select different attributes such as sizes and colors. These options are represented by clickable divs that pul ...

Send an array of data from the view to the Controller in CodeIgniter

I have been searching for a solution to this question. However, for some reason, my code is not functioning properly. Here is what I want to achieve: Data Array -> ajax post -> codeigniter controller(save data in DB and redirect to another page) ...

The gltf model fails to load on Chrome for Android when using Threejs

I encountered an issue while attempting to showcase a basic GLTF 3d model on my website. Surprisingly, it functions smoothly on desktop Mac and Windows, as well as on iOS in Safari and Firefox. However, it fails to load on Android's Chrome browser. St ...

Namespacing is not applied to dynamic modules in Vuex

I've been tackling a modular vue application that enrolls the modules during compile time. Take a look at the code snippet below - app.js import store from './vue-components/store'; var components = { erp_inventory: true, erp_purc ...

Best Practices for ASP.NET URL Remapping and Redirection Required

Let me paint you a picture: I've got a hefty list of around 5000 URLs that have already been distributed to various clients. However, the locations of these URLs have shifted on the server end. Rest assured, the server has remained constant. This is a ...

What is the best way to create a dynamic text area that changes based on a dropdown selection?

I'm trying to create a feature on my form where selecting a retailer from a dropdown menu automatically generates a corresponding link next to the textbox. For example, if someone picks Best Buy, I want a link to bestbuy.com to show up immediately wit ...

Troubleshooting the Owl carousel's responsiveness with a div width of 1170px

Whenever my display size is less than 1170px, the width of the owl carousel div overflows. How can I fix this issue? jQuery(document).ready(function($) { "use strict"; // CUSTOMERS TESTIMONIALS CAROUSEL $('#customers-testimonials&a ...

What is the best method to incorporate filtering in a CRUD table?

Frontend code: // Importing necessary components and libraries import React, { Component, useState, useEffect } from "react"; import Navbar from "../Navbar/Navbar.js"; import BarChart from "../BarChart/BarChart"; import { Chart, Tooltip, CategoryScal ...

Showing a dynamically updated array in Angular

Within my Angular Application I am utilizing an ngFor loop in the component to display an array. Now, I am filtering the data from the array and aiming to update the newly filtered array in place of the original one. While I can successfully display the ...

Submitting forms with Ajax in IE(8)

Sample Google form Related spreadsheet I modified the original code to create two custom forms: First created form Second created form Both forms are functional on most browsers except for IE(8). Any idea why? First form: <!DOCTYPE html> <h ...

Utilizing Express.js: A Guide to Fetching File Downloads with a POST Method

Although GET requests are successful, I am facing challenges when using POST to achieve the same results. Below are the different code snippets I have attempted: 1. app.post("/download", function (req, res) { res.download("./path"); }); 2. app.post ...

Having trouble removing a cookie in express?

Seems pretty straightforward. In the /user/login route, I set a cookie as shown below: if (rememberMe) { console.log('Login will be remembered.'); res.cookie('user', userObj, { signed: true, httpOnly: true, path: '/' ...

Identify the significance within an array and employ the filter function to conceal the selected elements

I'm in the process of filtering a list of results. To do this, I have set up a ul list to display the results and checkboxes for selecting filter options. Each item in the ul list has associated data attributes. When a checkbox with value="4711" is c ...

Tips for clearing text inputs in ReactJS

In my current Reactjs project using nextjs, I am facing an issue with clearing input fields after a click event. Below is the code snippet that I have been working on: <form onSubmit={handleSubmit}> <input type="text" ...

The Controller of Conversations

In the HTML code, there is a dialog element with an identification of divMyDialog1. This dialog is connected to a JavaScript class called MyDialog1. Each dialog has its own unique id and associated class name. MyDialog1 = function(divStr){ this.divStr ...

Grabbing <object> HTML using jQuery

One example on my webpage is the presence of the following <object>: <object id="obj1" data="URL"></object> Could you please suggest a method to access this html object using jQuery? ...

Dynamically import React Material UI Icons when needed

The concept here revolves around importing react material UI icons only when necessary, especially in situations where we may not know the icon name during compile time. (Ensuring that we have valid icon names) My method involved using a require statement ...

Is there a foolproof way to determine when a dialogue box pops up on

I'm currently building an electron app using vue and Vuetify. I am able to create a modal using dialog, but I want to be able to modify certain elements within the dialog after it is displayed. When using $refs, I cannot find the element before the d ...

Automatically log users out of Django and update the backend after a period of inactivity without requiring any additional requests

In my Django project, I am working on a simple multiplayer system where I need to update the isCurrentlyActive value in a user-related model automatically and then log them out. I tried using middleware following a solution from this post, which works well ...