Question

14

A very simple Alert and Confirm Box style with css

rated 0 times [ 18] [ 4] / answers: 1 / hits: 26313 / 10 Years ago, sun, november 16, 2014, 12:00:00

I have the follow simple code for a confirm box

<!DOCTYPE html>

<html>

    <body>

        <p>Click the button to alert the hostname of the current URL.</p>



        <button onclick=myFunction()>Try it</button>



        <script>

            function myFunction() {

                confirm(Confirm!!!!);

            }

        </script>

    </body>

</html>

but my problem is I want with css to style the OK and Cancel button with a very simple way. I'm looking for a real simple solution.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

irvingcarloe

Add To Favorites

Follow

Total Points: 677

Total Questions: 109

Total Answers: 96

Location: Svalbard and Jan Mayen

Member since Sun, Sep 25, 2022

2 Years ago

irvingcarloe questions

1 Is it better to use multiple states or one state object in React?

Wed, Aug 10, 22, 00:00, 2 Years ago

1 Tailwind classes not working after page refresh in production

Fri, Jun 4, 21, 00:00, 3 Years ago

1 Event listener for dataLayer push events on Tag Manager JS

Wed, Mar 31, 21, 00:00, 3 Years ago

1 Convert file to Base64

Tue, Aug 4, 20, 00:00, 4 Years ago

1 How to autoplay audio in any browser?

Fri, Jul 3, 20, 00:00, 4 Years ago

View All

answered 10 Years ago gavenmekhio · Accepted Answer

alert and confirm are built-in to JavaScript and STOP page execution until they are answered, which is what allows you to do:

if( confirm('do you want to see this?') ) {

    //show them.

}

Any confirm() solution that you work-up that can be styled won't be able to be included in an if statement. If you want code to only execute when the confirm is clicked, then you need to make that code as a callback, which make the above code look more like this:

mySpecialConfirm('do you want to see this?', function() {

    //show them

} );

Then, you have to wire that function call into the ok button click on the confirm dialog that you create. This means that it's inherently more complicated just from a coding standpoint not to mention the code that has to wire that up to an HTML form. I would say that it's not worth it to re-invent the wheel and make your own modal. This means that you need to choose jQuery and jQuery UI, or jQuery and Bootstrap, or Dojo Toolkit, etc., and then from there look for the solution that they have for doing this, or use their modals.