Results 1 to 6 of 6

Thread: Populating DropdownListFor from JQuery

  1. #1

    Thread Starter
    Fanatic Member
    Join Date
    Feb 2000
    Location
    Dunmow,Essex,England
    Posts
    898

    Populating DropdownListFor from JQuery

    Hi All,

    In my MVC App I have:

    Code:
    @Html.DropDownListFor(x => x.VehicleTypeId, new SelectList(Model.VehicleTypes, "Id", "Description"), "-- Select --", new { style = "width:200px; border:1px solid blue;" })
    The idea is that when records exist, then this will be pre-populated by the model. based on info Stored.

    On initial create, I dont pre-populate the combo because the dataset would be huge. I wait until the user has entered enough data in other areas of the screen and then attempt a partial update passing back the information I need to return a more realistic list to populate the combo with.

    in my JQuery postback on my success function, I can see that I have valid data being returned in my object. I now want to get that data out of the object and into the dropdownlistfor.

    All examples I have found dont use this control, but instead use a simple HTML Select. I have been told by the tech lead that I must use this control anybody any ideas, thanks.

  2. #2
    MS SQL Powerposter szlamany's Avatar
    Join Date
    Mar 2004
    Location
    Connecticut
    Posts
    18,263

    Re: Populating DropdownListFor from JQuery

    This builds a SELECT list on the fly - injects it into the DOM -and sets the focus to it

    Code:
    width = String($(args.container).width());
    ddHtml = '<select width="' + width + '" style="width: ' + width + 'px">';
    for (var i = 0; i < validlist.length; i++) {
        ddHtml += '<option ' + (i == 0 ? 'selected="selected" ' : '') + 'value="' + validlist[i].value + '">' + validlist[i].label + '</option>';
    }
    ddHtml += '</select>';
    $input = $(ddHtml)
            .appendTo(args.container)
            .bind("keydown.nav", function(e) {
                if (e.keyCode === $.ui.keyCode.LEFT || e.keyCode === $.ui.keyCode.RIGHT) {
                    e.stopImmediatePropagation();
                }
            })
            .focus()
            .select();
    Does that help you see how you might create a SELECT list on the client side?

    *** Read the sticky in the DB forum about how to get your question answered quickly!! ***

    Please remember to rate posts! Rate any post you find helpful - even in old threads! Use the link to the left - "Rate this Post".

    Some Informative Links:
    [ SQL Rules to Live By ] [ Reserved SQL keywords ] [ When to use INDEX HINTS! ] [ Passing Multi-item Parameters to STORED PROCEDURES ]
    [ Solution to non-domain Windows Authentication ] [ Crazy things we do to shrink log files ] [ SQL 2005 Features ] [ Loading Pictures from DB ]

    MS MVP 2006, 2007, 2008

  3. #3

    Thread Starter
    Fanatic Member
    Join Date
    Feb 2000
    Location
    Dunmow,Essex,England
    Posts
    898

    Re: Populating DropdownListFor from JQuery

    I have tried the following, but this still doesn't Populate, I get no errors and in itemdata I can see the correct values:

    Code:
    var select = $("#VehicleTypes");
    select.empty();
                    $.each(data.VehicleTypes, function (index, itemData) {
                        select.append($('<option></option>').val(itemData.Id).html(itemData.Description));
                    });

  4. #4
    MS SQL Powerposter szlamany's Avatar
    Join Date
    Mar 2004
    Location
    Connecticut
    Posts
    18,263

    Re: Populating DropdownListFor from JQuery

    What does the HTML look like with FIREBUG after you build it up?

    That's a nice looping function - I like it...

    But keep in mind that every $() call is expensive - building the HTML as a single string and inserting into DOM in a single step is the recommended way to work the DOM.

    *** Read the sticky in the DB forum about how to get your question answered quickly!! ***

    Please remember to rate posts! Rate any post you find helpful - even in old threads! Use the link to the left - "Rate this Post".

    Some Informative Links:
    [ SQL Rules to Live By ] [ Reserved SQL keywords ] [ When to use INDEX HINTS! ] [ Passing Multi-item Parameters to STORED PROCEDURES ]
    [ Solution to non-domain Windows Authentication ] [ Crazy things we do to shrink log files ] [ SQL 2005 Features ] [ Loading Pictures from DB ]

    MS MVP 2006, 2007, 2008

  5. #5

    Thread Starter
    Fanatic Member
    Join Date
    Feb 2000
    Location
    Dunmow,Essex,England
    Posts
    898

    Re: Populating DropdownListFor from JQuery

    For some reason the firefox add-in for VS2010 has never worked for me. If I attempt to cut and paste the address from my IE Browser into FF it wants a username password then I receive access denied.

  6. #6
    MS SQL Powerposter szlamany's Avatar
    Join Date
    Mar 2004
    Location
    Connecticut
    Posts
    18,263

    Re: Populating DropdownListFor from JQuery

    Can't you re-direct VS to open that page with a different browser - I flip back and forth between IE and FF easily. FireBug is in the browser - so you get to see the DOM in the browser.

    Google crome has a debugger built in as well - can you re-direct to CROME??

    *** Read the sticky in the DB forum about how to get your question answered quickly!! ***

    Please remember to rate posts! Rate any post you find helpful - even in old threads! Use the link to the left - "Rate this Post".

    Some Informative Links:
    [ SQL Rules to Live By ] [ Reserved SQL keywords ] [ When to use INDEX HINTS! ] [ Passing Multi-item Parameters to STORED PROCEDURES ]
    [ Solution to non-domain Windows Authentication ] [ Crazy things we do to shrink log files ] [ SQL 2005 Features ] [ Loading Pictures from DB ]

    MS MVP 2006, 2007, 2008

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  



Click Here to Expand Forum to Full Width