ansaurus

Question

Answer 1

+1 A:

Try putting the value in single quotes, like this:

function AddDropdownItem(sText, sValue, sDropdownID)
{
      $("#" + sDropdownID).append("<option value='" + sValue + "'>" + sText + "</option>");
}

You asked, "Why would that matter." The answer. It is a good practice and it prevents problems when your values start having spaces in them. I ALWAYS put attribute values in quotes.

Now, for your problem... I just tried it with the following code and it works like a charm!

<p><select name="MyTestDropdown" id="testDropdown"></select></p>

<script type="text/javascript">
    $(document).ready(function () {

        AddDropdownItem("-Select something test-", "-1", "testDropdown");
        AddDropdownItem("something else", "1", "testDropdown");
        AddDropdownItem("another thing", 2, "testDropdown");

        var id = 104388426283811;
        AddDropdownItem("test big value", id.toString(), "testDropdown");

        AddDropdownItem("Profile Pictures", 100001379631246, "testDropdown");

        AddDropdownItem("Test Test2", 104388426283811, "testDropdown");

    });
    function AddDropdownItem(sText, sValue, sDropdownID)
    {
        $("#" + sDropdownID).append("<option value='" + sValue + "'>" + sText + "</option>");
    }
</script>

Your original code actually works, too. I don't think there was a problem with it. :) Maybe you have a problem elsewhere in your code?

Byron Sommardahl 2010-07-28 19:14:53

why would that matter?

CoffeeAddict 2010-07-28 19:18:51

so that would get rid of or tolerate any spaces? putting in the single quotes?

CoffeeAddict 2010-07-28 19:32:10

It would tolerate spaces. Not a big deal for numbers or when you always have one word, but if you get in the habit of always using quotes (single or double), you free yourself from SO many problems in the future.

Byron Sommardahl 2010-07-28 19:34:31

Answer 2

+2 A:

JavaScript will interpret integers as strings where needed, there is no need to use toString().

Jacob Relkin 2010-07-28 19:15:48

id is a primitive type? it's set to an integer

CoffeeAddict 2010-07-28 19:20:11

This makes no difference since id is an int. toString() or no, it works fine.

Byron Sommardahl 2010-07-28 19:38:40

Answer 3

A:

Based on the comment thread in the original question, here's my sample page that incorporates your logic (along with wiring up a button to add options to the select):

<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery Test</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"&gt;&lt;/script&gt;
<script language="javascript"> 
    $(document).ready(function() {
        $("#btnClick").click(function(e) {
            e.preventDefault();
            var id = 104388426283811;
            AddDropdownItem("-Select something test-", id.toString(), "testDropdown");
            //AddDropdownItem("-Select something test-", "-1", "testDropdown");
        });
    });

    function AddDropdownItem(sText, sValue, sDropdownID)
    {
          $("#" + sDropdownID).append("<option value='" + sValue + "'>" + sText + "</option>");
    }
</script>
</head>
<body>

 <input id='btnClick' type='submit' value='click'></input>
<p><select name="MyTestDropdown" id="testDropdown"></select></p>


</body>
</html>

I don't have the iframes that you mentioned, but I'm using an input submit element to add items in. I'm preventing the default behavior of a submit button by calling e.preventDefault();, which then prevents the post back. I'm then able to add items to the select element.

I hope this helps.

David Hoerster 2010-07-28 20:44:20

so after the DOM loads it's sending what as e back to you? the DOM as an object?

CoffeeAddict 2010-07-28 20:48:39

I see you're also using a submit, mine's an image

CoffeeAddict 2010-07-28 20:51:11

I added more of my code in the original thread...

CoffeeAddict 2010-07-28 20:52:52

It's the element (event object) that's handling the event. In this case, the submit button. Here's the jQuery API entry for this object and the functions/props associated to it. http://api.jquery.com/category/events/event-object/

David Hoerster 2010-07-28 20:54:27

`<input type='image' ...>` is a submit button with an image. Same thing -- it should try to submit the form when you click it. Use `preventDefault` to prevent it from doing that and you should be good.

David Hoerster 2010-07-28 20:57:53

thanks the postback was the biggest issue here. Resolved.

CoffeeAddict 2010-07-28 21:28:59

Awesome! Glad you got it working. That was a lot of comments. :) Later.

David Hoerster 2010-07-28 21:41:54

ansaurus

tags:

views:

answers:

Not able to append options to select

related questions