如何将模型字段传递给视图中的Javascript函数？

Question

I have a simple question that has been vexing me tonight... I have an ASP.NET MVC4 + Razor application. When the user clicks a radio button, I want to pass a string value from a field in the model, "Timezone", to the onclick handler, which is a javascript function. In the javascript function, I will take the string and do some work, but for now, I simply pop-up an alert(). I have found a lot of references to having to do special quoting, and I've tried all of them, but no matter what I do, the alert shows nothing, but the form that has the radio button shows me a valid value in its Timezone textbox.

I would really appreciate your help to figure out what I am doing wrong... If this is not possible (why?), then can I access the model's value from the javascript function? I tried @model.Timezone, but always have an empty string. Really vexing stuff when I know that it must be something really easy! Anyway, here is the code for the radio button and the simple javascript function. I'd really appreciate your help!

Thanks, Mike

    @Html.RadioButtonFor(model => model.TimezoneSource, "C",
        new {propertyName = "UpdateTimezoneRadioButton", 
            onClick = "TimezoneClicked(@model.Timezone)" })Update Timezone

function TimezoneClicked(timezone) {
    alert(timezone);
}

Answer 1

You shouldn't be doing

  onClick = "TimezoneClicked(@model.Timezone)" 

when you use that within the html helper function, it gets treated as a normal string. Instead you should be doing the following:

onClick = "TimezoneClicked('" + Model.Timezone + "')"

This will pass the Timzone value in the object to the function. If it's still empty, try to print it out like the following to make sure the property is not empty.

<span> @Model.Timezone </span>

Answer 2

You can try the below code:

@Html.RadioButtonFor(model => model.TimezoneSource, "C",
    new {propertyName = "UpdateTimezoneRadioButton", 
        onClick = "TimezoneClicked('" + Model.Timezone + "')" })Update Timezone

function TimezoneClicked(timezone) {
alert(timezone);
}

Answer 3

如果你需要获得函数中的任何dom元素，你可以这样做：

 document.getElementById('@Html.IdFor(model => model.Draw)')