wont send any info to the textbox and wont give me a confirmation alert

Question

1.00/5 (1 vote)

See more:

I have spent many hours trying to figure this out. I am trying to get all of the data entered in the form to be placed into the text box at the end, also with an alert box confirming what was done. But Nothing is happening!!

[code]

XML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--< html xmlns="http://www.w3.org/1999/xhtml"> -->
<h1>
    Pizzeria</h1>
<p>
    &nbsp;</p>
<p>
    <b>Name:</b>&nbsp;
    <input id="txtName" type="text" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <b>Pickup:</b>
    <input id="rdbPickUp" name="DeliveryMethod" type="radio" value="PickUp" />&nbsp;&nbsp;&nbsp;<b>Delivery:</b>
    <input id="rdbDelivery" name="DeliveryMethod" type="radio" value="Delivery" /></p>
<p>
    <!--      create ddl for style and size-->
    <!-- make ddl have a set value-->
    <b>Style:</b> &nbsp; &nbsp;
    <select id="ddlStyle">
        <option selected="selected">Choose Style</option>
        <option value="empty"></option>
        <option value="deepDish">Deep Dish</option>
        <option value="TomatoPie">Tomato Pie</option>
        <option value="ThinCrust">Thin Crust</option>
        <option value="Stuffed Crust">Stuffed Crust</option>
    </select>
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <b>Size:</b>
    <select id="ddlSize">
        <option selected="selected">Choose Size</option>
        <option value="empty"></option>
        <option value="Small">Small</option>
        <option value="Medium">Medium</option>
        <option value="Large">Large</option>
        <option value="XLarge">Xtra Large</option>
        <!--   <option value="other">Other value</option>-->
    </select></p>
<p>
    <!--     Toppings:
        <select id="investment1" <optgroup="" label="" name="investment0">
            <option value="1000">$1,000</option>
            <option value="5000">$5,000</option>
            <option value="10000">$10,000</option>
            <option value="25000">$25,000</option>
            <option value="other">Other value</option>
        </select></p>-->
    <p>
        <b>Toppings: </b>&nbsp; <b>&nbsp;Pepperoni: </b>
        <input id="chkPepperoni" type="checkbox" /><b> Black Olives: </b>
        <input id="chkBlkOlives" type="checkbox" />
        <b>Meatballs: </b>
        <input id="chkMeatball" type="checkbox" /><b> Sausage: </b>
        <input id="chkSausage" type="checkbox" /></p>
    <p>
        &nbsp;</p>
    <p>
        &nbsp;<input id="btnConfirmOrder" type="button" value="Confirm Order" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <input id="btnClrFrm" type="button" value="Clear Form" onclick="this.form.reset()" /></p>
    <!-- //does this work? -->
    <p>
        <textarea id="txtArea" rows='10' cols='40' disabled='disabled'></textarea></p>
    <p>
        &nbsp;</p>
    <script language="javascript" type="text/javascript">


        var $ = function (id) {
            return document.getElementById(id);

             }

      function () {

            //get buttons and assign a funtion to its onclick

            $("btnConfirmOrder").onclick = ConfirmOrder;

            $("btnClrFrm").onclick = ClrFrm;


        }
       function ConfirmOrder() {

            //alert
            var message = "You have ordered the following:\n\n";

            //test the toppings checkboxes
            //display the checked toppings in textbox

            if ($("chkPepperoni").checked) {
                message +=


             " - " + $("chkPepperoni").value + "\n";
            }


            else if ($("chkBlkOlives").checked) {
                message +=

             " - " + $("chkBlkOlives").value + "\n";
            }
            else if ($("chkMeatball").checked) {
                message +=

             " - " + $("chkMeatball").value + "\n";
            }
            else if ($("chkSausage").checked) {
                message +=

             " - " + $("chkSausage").value + "\n";
            }

            //confirm to user what they have accepted
            //confirm(message)


            $("txtArea").value = message;

            }




        }











    </script>
    <!--</body>-->
</html>

Posted 2-Oct-12 20:52pm

dale disney

Add a Solution

Comments

bbirajdar 3-Oct-12 4:52am

I am deleting my solution since you downvoted it without reason....

dale disney 3-Oct-12 4:55am

you called my code complete crap. And your solution didn't do anything, hence the downvote.

n.podbielski 3-Oct-12 5:30am

