Problem with adding value to form textbox using jQuery

jason · #1 (**permalink**) 21-10-2008, 03:57 PM

I am going out of my mind with what I would typically believe to be a trivial problem...

I have a page with a form. In the form I have a selection box and a few text boxes. When I change the selection box value to zero it should clear the text boxes, and when I change the selection box to any other value it sets the text boxes to other values (which it gets from an ajax call). This all works fine using the following code which I call from my jQuery document.ready event handler.

Code:

if($("select#myselboxID").val() != 0){ // if my selection box value is not zero
            
                $.ajax({ type: "POST", url: "includes/ajax/getDetails.php?id=" + $("select#myselboxID").val(), dataType: "xml", success: function(xml){                    
                    $("form input#name").attr("Value", $(xml).find('name').text());                     
                    $("form input#phone").attr("Value", $(xml).find('phone').text());
                    $("form input#email").attr("Value", $(xml).find('email').text());
                    $("form textarea#_address").text($(xml).find('address').text());
                }});
            }
            else{ // if my selection box value is zero
                $("form input#name").attr("Value", "");                     
                $("form input#phone").attr("Value", "");
                $("form input#email").attr("Value", "");
                $("form textarea#address").text("");
            }

So with the above I can make my form values clear and change to other values etc to my hearts content. However if I go down and manually edit a text box value and then change the value in the selection box, the value I manually set the textbox to stays there and only the other non edited textbox fields change. When really I want all textbox entries to change regardless of whether or not I manually modified them.

Could someone please explain to me why this is happening? I feel like there is something significant about how a browser works with form values that I'm clearly unaware of.

Many Thanks

davkell · #2 (**permalink**) 21-10-2008, 10:16 PM

I have something that's doing something similar (but not exactly the same). I use:

Code:

    $('.display_reply').click(function(){ // if a button is clicked
         $('textarea, :text').val('');       // empty a text area & all text boxes
    });

That will clear everything in my form (1 textarea & 3 input text boxes) when a button with that class is clicked.

Have you tried using .val() instead of setting the .attr() ?

Also, how is the code you posted being triggered? Could it be to do with the event you're using when the select box is changed?

jason · #3 (**permalink**) 22-10-2008, 12:06 PM

Cheers davkell for your reply

Quote:

how is the code you posted being triggered?

Sorry I should have mentioned that the code fires on the selection box change event. This event does fire at the appropriate times, which I have proven to myself by simply inserting alert() calls in the code block.

I just tried using val() to init the values of the form components and it worked a charm!! - fair play

So there's a difference between using val("") and .attr("Value", "") it would appear. At one level they work the same and then on another, they don't.

All the best

davkell · #4 (**permalink**) 22-10-2008, 12:07 PM

No bother, good to see it worked for you!

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Is this possible? (Ajax & JQuery Document Scope Problem)	jason	Coding Help	4	01-07-2008 02:07 PM
Can anyone recommend a text editor (textbox) like TinyMCE for websites?	dude	Webmaster Discussion	11	13-04-2007 04:45 PM
Drupal, problem with adding content by a privilaged user	MacKozer	CMS and Content Management	1	11-04-2007 11:06 AM

Sponsored links

Problem with adding value to form textbox using jQuery

Problem with adding value to form textbox using jQuery

Similar Threads

Sponsored links