How to pass viewBag data into Javascript and display in div

Question

I am always leery of asking dumb questions here but I need to move on and create a few more active pages but this is a lingering issue in my way ...The chtml in razor contains a switch ,,, in one of the cases there's three if statements.. THIS IS JUST ONE OF THEM depending on the if statements a different string in viewdata is to be fed into a div and the div class "hidden" is removed and the supplied text displayed.... I have over the past few hours regained my briefly lost ability to remove that hidden class (I hate css) but I have never been able to update the content of the div. PLEASE Advise Thank you !!

<div id="divUnUsableEvent" class="hidden">
    <div class="row clearfix">
        <div class="col-md-1"></div>
            <div id="systemExceptionLbl" style="font-size: 2em; color: red;" 
                class="text-danger:focus">
               Please contact IS support
            </div>
       </div>
   </div>

    //alphascores Not present  AND   BetaSCores  Not Present Ready for xxxxx     //alphascores Not present  AND   BetaSCores  Not Present Ready for xxxxx Scoring
if (!Convert.ToBoolean(@ViewData["alphaPresent"]) 
   && !Convert.ToBoolean(@ViewData["betaPresent"]))
{
    <script type="text/javascript">
        $(function() {
            $('#UnUseableEvent').addClass("hidden");
            var txtMsg = @Html.Raw(Json.Encode(ViewData["beforeAlpha"]));
            $('#divUnUsableEvent').removeClass("hidden");
            $('#systemExceptionLbl').removeClass("hidden");
            $('#systemExceptionLbl').innerText  = txtMsg;
        });
    </script>

    <a id="XXXReScoreEvent" 
        href="@Url.Action("Readyforxxxxxx", "Exception", new { Id = (int)@ViewData["Id"] })"
        class="btn btn-primary btn-default btn-too-large pull-left margin" 
        aria-label="XXXReScoreEvent">
        <span class="glyphicon glyphicon-edit" aria-hidden="true"></span>  Ready for xxxxxx Scoring
    </a>
}
break;

I know its hitting the javascript, as that html element (a button) named '#UnUseableEvent' is correctly being hidden in this case. I of course would want the javascript out of this html page and just have function calls in the razor but baby steps

Specifically regarding the ('#systemExceptionLbl').innerText = txtMsg; I have tried

.text
.value
.innerHTML

all to no avail. I can see the correctly formatted Json.Encoded text reach the variable txtMsg, but again I cant get it into the div ..

I am having success now with displaying the div (remove class hidden) I was attempting to affect the wrong div name and the line removing the hidden class from the element $('#systemExceptionLbl') is not needed.

I even tried to skip the JQuery reference and go old school document.getElementById('systemExceptionLbl').innerHTML = txtMsg;

Norlihazmey Ghazali · Accepted Answer · 2016-02-13 18:32:08Z

1

Ever tried :

$('#systemExceptionLbl').text( txtMsg );

or

$('#systemExceptionLbl').html( txtMsg );

as innerText is not a jquery function. Instead use .html() or .text() to insert data into it

answered Feb 13, 2016 at 18:32

Norlihazmey Ghazali

9,0701 gold badge26 silver badges42 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

ChristianProgrammer Over a year ago

Yes this was the trick :: $('#systemExceptionLbl').html(txtMsg);

ChristianProgrammer Over a year ago

Thanks reasoning behinnd this is BECAUSE Its JQuery thats trying to fill the DOM element and adding text in JQuery versus javascript uses the displayed syntax $('#systemExceptionLbl').html( txtMsg ); or $('#systemExceptionLbl').text( txtMsg ); Hey when you've been doing desktop app & windows services most of your life those little web things seem like they were built to trip you up...

Collectives™ on Stack Overflow

How to pass viewBag data into Javascript and display in div

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related