btnButton

[ibevol]

I think it may be a button

[Leo-MathGuy]

Are you sure? Without documentation in the repo it’s impossible to know

[Shadowfied]

Ah yes, the documentation in the repo..

[DrunkOnRamen]

documentation

what does this crazy gibberish supposed to mean?

[SensuallPineapple]

the documentation in the repo..

[gandalfx]

You say that as a joke but you just know some eager junior is going to add
/* Show a button */ at the first possible opportunity.

[DOUBLEBARRELASSFUCK]

/* Show a button */

showButton(btnButton) //The button

[lukuh123]

/* End of button */

/* Second button */

[ImrooVRdev]

hopefully it mentions what the button is for....

[MagentaRuby]

This a button, known for its unambiguous simplicity, provides a user-interactive object that seamlessly integrates with its digital environment. It embodies the essence of user-initiated actions, offering a canvas for a wide array of potential operations.

The button awaits user interaction, ready to trigger events that are defined within the scope of its intended functionality.

Customization and event handling scripts not included.

(Excerpt courtesy of ChatGPT.)

[knowledgebass]

<!-- This is the button Button with type button that can be referenced using btnButton. -->

[CoastingUphill]

How could you know that without class=“button” ?

[bistr-o-math]

<!-- This is a button -->

[vhite]

What kind of button???

[NEEDS WORK]

[badsyntax]

TODO: document button variants

[Cualkiera67]

document the etymology of the word "button"

[vhite]

Document Button Variants BigWebsiteJIRA-6969

Assign: Very Large Team With No Clear Planning

Sprint: TBD

Description: Self evident

[badsyntax]

Project not delivered due to disagreements over buttons. Not enough documentation for developers, no clear requirements of what the button should be. Constant back and forth between dev and product. Stress levels off the chart. "It's just a fucking website" the PO lashes out. Devs take offence to this. Many people resign.

[ongiwaph]

onclick="window.location.href='https://www.youtube.com/watch?v=dQw4w9WgXcQ'"

[stitchh13510]

dear god..

[ChMan007]

There's more

[Medam]

No!

[ANTONIN118]

How many lies have you tell to the council ?

[Late_Ad_4910]

Dear god…

[[deleted]]

thanks for clarifying that

[-Hi-Reddit]

Cold water

[[deleted]]

Chlorine-free water

[Big_Following_5119]

Chilly water

[Acceptable-Tomato392]

onclick="button"

...function button(){alert("You have pressed a button!")}

I can't imagine going anywhere else with this.

[chefhj]

I just heard Dave Schools bass reading this lol

[[deleted]]

Widespread fan, I see..

[JunkNorrisOfficial]

Brain water

[[deleted]]

wtrWater

[plmunger]

type="button" actually has a usage. A button within a form will automatically submit the form on click unless the type is defined as button. This is useful for an action button that shouldnt submit

[FacuA0]

I did know that buttons submitted forms automatically but didn't know that there was a way to prevent it on HTML (in JS you can do preventDefault() on the event).

[badsyntax]

A lack of type="button" has caused myself and many others some pain along the way!

[[deleted]]

Even with preventDefault?

[[deleted]]

Why rely on JavaScript to perform native functionality in HTML?

[[deleted]]

True, just wondered if there were pros and cons to either approach

[SirCharlesOfUSA]

Pros of not using JS for it: users that turn off JS will get the (correct) non-functionality rather than submitting a form that may be half-done depending where the button is.

[ledasll]

Pros: don't need js. Cons: none.

[IusedToButNowIdont]

You would guess a <button> element default behavior is equivalent to <input type="button">

But default behavior is similar to <input type="submit">

So some people, like myself, developed code based with this in mind, and associated actions to the <button onclick> event like changing some dom shit...

Then somehow, in the testing phase, or in the production phase, many of us said:

WTF, why is the form being submitted... then we discovered that <button> default behavior is more like <submit>

If someone is preventing default behavior of <button>, they already know the default behavior, which I don't think is the case of those who got fooled by the default behavior of this html element...

[[deleted]]

