# web dev

**URL:** https://forum.kirupa.com/c/programming/web-dev/42.md?page=28

[Latest](https://forum.kirupa.com/latest.md) · [Categories](https://forum.kirupa.com/categories.md)

**Page:** 29

---

## [Update checkbox List via URL querystring](https://forum.kirupa.com/t/update-checkbox-list-via-url-querystring/645525)

<div class="topic-metadata">

**Author:** [@Three\_X](https://forum.kirupa.com/u/Three_X)\
**Replies:** 0\
**Last updated:** [December 31, 2020, 1:33pm UTC](https://forum.kirupa.com/t/update-checkbox-list-via-url-querystring/645525 "2020-12-31T13:33:49Z")

</div>

I have a URL which have some default model, example.com/selector/ when user type something it update the list \<input type="text" name="filter" placeholder="{{$lang.common\_forms.field\_filter\_hint}}"/\> example.com/sele…

---

## [Clipping text inside a DIV](https://forum.kirupa.com/t/clipping-text-inside-a-div/645359)

<div class="topic-metadata">

**Author:** [@dannywolf](https://forum.kirupa.com/u/dannywolf)\
**Replies:** 2\
**Last updated:** [December 20, 2020, 9:21pm UTC](https://forum.kirupa.com/t/clipping-text-inside-a-div/645359 "2020-12-20T21:21:44Z")

</div>

Hello, Good People; I am trying to clip text inside a fixed-height DIV using ellipsis but the usual CSS properties do not produce multiple lines of text, instead shrinking my paragraph to a single line when it could occ…

---

## [Handling events for multiple elements](https://forum.kirupa.com/t/handling-events-for-multiple-elements/645305)

<div class="topic-metadata">

**Author:** [@seunawonugba](https://forum.kirupa.com/u/seunawonugba)\
**Replies:** 3\
**Last updated:** [December 14, 2020, 4:32pm UTC](https://forum.kirupa.com/t/handling-events-for-multiple-elements/645305 "2020-12-14T16:32:03Z")

</div>

how can i use a single handler to hide or show multiple HTML elements

---

## [a.addEventListener("click", WhichLinkWasClicked());](https://forum.kirupa.com/t/a-addeventlistener-click-whichlinkwasclicked/645162)

<div class="topic-metadata">

**Author:** [@vmars316](https://forum.kirupa.com/u/vmars316)\
**Replies:** 2\
**Last updated:** [December 4, 2020, 12:33am UTC](https://forum.kirupa.com/t/a-addeventlistener-click-whichlinkwasclicked/645162 "2020-12-04T00:33:46Z")

</div>

Sorry , stumped again: Uncaught SyntaxError: Unexpected identifier “Function WhichLinkWasClicked(evt) {” \<!DOCTYPE html\> \<html\> \<body\> \<p\>This example uses the addEventListener() method to catch which kink was clicke…

---

## [Need to place several PNG images over single background PNG image at particular location](https://forum.kirupa.com/t/need-to-place-several-png-images-over-single-background-png-image-at-particular-location/645038)

<div class="topic-metadata">

**Author:** [@Anandhanatarajan](https://forum.kirupa.com/u/Anandhanatarajan)\
**Replies:** 0\
**Last updated:** [November 23, 2020, 5:45am UTC](https://forum.kirupa.com/t/need-to-place-several-png-images-over-single-background-png-image-at-particular-location/645038 "2020-11-23T05:45:18Z")

</div>

I have a background PNG image. I need to place some icons which are also PNG images at specific locations. The first thing is I need to get coordinates of a particular spot on the background image. Then, using those coo…

---

## [Dealing with state in React](https://forum.kirupa.com/t/dealing-with-state-in-react/644696)

<div class="topic-metadata">

**Author:** [@rampar](https://forum.kirupa.com/u/rampar)\
**Replies:** 0\
**Last updated:** [October 27, 2020, 4:28am UTC](https://forum.kirupa.com/t/dealing-with-state-in-react/644696 "2020-10-27T04:28:18Z")

</div>

Hi Currently, I am into Chapter 8 “Dealing with State in React” in “Learning React” book, and I am trying the Lightning Strike Count code. Basically, the code below, creates a counter display that increments the counter…

---

## ["Learning React" book Chapter 2, coding did not work](https://forum.kirupa.com/t/learning-react-book-chapter-2-coding-did-not-work/644667)

<div class="topic-metadata">

**Author:** [@rampar](https://forum.kirupa.com/u/rampar)\
**Replies:** 2\
**Last updated:** [October 27, 2020, 4:19am UTC](https://forum.kirupa.com/t/learning-react-book-chapter-2-coding-did-not-work/644667 "2020-10-27T04:19:19Z")

</div>

Hello Kirupa, I am through this book, trying to learn REACT, as a beginner. THis code below did not work for me. It did not display any text when I loaded them on a webpage. \<DOCTYPE html\> \<html\> \<head\> \<meta…

---

## [Property assignment expected. ts(1136)](https://forum.kirupa.com/t/property-assignment-expected-ts-1136/644582)

<div class="topic-metadata">

**Author:** [@wangpjy](https://forum.kirupa.com/u/wangpjy)\
**Replies:** 2\
**Last updated:** [October 18, 2020, 1:38am UTC](https://forum.kirupa.com/t/property-assignment-expected-ts-1136/644582 "2020-10-18T01:38:30Z")

</div>

I am following book Learning React, chapter 13 page 158, to first create-react-app helloworld and create HelloWorld.js import React, {Component} from "react"; class HelloWorld extends Component{ render() { return…

---

## [webpack installation, invalid configuration object](https://forum.kirupa.com/t/webpack-installation-invalid-configuration-object/644521)

<div class="topic-metadata">

**Author:** [@kdglauvygiadn](https://forum.kirupa.com/u/kdglauvygiadn)\
**Replies:** 6\
**Last updated:** [October 11, 2020, 11:17pm UTC](https://forum.kirupa.com/t/webpack-installation-invalid-configuration-object/644521 "2020-10-11T23:17:27Z")

</div>

Please I know I might be doing something wrong, but surely I need help. At first I had problem with installing webpack, which I hope I got to work finally by installing it globally, but then trying to run the app, I got…

---

## [Chapter 8 counter code not working](https://forum.kirupa.com/t/chapter-8-counter-code-not-working/644449)

<div class="topic-metadata">

**Author:** [@Yogendra\_Khopkar](https://forum.kirupa.com/u/Yogendra_Khopkar)\
**Replies:** 1\
**Last updated:** [October 5, 2020, 10:37pm UTC](https://forum.kirupa.com/t/chapter-8-counter-code-not-working/644449 "2020-10-05T22:37:41Z")

</div>

I am unable to get the code to display counter. I tried out the code and am getting error that “cannot read property strikes of undefined” below is the source code React!React!React! #container{…

---

## [4 Images - 4 Text Boxes](https://forum.kirupa.com/t/4-images-4-text-boxes/644403)

<div class="topic-metadata">

**Author:** [@John\_Stern](https://forum.kirupa.com/u/John_Stern)\
**Replies:** 4\
**Last updated:** [October 1, 2020, 6:01pm UTC](https://forum.kirupa.com/t/4-images-4-text-boxes/644403 "2020-10-01T18:01:25Z")

</div>

So I tried my hand at writing a constructor function that places 4 images (the images are stand ins for rodents since said rodents can’t be found in the imageGetImage library) on the page with the following caption above…

---

## [Using codepen.io as a testbed...SOLVED](https://forum.kirupa.com/t/using-codepen-io-as-a-testbed-solved/644230)

<div class="topic-metadata">

**Author:** [@Brian\_Pettitt](https://forum.kirupa.com/u/Brian_Pettitt)\
**Replies:** 1\
**Last updated:** [September 19, 2020, 2:13am UTC](https://forum.kirupa.com/t/using-codepen-io-as-a-testbed-solved/644230 "2020-09-19T02:13:27Z")

</div>

EDIT: I was able to work out this issue. I had to change the \<div\>'s at the bottom to . I also think (but am not sure) that the spacing on the return statements is important. It seems to require them to be on the same li…

---

## [New Decorators for JS Proposal (Again)](https://forum.kirupa.com/t/new-decorators-for-js-proposal-again/644165)

<div class="topic-metadata">

**Author:** [@senocular](https://forum.kirupa.com/u/senocular)\
**Replies:** 2\
**Last updated:** [September 16, 2020, 2:22am UTC](https://forum.kirupa.com/t/new-decorators-for-js-proposal-again/644165 "2020-09-16T02:22:10Z")

</div>

The proposal for decorators in JavaScript has been updated… again. This will mark, if my counting is correct, the 4th major revision of this specification. If anyone is curious about the previous 3 iterations, I have a…

---

## [Why don't work letterStyle ?](https://forum.kirupa.com/t/why-dont-work-letterstyle/644182)

<div class="topic-metadata">

**Author:** [@reexel](https://forum.kirupa.com/u/reexel)\
**Replies:** 3\
**Last updated:** [September 15, 2020, 9:46am UTC](https://forum.kirupa.com/t/why-dont-work-letterstyle/644182 "2020-09-15T09:46:22Z")

</div>

Hello, all! I read book from Kirupa. It contains this code: \<! DOCTYPE html\> \<html\> \<head\> \<meta charset="utf-8"\> \<title\>React\</title\> \<script src="https://unpkg.com/react@16/umd/react.development.js"\>\</s…

---

## [AVIF Images](https://forum.kirupa.com/t/avif-images/644111)

<div class="topic-metadata">

**Author:** [@senocular](https://forum.kirupa.com/u/senocular)\
**Replies:** 3\
**Last updated:** [September 12, 2020, 5:47am UTC](https://forum.kirupa.com/t/avif-images/644111 "2020-09-12T05:47:59Z")

</div>

Someone from work just shared this and I thought it was pretty impressive: AV1 Image File Format (AVIF) (pronounced \[əˈ vif\]) is an image file format specification for storing images or image sequences compressed wit…

---

## [Recoil State Management for React](https://forum.kirupa.com/t/recoil-state-management-for-react/644135)

<div class="topic-metadata">

**Author:** [@senocular](https://forum.kirupa.com/u/senocular)\
**Replies:** 0\
**Last updated:** [September 10, 2020, 2:38pm UTC](https://forum.kirupa.com/t/recoil-state-management-for-react/644135 "2020-09-10T14:38:14Z")

</div>

Recoil is the hot, new (experimental) state management library coming out of Facebook for React. Makes it easy to efficiently share state update across components using a useState-like Recoil hook. Example (partial) f…

---

## [Out of Sync Async Initialization (Broken Router Part 2)](https://forum.kirupa.com/t/out-of-sync-async-initialization-broken-router-part-2/643995)

<div class="topic-metadata">

**Author:** [@senocular](https://forum.kirupa.com/u/senocular)\
**Replies:** 1\
**Last updated:** [August 29, 2020, 5:04am UTC](https://forum.kirupa.com/t/out-of-sync-async-initialization-broken-router-part-2/643995 "2020-08-29T05:04:51Z")

</div>

Not too long ago I wrote about a problem dealing with JavaScript reference variables causing problems in a broken router. The solution was (largely) to fix a Router subclass (RouterSubclass) so that its initialize() sig…

---

## [Broken Router Post-mortem](https://forum.kirupa.com/t/broken-router-post-mortem/643960)

<div class="topic-metadata">

**Author:** [@senocular](https://forum.kirupa.com/u/senocular)\
**Replies:** 0\
**Last updated:** [August 24, 2020, 3:18pm UTC](https://forum.kirupa.com/t/broken-router-post-mortem/643960 "2020-08-24T15:18:56Z")

</div>

Our team has recently been cracking down on the JavaScript errors that have been occuring in our application. Whenever a JS error occurs, we make sure it gets logged into our logging system. Then every week we take a lo…

---

## [Question about React book. Can I remove li element by another way?](https://forum.kirupa.com/t/question-about-react-book-can-i-remove-li-element-by-another-way/643746)

<div class="topic-metadata">

**Author:** [@AlexGoryushkin](https://forum.kirupa.com/u/AlexGoryushkin)\
**Replies:** 1\
**Last updated:** [August 1, 2020, 11:14pm UTC](https://forum.kirupa.com/t/question-about-react-book-can-i-remove-li-element-by-another-way/643746 "2020-08-01T23:14:26Z")

</div>

Hello! I reading the React book from Kirupa. And now I’m in section 15, about TodoList app. According to the book, Event onClick is used for the li element to remove list items: createTasks(item) { return \<li onClick=…

---

## [Async/Await use in NodesJS and Mysql query](https://forum.kirupa.com/t/async-await-use-in-nodesjs-and-mysql-query/643670)

<div class="topic-metadata">

**Author:** [@Umair\_Ashraf](https://forum.kirupa.com/u/Umair_Ashraf)\
**Replies:** 2\
**Last updated:** [July 30, 2020, 8:32pm UTC](https://forum.kirupa.com/t/async-await-use-in-nodesjs-and-mysql-query/643670 "2020-07-30T20:32:26Z")

</div>

Hi guys, i am a bit confused when using Asyc/await, i am basically retrieving the data from the mysql DB and then use the information when constructing an object user\_details that i will use later. I have defined the A…

---

## [JS Tip of the Day: ES2021 Preview](https://forum.kirupa.com/t/js-tip-of-the-day-es2021-preview/643632)

<div class="topic-metadata">

**Author:** [@senocular](https://forum.kirupa.com/u/senocular)\
**Replies:** 0\
**Last updated:** [July 22, 2020, 3:00pm UTC](https://forum.kirupa.com/t/js-tip-of-the-day-es2021-preview/643632 "2020-07-22T15:00:31Z")

</div>

ES2021 Preview Version: ES2021 Level: Beginner This series of JavaScript tips started with a couple of new features that were introduced in ES2020. For this tip, the final tip in the series, we will take a look at a …

---

## [Console Logging an Arrow Function](https://forum.kirupa.com/t/console-logging-an-arrow-function/643633)

<div class="topic-metadata">

**Author:** [@Umair\_Ashraf](https://forum.kirupa.com/u/Umair_Ashraf)\
**Replies:** 3\
**Last updated:** [July 23, 2020, 3:32pm UTC](https://forum.kirupa.com/t/console-logging-an-arrow-function/643633 "2020-07-23T15:32:17Z")

</div>

I am a bit confused with the console output , my understading is that if we write the function name in the console it will display only if there is a return exisit and in this casue it will either display or parsed valu…

---

## [JS Tip of the Day: The Long Arrow Operator](https://forum.kirupa.com/t/js-tip-of-the-day-the-long-arrow-operator/643554)

<div class="topic-metadata">

**Author:** [@senocular](https://forum.kirupa.com/u/senocular)\
**Replies:** 2\
**Last updated:** [July 22, 2020, 10:28am UTC](https://forum.kirupa.com/t/js-tip-of-the-day-the-long-arrow-operator/643554 "2020-07-22T10:28:50Z")

</div>

The Long Arrow Operator Level: Beginner Over the recent years, a lot of attention has been given to arrow functions, a feature introduced in ES2015. And rightfully so; they provide some exciting, new functionality and …

---

## [When saving data(array of objects) in React.State/ LocalStorage using ReactHooks, facing an error](https://forum.kirupa.com/t/when-saving-data-array-of-objects-in-react-state-localstorage-using-reacthooks-facing-an-error/643580)

<div class="topic-metadata">

**Author:** [@Umair\_Ashraf](https://forum.kirupa.com/u/Umair_Ashraf)\
**Replies:** 2\
**Last updated:** [July 17, 2020, 12:33am UTC](https://forum.kirupa.com/t/when-saving-data-array-of-objects-in-react-state-localstorage-using-reacthooks-facing-an-error/643580 "2020-07-17T00:33:53Z")

</div>

i am looking to save the customer product selection in basket and to avoid the effect of refesh of page i am also saving the customer selection to local storage, i am use spread ....prevItems and using window.localSt…

---

## [JS Tip of the Day: Async Generators](https://forum.kirupa.com/t/js-tip-of-the-day-async-generators/643582)

<div class="topic-metadata">

**Author:** [@senocular](https://forum.kirupa.com/u/senocular)\
**Replies:** 0\
**Last updated:** [July 16, 2020, 3:56pm UTC](https://forum.kirupa.com/t/js-tip-of-the-day-async-generators/643582 "2020-07-16T15:56:09Z")

</div>

Async Generators Version: ES2018 Level: Advanced Normally, when next() is called in an iterator, it returns a result object (an object with value and done properties). This is by design as part of the iterator protoc…

---

## [JS Tip of the Day: Default Parameter Scope](https://forum.kirupa.com/t/js-tip-of-the-day-default-parameter-scope/643536)

<div class="topic-metadata">

**Author:** [@senocular](https://forum.kirupa.com/u/senocular)\
**Replies:** 1\
**Last updated:** [July 12, 2020, 6:25pm UTC](https://forum.kirupa.com/t/js-tip-of-the-day-default-parameter-scope/643536 "2020-07-12T18:25:31Z")

</div>

Default Parameter Scope Version ES2015 Level: Intermediate Normally, when function parameters are initialized in a function call, they’re scoped to the function body. However, when functions use default parameters, t…

---

## [JS Tip of the Day: Undefined vs. Null vs. Nullish](https://forum.kirupa.com/t/js-tip-of-the-day-undefined-vs-null-vs-nullish/643521)

<div class="topic-metadata">

**Author:** [@senocular](https://forum.kirupa.com/u/senocular)\
**Replies:** 0\
**Last updated:** [July 10, 2020, 2:57pm UTC](https://forum.kirupa.com/t/js-tip-of-the-day-undefined-vs-null-vs-nullish/643521 "2020-07-10T14:57:23Z")

</div>

Undefined vs. Null vs. Nullish Level: Intermediate Both undefined and null are used to represent variables or properties as having no value. undefined is for properties which don’t exist or variables that have been dec…

---

## [Href use in API request and using subdomains](https://forum.kirupa.com/t/href-use-in-api-request-and-using-subdomains/643491)

<div class="topic-metadata">

**Author:** [@Umair\_Ashraf](https://forum.kirupa.com/u/Umair_Ashraf)\
**Replies:** 3\
**Last updated:** [July 10, 2020, 12:13pm UTC](https://forum.kirupa.com/t/href-use-in-api-request-and-using-subdomains/643491 "2020-07-10T12:13:14Z")

</div>

i am using Bootstrap in one of my react project and using Dropdown.Item as submenu it will fetch the desired search results and show on the browser just under the menu. as you see once i click the item it will take m…

---

## [JS Tip of the Day: Object.keys vs Array.keys](https://forum.kirupa.com/t/js-tip-of-the-day-object-keys-vs-array-keys/643508)

<div class="topic-metadata">

**Author:** [@senocular](https://forum.kirupa.com/u/senocular)\
**Replies:** 0\
**Last updated:** [July 8, 2020, 3:14pm UTC](https://forum.kirupa.com/t/js-tip-of-the-day-object-keys-vs-array-keys/643508 "2020-07-08T15:14:30Z")

</div>

Object.keys vs Array.keys Version: ES2015 Level: Intermediate Object has a static method, Object.keys(), which will return all of the enumerable, non-inherited keys of any object as an array. This can be used to easi…

---

## [Reset the useState to initial state in ReackJS Hooks](https://forum.kirupa.com/t/reset-the-usestate-to-initial-state-in-reackjs-hooks/643492)

<div class="topic-metadata">

**Author:** [@Umair\_Ashraf](https://forum.kirupa.com/u/Umair_Ashraf)\
**Replies:** 3\
**Last updated:** [July 7, 2020, 8:16pm UTC](https://forum.kirupa.com/t/reset-the-usestate-to-initial-state-in-reackjs-hooks/643492 "2020-07-07T20:16:00Z")

</div>

i have got three option buttons and basically i am looking when one button is clicked the other two will reset to default , at now it is working but i have to manually set the state of other two but i guess there migh…

[Previous page](https://forum.kirupa.com/c/programming/web-dev/42.md?page=27)

[Next page](https://forum.kirupa.com/c/programming/web-dev/42.md?page=29)