Passing Variable from Razor to Javascript

Question

So I have a list of objects in my controller, and I would like to have a button that initiates a pop-up window, which associates with each of the object in the list. I think this needs to be done by Javascript, and to identify what window to display, I would need to pass the ID parameter (one of the attributes of the object) to the javascript. I currently have the following code:

@Html.BeginForm()
{
            @for (int i = 0; i < Model.Count(); i++)
            {
                var theId = Model[i].CW_Id;
            <tr>
                <td>
                    <input type="button" id="btnpopup" value="Details" onclick="ShowModelPopUp()" data="theId" />
                </td>
                @Html.EditorFor(m => Model[i], "CWinline") //Compiles the list using Editor Template
            </tr>
            }
            </table>

        <input type="submit" value="Save" class="btn btn-default" />
    }

    <script type="text/javascript">
        ShowModelPopUp = function () {
            var theId = $(this).data();
            window.showModalDialog('/Default/Selected/?id='+theId, "WindowPopup", 'width=200,height=500');
        }

    </script>

Somehow the variables aren't passing properly. Does anyone know where it went wrong?

Jacob · Accepted Answer · 2015-08-06 18:19:58Z

1

This:

<input 
  type="button" id="btnpopup" 
  value="Details" 
  onclick="ShowModelPopUp()" 
  data="theId" />

...will put the string "theId" in the attribute. You want this:

<input 
  type="button" id="btnpopup" 
  value="Details" 
  onclick="ShowModelPopUp()" 
  data="@theId" />

The @ will let the razor template engine know to switch to output a .NET value.

answered Aug 6, 2015 at 18:19

Jacob

79k24 gold badges159 silver badges245 bronze badges

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

3 Comments

NicTam Over a year ago

Somehow the value is not getting passed properly. It's been passed as "[object Object]". Do you know why that is happening?

Jacob Over a year ago

@theId is going to basically do a @theId.ToString(); if you want it to be JSON, you'll need to serialize it.

Jacob Over a year ago

With JSON.NET, for example: @JsonConvert.SerializeObject(theId)

Jonathan Felipe · Accepted Answer · 2015-08-06 18:20:21Z

0

try

 <input type="button" id="btnpopup" value="Details" onclick="ShowModelPopUp()" data="@Model.id_attribute" />

answered Aug 6, 2015 at 18:20

Jonathan Felipe

1

Collectives™ on Stack Overflow

Passing Variable from Razor to Javascript

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related