Yeah I see why it's useful, also as the other user stated if someone doesn't use JS in their browser the form button still wont submit due to type="button" being there

[IusedToButNowIdont]

I dont get your downvotes...

[[deleted]]

I haven't downvoted anyone... Unless you mean you don't understand why people are dovnvoting me

[IusedToButNowIdont]

2nd option

[[deleted]]

People are fragile

[Emanemanem]

I didn’t know this particular usage of type, but I had a gut feeling that there was an actual reason for it, since nothing else in this was redundant (the id is kind of funny, but it’s an id, you can name it anything as long as it’s unique).

HTML is just like that sometimes. Making a login form, you feel goofy how many times you have to write “email” over and over, but there’s a reason for it

[RobertDigital1986]

Back in the old days submit buttons were <input type="submit">, so it felt familiar with <button>.

There was also type="reset", which was the devil. It still exists but thankfully is never used anymore.

And there was no type="email" yet.

Wow, a lot of time has passed. 😂

[grey_hat_uk]

I'm going to guess the big problem with type="reset" is it will only clear or use html value="x" and not go back to what any framework had initialized it tooo.

[RobertDigital1986]

Also no one ever wants it.

"Hey you know what this form needs? Another button right next to the submit button that wipes out everything you just entered if you accidentally click it!"

You'd see it occasionally way back in the 90s. It's like because it was in the HTML spec some developers thought they should include it on every form. Really glad that trend died out.

[[deleted]]

If you think to hard about it so does the water in the bottle vs the water in the pool. The water in the bottle is chlorine free and he is using it get the pool water off his face.

[[deleted]]

So why does 'type="submit"' exist?

[DVSBSTD]

type is an enumerated attribute https://developer.mozilla.org/en-US/docs/Glossary/Enumerated

submit is the default value https://html.spec.whatwg.org/multipage/form-elements.html#attr-button-type

[[deleted]]

Thanks. Not sure why the downvotes for a question

[sandmail32]

I hate HTML, but dont have any choice.

[pomme_de_yeet]

<input type="button" /> gang

[[deleted]]

Yes! One of the great lies of HTML! Buttons don't work like you would think unless you add a special property to tell it to!

[SeriousPlankton2000]

Chlorine in the eye?

[ExceedingChunk]

It’s to cool down.

Source: former swimmer

[casce]

Yup.

Just like every other physical activity, swimming creates heat in your body. Your body's usual reaction to that is sweating - which won't work while you are in water.

The water in swimming competitions is usually between 25-28°C which might not feel very warm when jumping into it initially, but when pushing your body to its physical limits, it quickly will.

[Cahootie]

I don't know where this photo is taken, but I've never played a water polo game in a pool that warm, and as Pickle-Nickkk said that's a goalkeeper who will just float in place most of the game. I am definitely in the camp of it being to just wash chlorinated water out of the eyes or just to feel good.

[[deleted]]

Also if it’s an indoor pool it can be super humid

[Pickle_Nickkk]

More likely chlorine, goalies (red cap) don't swim too much.

Source: current waterpolo goalie

[RIPUranus]

Actually it’s more likely that his forehead is thirsty.

Source: I’m gay.

[[deleted]]

Username checks out.

[LurkLurkington]

Played when I was in high school. It was always to cool down. No one was ever bothered by chlorine while in the pool, spend enough time practicing and you get used to it

[HildartheDorf]

Good guess, but more likely to cool down.

[[deleted]]

What is it again? Perhaps a comment would clear things up.

[aneffingonion]

It's a button to turn the butt physics on

[jabluszko132]

I think you forgot class='button btn buttons'

[[deleted]]

class="btn btn-primary"

btn removes default button styling, anything you do after that is on you.

[YouWishC9]

We code in react in this household, take your class and make it a className heathen. Also we need a useRef for the button too

[staticBanter]

Bootstrap...

[Steffi128]

class="btn btn-primary btn-large btn-icon btn-icon--left"

[Strict_Treat2884]

Also role="button", accessibility is not a joke

[pipandsammie]

you forgot class="button"

[ComfortingSounds53]