I know that you may be upset when someone says something like that. But it's normal. You are human. You do something. You do it wrong, make mistakes. You learn. You are human after all. Please read this post very insteresting posts (they helped me a lot not sometime ago):

http://www.code-magazine.com/Article.aspx?quickid=1105121
http://www.codinghorror.com/blog/2006/05/the-ten-commandments-of-egoless-programming.html

Don't give up. My first programs I wroted without documentation and internet. I tried use one approach. If it wasn't working I tried something else. And another. And another one. Why to try and learn and achive something i want to do. It was hard by I did it.

Don't give up. I easy when you grasp it.
Happy coding.

bbirajdar 3-Oct-12 7:22am

Right you are.. There can be no solution for a crap..Thats why it is called a crap and not as code.... And yes, get my solutions checked from somebody else since you don't know jQuery..

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

n.podbielski · Answer 1 · 2012-10-02T21:28:00

Solution 2

I think problem is this:

JavaScript

var $ = function (id) {
          return document.getElementById(id);

           }

What the hell? Where this come from?

If you intent to use jQuery just use it. Don't make you code a clutter to anyone who gonna see it.
Solution above is example. If you using somewhere function $ anyone assume it's jQuery but in that case it's is not.

Use document.getElementById(id); or use jQuery don't mix those 2.

And for your problem those function are never being executed. Use jQuery or document.ready and change this

JavaScript

function () {

            //get buttons and assign a funtion to its onclick

            $("btnConfirmOrder").onclick = ConfirmOrder;

            $("btnClrFrm").onclick = ClrFrm;


        }

to

JavaScript

$(function () {

          //get buttons and assign a funtion to its onclick

          $("btnConfirmOrder").onclick = ConfirmOrder;

          $("btnClrFrm").onclick = ClrFrm;


      });

[EDITED]

You have to attach events to your form buttons. Without it your code is never executed.

Use document.onload event for that:

http://www.w3schools.com/jsref/event_onload.asp[^]

C#

function load() {

            //get buttons and assign a funtion to its onclick

            $("btnConfirmOrder").onclick = ConfirmOrder;

            $("btnClrFrm").onclick = ClrFrm;


        }
document.onload=load;

or

HTML

<body  önload="load" />

Use firebug in ff for debuging your JS code (like opera dragonfly or IE developer tools). Observe console for any JS errors.

Posted 2-Oct-12 21:28pm

n.podbielski

Updated 2-Oct-12 23:19pm

v2

Comments

bbirajdar 3-Oct-12 3:38am

@n.podbielski .. I know the complete code is a crap. He has just copypasted it from internet. But I did not want to discourage him ... So just trying to help him

n.podbielski 3-Oct-12 4:27am

I did not said that. But you right I am a little cranky today. I am sory for that.

dale disney 3-Oct-12 4:29am

I came on here for help and you and this other guy want to make fun of people who dont know as much as you guys. Remember, there was a time when you didn't know what your know now.

bbirajdar 3-Oct-12 4:50am

Nobody is making fun of you.. Do you think we are paid to invest our time on you ? And yes.. there was a time when I did not know jQuery. Then I went to the jQuery site and started to learn basics and tried the examples myself. I did not go for writing the code directly by placing the $s everywhere. Instead I created small examples of the syntaxes and learned it..

dale disney 3-Oct-12 4:14am

It's not copied or pasted from the internet. I'm relying heavily on code from class.

n.podbielski 3-Oct-12 4:29am

Drop this class if they teaching you something like this. It's bad habit and bad design.

dale disney 3-Oct-12 4:31am

It's too late to get any money back. Are you going to help me, please? I dont know what to do after this.

bbirajdar 3-Oct-12 4:47am

You can't continue with this code. You will have to delete this code completely and write from the scratch...

1. Include jQuery in the HTML
2. Write the code to get the element using jQuery syntax
3. Write the code to call a a function.. learn all these steps seperately...Try creating seperate excercises for these....

dale disney 3-Oct-12 4:53am

Thank you for your help. I gave up on the code about 15 minutes ago. I dont know jquerey yet. I am going to just use what I sorta know with document.getElementById. Hopefully Ill be able to figure it out this way.

n.podbielski 3-Oct-12 5:19am

Damn. I wroted one comment more with more code for you. I probably did not submitted that. Anyway I edited my solution.

dale disney 3-Oct-12 5:22am

thank you. I have all of my failed attempts saved. This program would probably take a experienced programmer 4 minutes to do. If it was .net I'd be able to do it easy. UGH!