Using hidden values with jQuery (and ASP.NET MVC) -- not working?

Posted by SlackerCoder on Stack Overflow See other posts from Stack Overflow or by SlackerCoder
Published on 2010-04-15T14:08:55Z Indexed on 2010/04/15 14:13 UTC
Read the original article Hit count: 185

Filed under:
|

Im using a couple of JSON calls to render data, etc etc. In order to keep the proper key value, I am storing it in a tag.

I have this in several places in my code, none of which cause an issue like this one is. Here is the jQuery:

The call that "sets" the value:

    $("a[id^='planSetupAddNewPlan']").live('click', function() {
        var x = $(this).attr('id');
        x = x.substring(19);

        $("#hidPlanSetupCurrentGroupKey").val(x);

        $.getJSON("/GroupSetup/PlanSetupAddNewList", { GroupKey: x }, function(data) {
            $("#planSetupAddNew").html('' + data.TableResult + '');


            alert('First Inside 2 ' + x);

            $.blockUI({ message: $("#planSetupAddNew") });
        });
    });

The call that "gets" the value:

$("#ddlPlanSetupAddNewProduct").live('change', function() {
            var a = $("#hidPlanSetupCurrentGroupKey").val();
            var prod = $(this).val();

            alert(a);

            $.getJSON("/GroupSetup/PlanSetupChangePlanList", { GroupKey: a, Product: prod }, function(data) {
                if (data.Message == "Success") {
                    $("#planSetupAddNewPlan").html('' + data.TableResult + '');
                } else if (data.Message == "Error") {
                    //Do something
                }
            });
        });

Here is the html in question:

<div id="planSetupAddNew" style="display:none; cursor: default;">
    <input type="hidden" id="hidPlanSetupCurrentGroupKey" />
    <div id="planSetupAddNewData">

    </div>
</div>

In the first section, the alert ('First Inside 2 ' + x) returns what I expect (where x = the key value), and if I add a line to display the contents of the hidden field, that works as well:

ie.

var key = $("#hidPlanSetupCurrentGroupKey").val();
alert(key);

In the "alert(a);" call, I am getting "undefined". I have looked at the other code in the same view and it is the same and it works. I must be missing something, or have some sort of mistype that I havent caught.

Just an overview of the controller events: The first call (/GroupSetup/PlanSetupAddNewList) will return an html string building a "form" for users to enter information into.

The second call (/GroupSetup/PlanSetupChangePlanList) just changes a second dropdown based on the first dropdown selection (overwriting the html in the div).

If you need more info, let me know!

Any thoughts/tips/pointers/suggestions?!?!

Thanks for all your help :)

© Stack Overflow or respective owner

Related posts about asp.net-mvc

Related posts about jQuery