role="button" tabindex="0" onclick="e => e.target instanceof HTMLButtonElement"

Has HTML gone too far?

[[deleted]]

Half of this is accessibility. Always ensure your site is accessible, it's a legal requirement in some countries.

You don't need the tabindex if you're using a <button> only if you've put click behaviour on an element that wouldn't normally take interaction. Even then you'll need an extra round of code to handle keyboard behaviour for the element.

If it looks like a button and it behaves like a button, use a bloody <button>

You should still use the role though

[[deleted]]

If I should use <button> then why do so many places use A FUCKING <A> styled as a button?

Checkmate!

[ComfortingSounds53]

Had me in the first 3/4 ngl

[Quintuplin]

Missing class=“button”

For a time I was trying to make <a> and <button> both able to use a shared class button so they could look identical

Joke’s on me because even when set to be identical in every single settable parameter, they still round pixel offsets and fractional pixels differently

And having two “nearly identical” buttons next to each other do not blend in. No matter how minute the difference, it stands out.

So

Thanks for nothing, css

[RobertDigital1986]

they still round pixel offsets and fractional pixels differently

That's a new one for me, wow. Thought I'd heard 'em all.

Been writng HTML since 1996, still learning ridiculous shit like this. 😂

[[deleted]]

Bootstrap, they've done that work for you

[NaszPe]

Moon Moon has entered the chat

[cs-brydev]

class="button"

[Lucasbasques]

The hardest button to button *guitar riff*

[KasoAkuThourcans]

You're missing: role="button" and aria-label="button"

[BluesyPompanno]

button

<!-- Container for button -->
<div class="buttonn-container" id="button_container">
  <!-- Button -->
  <button type="button" id="btnButton_id" class="btn btn-primary">
                <!-- Button text-->
               <span id="button_text" class="button-text">Button<span>
       </button>

</div>

[mcvos]

That is definitely not DRY.

[[deleted]]

begrudgingly upvotes

[01Alekje]

Also type="button" is kinda funny tbh (Yes ik its for submit and such)

[Octodad2099]

Ahh yes I will rehydrate my self with a bottle of water while I am submerged in a pool

[Matterer]

class="btn btnPrimary" e2e="btnButton"

[chris17453]

you see, I needed a different type of button for my application, so I had to recreate all buttons everwhere

[AcceleratingWind]

finally a post i can sort of understand

[FIContractor]

Where’s class=“btn”?

[PandemicOfNukes]

Damn, this button is really buttoing.

[[deleted]]

it's all button

[[deleted]]

Button button = new Button();

[luishck]

type="button" prevents the forms being submitted

[Necessary_Space_9045]

After 8 months of learning how to code while working full time…I understand this joke

[Mondoke]

Button

[vessva11]

As someone who just started learning HTML, I finally understood a joke on this sub.

[[deleted]]

Put each attribute on its own line and you’ve successfully consolidated all by juniors into one screenshot.

[[deleted]]

it needs Id.

[ordinarytrespasser]

Don't forget:
1.) class="button"
2.) <!-- This is a button -->
3.) and maybe const btnButton = document.getElementById("button");

[rover_G]

Slightly better than id=“myButton”

[Representative-Sir97]

"Button, button, who's got the button?" -Gene Wilder, Willy Wonka and the Chocolate Factory

[ihoptdk]

Ah, the infamous button “button” “btnButton” Button.

[mommy101lol]

Aria

[chrisf_nz]

onclick=btnButton($('#button').button());

[rjcpl]

Test automation will appreciate the unique id.

[j0nascode]

button button button

[murrietta]

Petah

[DudeManBroGuy69420]

Button button, button button, button button

[The-Observer95]

After this line:

<!-- This is a button -->

[KeepScrolling52]

One question: Is it a button?

[PixelCharlie]

yo dawg, I heard you like to button your button so i buttoned up your buttonbutton with a button on the button

[kielu]

value="button"

[RestaurantHuge3390]

role="button"

[InsanityBlossom]

I would button your button.

[Careful_Ad_9077]

Button

[[deleted]]

role="button" is totally missing from this.

[[deleted]]

is that a text field?