Unable to access ViewBag in JQuery Dialog in MVC

Question

Can't access the viewBag Data inside the Dialog window. Outside of Dialog displays User ID, but inside of Dialog not displaying the UserID Script

<script>
    $(function () {
        $("#dialog").dialog({
            autoOpen: false,
            modal: true,
            width: 339,
            overlay: {
                backgroundColor: 'red',
                opacity: 0.5
            },
            show: {
                effect: "blind",
                duration: 500
            },
            hide: {
                effect: "explode",
                duration: 700
            }
        });
    });

    function OpenDialog()
    {
        $('#dialog').dialog("open");
    }
</script>

<div id="open" onclick="OpenDialog();">Click To Open</div>  

  @ViewBag.UserID
    <div id="dialog">   
            <table>
                <tr>
                    <td>User ID</td>
                    <td>@ViewBag.UserID</td>
                </tr>
                <tr>
                    <td>Comments</td>
                    <td>@Html.TextArea("CommentsTextBox")</td>
                </tr>
            </table>
            <div class="alignCenter"> 
                 <input type="submit" value="Add" /> 
                 <input type="button" value="Cancel" /> 
            </div>
    </div>

Answer 1

as it is listed I dont see anything wrong with your cshtml.

http://dotnetfiddle.net/clz3Md