Questions tagged [button]
Buttons are basic components found in graphical user interfaces that react to mouse clicks or finger touches (on touch-enabled devices) as the primary form of input.
I am having some difficulties with using bootstrap switch. I have tried the examples provided on , but regardless of the classes I apply, the buttons remain the same small size and the text for ON and OFF is barely visible. I can't seem to figure out ...
I have a dilemma with merging two buttons into one. <div className="mt-8 mb-16"> <button onClick={handlePurchase} type="button" // disabled='{this[id] <= 10}' className="inline- ...
I currently have a situation where I have three checkboxes labeled as parent 1, parent 2, and parent 3. Initially, when the page loads, parent 1 and parent 3 are checked by default, while parent 2 is unchecked. However, when I manually check parent 2 and c ...
I've been working with phonegap and came across an issue with my buttons setup like this: <input id="my_button" type="button" onclick="my_function();"/> The goal is to capture the click event and change the button's value, my_function ( ...
Hi there! I recently created a contact page using Dreamweaver for my website. However, after uploading my blog, the submit button on the contact form doesn't seem to be working. The technical support team at WordPress suggested that I need to edit some cod ...
My challenge involves working with an array object that receives input from a textfield. I am looking to create a clean design where only one textfield is initially displayed, along with a '+' button next to it. When the user enters information into the te ...
Hello Stack Overflow Community, Within this JSFiddle link, you will find a code snippet attempting to create an onclick filter using Vue JS. However, the current approach is not yielding the expected results. The problematic JavaScript code can be found ...
Hi there, I'm trying to find a way to translate a button in my WooCommerce store without using LocoTranslate or any other tools. Is there a PHP function that can help me change the button text without needing an ID? If you want to take a look at the ...
https://i.stack.imgur.com/vMgGS.png Is there a way to apply the same padding to the border as seen on the button above? Adding the border directly to the td element seems like a solution, but it is not feasible due to the presence of border-radius in anot ...
I am currently working with the Ionic framework and I am trying to display data values on radio buttons. However, I am facing difficulties in retrieving the correct value and setting it appropriately. index.html <td> <label>{{learn ...
Whenever I attempt to login by clicking the login button, there seems to be an issue as it does not redirect me to any other page. Instead, I am left on the same page where I initially clicked the button. The intended behavior is for users to be redirected ...
In my current project, I am attempting to create an ajax "button" that mimics the functionality of a typical link_to "content", some_path, remote:true. The goal is to have this button swap out images to indicate different statuses when clicked (e.g. on/off ...
I'm looking for assistance in updating my database using an SQL statement after a button is clicked on the website. I attempted something but it was unsuccessful. Could anyone provide guidance? Here's the code snippet: http://pastebin.com/D0S83Jgh I'm ...
Is there a way to prevent the user from using the back button in a single page application? I've tried methods like onhashchange and window.history.forward, but they don't seem to be effective (perhaps because the URL doesn't change). ...
I have recently started learning PHP and I'm in the process of creating a dynamic page that will update based on which form buttons are clicked. The functionality is working correctly, but my goal is to enable users to upload multiple files - either PHOT ...
Can you assist with the following issue? <?php if(isset($_POST['MEASURE'])) { shell_exec("sudo python /var/www/html/lab/mkdir.py"); } ?> Here is the HTML part: <form method="post" > <input type="submi ...
click() method in python(selenium) seems to require the use of time.sleep() in order to work properly. The main script already includes an implicit wait at the beginning, so it's puzzling why this additional wait is needed. Can anyone offer insight into wh ...
My eyes are feeling strained, and I'm working on implementing a slider that can adjust both the radius and color of a button. This sandbox successfully updates the radius. Here is the code: (Code content) Currently, my focus is on utilizing ...
Currently, I am attempting to implement a functionality where I have two buttons at the top of my page. One button displays "French" by default, and when I click on the "English" button, it should replace the text with "French" using show and hide methods. ...
I am in the process of developing a jQuery Dialog that covers the entire screen. To create a personalized header for the Dialog, I have set up a custom <div>. Within this <div>, there is a nested <table>. The <table> consists of 1 ...
I am looking to change the dropdown menu in my search section into radio buttons. Currently, when I select something from the dropdown menu, the search fields are altered. Here is the code for the dropdown menu: <select id="qs_category" name="qs_catego ...
I'm looking to create a button on my webpage using an image that will link to other pages. I want the flexibility to use both small and large text on this button. The specific image I want to use is: So far, I've attempted some coding but haven't made mu ...
The CSS that styles our buttons is as follows: .btn-outline-primary { color: blue; border: 1px solid blue; background: transparent; transition: all 0.3s ease 0s; } .btn-outline-primary:hover, .btn-outline-primary:focus { background: ...
My IconButton open tag in the console is showing an error as an unexpected token. I have already installed Material UI but I can't figure out what the problem is. Can someone help me with this? Thank you! This is my product.js: import React from &ap ...
Is it possible to create a button in HTML that remains inactive until a specific number of clicks have been registered? Imagine a scenario where a button does nothing when clicked until it has been tapped 100 times. Upon the 100th click, it redirects to a ...
I am working on a project using Meteor (Meteor.com) and I want to incorporate iron-router for the page routing along with the pre-existing accounts-ui package for login functionality. Previously, my {{loginButtons}} functioned properly, but ever since I i ...
After developing a function that calculates the length of a string entered into an HTML textbox, I encountered an error when trying to display the result in another textbox. The function is designed to get the value from the 5th textbox on my HTML page and ...
Here we have a screenshot of HTML source code showing a button that is wider than the content it contains. The highlighted area in yellow indicates there is extra space at the right side of the button due to it being displayed on multiple lines. Is this be ...
Utilizing material-ui as my go-to css framework, I'm seeking to target a button that includes specific text. Here is my current code: cy.get('button').contains('Edit Claim').should('be.disabled'); The issue arises because the material ui button component ...
Looking for a solution to keep multiple buttons toggled on? I'm not very familiar with JavaScript, but I know that adding a class on click won't work if there's already a class set. Maybe giving the element an ID could be a possible solution? I want this ...
After integrating share buttons from Sharethis.com, I noticed that they do not appear when the page is refreshed. However, when I resize the viewport, they suddenly show up. <!DOCTYPE html> <html lang="en"> <head> <script t ...
I am currently working on a Next.js project where I am using Material UI to create tables and fetching data from MongoDB. However, I am facing an issue in adding edit and delete buttons to the action column in the table. Below is how the current table loo ...
I have attempted to link to an ID while also triggering a data-toggle collapse: <a href="#id" data-toggle="collapse" data-target="#collapseTwo" class="btn btn-primary" title="Something cool">Something very cool</a> for linking to this specif ...
I am currently working on creating responsive buttons that will navigate to specific pages using Angular routing. Here is my routing configuration: const routes: Routes = [ { path: 'home', component: HomeComponent}, { path: 'user', componen ...
I have been scouring the internet for a solution to this issue. Essentially, I am trying to position the button on the right side in desktop view. Here is an example: chrome view However, when the site is resized or viewed on mobile devices, the button sh ...
I'm working on a multiple choice quiz and I'd like to add a button or icon resembling X in front of each option (even in front of the radio button), so that when I click on it, only that specific option is deleted. How can I achieve this? For instance, if ...
I am facing an issue in angular where a button works perfectly fine with one click on larger screens, such as Macbook. However, on iPhone, it requires a double click to function properly (it works fine on Android too). The alert triggers with a single cl ...
My goal is to select a row within a Table that is located inside a Modal window, and then have a button ('newBtn') within that Modal window trigger a post request to the server with the selected id of the row. However, the issue I am encountering ...
In the realm of React Material-UI, I am delving into working with images and buttons. Can someone guide me on how to generate a button like the one shown in the picture linked below, and what is the best way to go about creating such buttons effectively? ...
I customized one of my buttons with special styling, and now I'm facing an issue where the button is clickable but it fails to direct me to the intended link (which should open a YouTube video in a new tab). #help { background-color: cornflowerblue; ...
Is there a way to trigger a JavaScript function from an HTML button that is not functioning properly? REVISED To see the issue in action, please visit this jsfiddle link: http://jsfiddle.net/winresh24/Sq7hg/341/ <button onclick="myFunction()">Try i ...
For a school project, I am developing a website focused on time management. My goal is to create an input text box that, when the "add task" button is clicked, transfers the text inside it to a paragraph or p2 element and then moves the input field down. ...
I have an interactive element called the "open grid" that, when clicked on, reveals a grid of buttons. I'm looking for help with coding it so that instead of being displayed below the textbox, the grid of buttons can be hovered over the "open grid" link. ...
In my current Vuetify project, I am trying to achieve a similar functionality as shown in the following plain HTML/JavaScript example: <body> <button id="anid" onclick="idcheck(this.id)"> </button </body> <script> function ...
As I work on developing a website for a pet rescue charity using Next.js, I am facing an issue with getting my button or link to function correctly. Every time I try to navigate to another page within my Next.js app, I encounter a 404 error stating "This p ...
I have written some HTML code to create a button and now I am looking for guidance on how I can use Vue.js to track how many times the button has been clicked. Here is what I have so far: <div class="123"> <button id = "Abutton&q ...
Does anyone know how to add a button to the right of text that was added using JS DOM? I've tried multiple techniques but can't seem to get it right - the button always ends up on the next line. Any tips on how to achieve this? var text = docu ...
I am interested in creating an HTML button that functions as a link to an item on the same page. Essentially, when this button is clicked, it should redirect to an item within the same page. Is there a way to achieve this using only HTML, CSS, and JavaScr ...
How can I trigger the rendering of a component by clicking a button in React? My goal is to construct a table using 'form' and treat each row as a distinct component. Ideally, users should be able to click a button to append more rows to the tabl ...
Hey there, I could really use some assistance with this. I'm puzzled as to why my form and buttons aren't disabling during the file upload process. Any help would be greatly appreciated. Thank you! <div> <form name="formImport" ng-submit="a ...
I am currently designing a webpage at The challenge I'm facing is: How can I center those buttons on the page? They need to remain centered and responsive even when the page is resized. Additionally, the spacing between the buttons is inconsistent. .b ...
Being relatively new to JavaScript, I am attempting to transfer a value entered into an input text field on a parent window to its child window when a button on the parent window is clicked. The parent window features an input field for entering a number a ...
Hey there, I've been attempting to replicate the hover effect on the buttons located on the left-hand side of this site , but unfortunately, I haven't had much success. The effect seems to involve a shift in margin and an unevening of margins that I just c ...
I'm struggling to disable the hover color on my button. The inline style I tried isn't working as expected. const ButtonWrapper = styled(Box)` display: flex; margin: 0 3% 0 auto; & > button, & > p, & > div { margin-right: ...
Looking for help with my code. How can I set it up so that when the HTML file is clicked on, it prompts for input instead of displaying a button? I'm new to coding and could use some guidance. <!doctype html> <html> <head> <meta ...
Trying to make a button in CSS appear "pushed down" on :active, I decided to increase the padding-top by 2px and decrease padding-bottom by 2px. However, this adjustment seemed to affect the margins of other elements for some reason that eludes me. I am c ...
When accessing the website on a phone, I have trouble seeing and tapping on these two buttons because they are too far apart. I would like to change it so that once a file is selected, the 'choose file' button will be replaced by the upload button. Is this ...
Is there a way to clear the input field after pressing the button? <div class="form-group autocomplete"> <div class="input-group search"> <input id="search" name="searchterm" type="search" class="form-control form-control search-input" pl ...
I am struggling to position my input (class="button") where I want it to be html: <div id="popup" class="overlay"> <div class="popup"> <a class="close" href="#">×</a> <div id="content"> <select required name="list" ...
I currently have a project that involves two separate files. File number one handles eye-tracking and blinking calculations. This file runs whenever I input a command in the terminal using this line: python3 blink.py --shape-predictor shape_predictor_68_f ...
I am trying to apply a style to a link button element using JQuery. The code I have written is not working. Can anyone provide suggestions on how to achieve this? Below is the snippet of the HTML <div data-role="content"> <a href="#" class= ...
<div class="clickable-icon"> <button component={Link} to={"/create"}> <EditIcon></EditIcon> </button> </div> I have written this code snippet to turn an icon into a clickable button that directs ...
I'm currently working with this code snippet: <div class="outer"> <ul class="list"> <li class="inner"> <div class="line">information1</div> <div class="line">hyperlink1</div&g ...
I seem to be experiencing a strange issue where setting the open prop to true on a Menu component disables all the IconButtons within a Table on the same page. Surprisingly, when the open prop is set to false, the IconButtons function correctly. This beha ...
My goal is to present the array of data received from different API calls, such as /fruits and /pizza. I aim to format this data into a table that separates each element in the json array. How can this be achieved in React, assuming the API code functions ...
<td class="tdDiv"> <div class="divElem"> <ul class="ulElem"> <li role="presentation" class="ng-star-inserted"> <button type="button" tabindex="0" class="& ...
I'm encountering an issue with my code that involves the following line: self.button = Button(frame, text="CALCOLA", width=28, height=2, command=callback) When running the code on OSX, the button appears as a single line separated above and below from ot ...
Upon review below, I have successfully created the getChart() function. It functions properly when called independently, however, it fails to display the chart when enclosed within $(document).ready(function(){...}). The file is also attached for referen ...
Below is the code snippet I am working with utilizing the Text and Button components provided by react-native-paper: <Text>See also </Text> <Button mode="text" compact onPress={this.nav( name )}>Compass</Button> <Text&g ...
Currently, I am working on a component that contains a button connected to a function in the .ts file. My goal is to have this function add an HTML element or make it visible when the button is clicked. Specifically, I would like a dynamic <div> elem ...
Is there a method to entirely eliminate the styling of a button in Internet Explorer? I am utilizing a CSS sprite for my button and everything appears fine. However, when I click on the button, it shifts slightly upwards which distorts its appearance. Are ...
When the page loads, I have an empty array. Since there are no values stored in this array, I disabled the button using ng-disabled="array1.length==0". Now, on the page that opens up, there are four drop downs present. My goal is to enable the button once ...
I am facing the issue of disabling a <button> in an ngFor loop after it has been clicked by the user. Each button corresponds to an element in the loop, so I need to distinguish them using separate boolean values. Below is a snippet of the HTML code ...
I'm currently working on my final project for my JavaScript class. I've run into a bit of a roadblock and could use some guidance. I am trying to capture input (all code must be done in JS) for an email address and validate it. If the email is valid, then ...
I am having an issue with my "Let's Get Fit" button. When I hover over it or click it, the cursor doesn't change and it doesn't lead to index.html. I'm not sure why it's not working. .btn { display: inline-block; text-transf ...