News Articles input

How can I adjust the written text in text type input?

I am creating an opening search box, that you click then it opens, but i have a problem with the text, this is how it works : .search { float: left; position: relative; } .search-box input { background: #F5B7B1; color: white; outline: none; border: none; height: 40px; width: 350px; max-width: 0px; -webkit-transition: all 0.5s 0s […]

Cannot type in pre-populated React form

I have a React Form that I want to pre-populate with some data. It is update a specific record, so I want the original record information to show up in the form on load and then allow the user to change or modify each input as needed before submit. However, it seems that while the […]

Disable input field when click edit button using React Hooks

I don’t understand what I’m doing wrong in here. The scenario is that I am on the user profile details and I want to edit the information but one input must be disable at all the time. When I’m loading the page the input it is actually disabled but as soon as I click the […]

how to take integer input in javascript?

Ok so i am making a website which converts kilometer to meter and i take the input when a button is clicked and i take the input with the help of javascript my code is working but in the input box you can even write alphabets which i don’t want i want the input box […]

HTML file input accept .zip files also includes .xlsx, pptx, .docx

How to restrict input file from accepting .pptx, .docx, .xlsx when using <input type="file" title="" onChange={handleUpload} accept=".zip" /> I want my input to only access .zip no other file type. But when I use the same in accept attribute it also allows .pptx, .docx, .xlsx Source: JavaSript – Stack Overflow

How to input first character must be 5 (typing block) [closed]

I have a phone input, this input’s first character must be only 5 how can ı do typing block in reactjs btw ı have regex but ı want before regex validation typing block on first character Source: React – Stack Overflow

Why does my numerical input box still display letters or symbols only when typed for the first time? (Reactjs)

I have actually made two input boxes (cash amount range e.g, From $100 – To $200) to only type numbers with a single period, comma(s) and fixed to 2 decimal places but when I type alphabets or symbols, they are visible but only on the first try. See GIF below: See GIF At first, the […]

Vue input tag element – how to fill it with tags properly?

I am using vue element <input-tag>, and I need to make edit page for one entity which contains tags. So the <input-tag> field should be populated based on the current values ​​in the entity. I managed to do that, but the whole JSON object appears in <input-tag> field (example: {"id":2, "tagName": "vuejsproblem", "newsId": 1}), not […]

Style an inputs parent div [duplicate]

I have a radio input that in wrapped in a label. When the radio button is checked, I was to style the parent div tag of the label. Any suggestions. I have tried a few thing like: input[type="radio"]:checked + label { border-top: 5px; } Snuggling with this so any help would be much appreciated 🙂 […]

How to handle input field for file upload of type png or jpeg?

guys I am trying to restrict users from uploading files other than png or jpeg. For testing, I am checking if the user is uploading a pdf if yes I am displaying an error msg else I am uploading the document to AWS S3. Please find some code reference below:- <IconButton onClick={() => this.browseFile(‘firstFile’)} aria-label="upload-file" […]

InputEvent to make text Bold instead of document.execCommand(‘bold’,false,null)

I’ve been trying to find an example of how to use InputEvent with format bold on text to make it bold instead of document.execCommand(‘bold’,false,null); This is related to InputEvents. I wanted to switch to InputEvents in a contenteditable text editor instead of using document.execCommand to manipulate the content. Source: JavaSript – Stack Overflow

A single input, not all inputs in Html

When I click on a single input, all inputs are triggered. I just want the input I clicked to be triggered enter image description here enter image description here <tr *ngFor="let item of TransferCardWeb"> <td>{{item.PartiNo}}</td> <td>{{item.SeriNo}}</td> <td>{{item.StokKodu}}</td> <td>{{item.StokAdi}}</td> <td> <tr *ngIf="!visible" (click)="itemQuantityOnClick()"> {{item.Quantity}} (click)="itemQuantityOnClick() : What should I write inside this method? </tr> <tr *ngIf="visible"> […]

How can I set static text in an input field?

I have read many articles related to this topic but none of these articles proffer exact solution to what I am trying to achieve. I’ll like to make "COMPUTER SCIENCE" a static text in the input filed for "Department in the following code". <tr> <td><label for="Username">Username</label></td> <td><input name="txtusername" type="text" id="txtusername" style="height:20px; width:208px" /></td> </tr> <tr> […]

Checkbox is Always being checked

I have a checkbox <input type="checkbox" name="Vebasto" class="checkbox" value="350" id="Vebasto" /> <label for="Vebasto">Vebasto</label> And script that checks if it checked: if(document.querySelector(‘input#cond’).checked = true){ alert("checked"); } When page is loading I have got this alert but checkbox in not checked. What’s wrong? Source: JavaSript – Stack Overflow

Input text > right padding: Unexpected behaviour in Firefox with overlong text

A Firefox specific Problem… for illustrating let’s have a look at this sample input field: <input type=”text” style=”width: 10vw; font-size: 3vw; padding-right: 100px;”> I added a right padding of 100px. Now just type as much text, that you meet the right border of the box. All Browsers that I’ve tested – besides Firefox – start […]

What is the best way to stack input fields along with labels side by side in a form. (Without making it apply to the whole form)

Super noob question here. I’m wanting to know how I can stack two input fields and labels side by side. I’ve managed to get most of my document lined up and sized. I thought the solution would be to group both the inputs and labels I want side by side in a div, and add […]

An element pops up over another element in telephone size

This is what it is supposed to be the search and under it the list but when I try to write something I have this problem the list pops ower the search, could you tell me please how to solve this problem this is the HTML code <nav class="navigation"> <div class="navigation-headin"> <form class="navigation-serch"> <input type="text" […]

input unfocuses during mobile key press React

I have a hidden input and an onClick on the parent div which focuses the input in React using useRef. <div onClick={handleFocusInput} className=’container-five-term’> <input ref={inputEl} type="text" // autoFocus={true} // // onBlur={({ target }) => target.focus()} className="input" value={userInput} onChange={handleOnChange} id="input-user" autocomplete="off" /> const handleFocusInput = () => { inputEl.current.focus() } the input stays focused on the […]

Sitemap | Terms | Privacy | Cookies | Advertising

Senior Software Developer

Creator of @LzoMedia I am a backend software developer based in London who likes beautiful code and has an adherence to standards & love's open-source.