---
title: "How to use model value in javascript in razor view"  
description: "How to use model value in javascript in razor view"  
author: "Hemant Patel"  
published: 2017-12-06  
updated: 2017-12-06  
canonical: https://www.mindstick.com/forum/34375/how-to-use-model-value-in-javascript-in-razor-view  
category: "c#"  
tags: ["c#", "mvc4"]  
reading_time: 4 minutes  

---

# How to use model value in javascript in razor view

Here is my [code](https://yourviews.mindstick.com/view/85458/alan-turing-the-mastermind-behind-cracking-the-enigma-code-during-world-war-ii) but i am not able to use [model](https://yourviews.mindstick.com/view/81334/america-is-reopening-after-corona-lockdown-but-on-swedish-model) [value](https://www.mindstick.com/articles/23219/an-optimized-description-adds-value-to-experience-and-in-turn-effectively-guest-posting-packages) in [java](https://www.mindstick.com/articles/12214/web-development-company-in-india-laid-on-the-foundation-of-concrete-java-programming) [script](https://www.mindstick.com/interview/477/how-can-i-execute-a-php-script-using-command-line) code.

```
@model IEnumerable<MindStickInterview.Web.Models.MarksDetails>

<div class="modal-content">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title"></h4>
    </div>
    <div id="piechart" style="width: 600px; height: 400px"></div>
    <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Ok</button>
    </div>
</div>

<script>
    google.charts.load('current', {
        packages: ['corechart']
    });
    google.charts.setOnLoadCallback(drawChart);

    function drawChart() {

        var data = new google.visualization.DataTable();
        var total = 0;

        data.addColumn('string', 'InterviewPapers');
        data.addColumn('number', 'InterviewMarks');

        //for (var i = 0; i < model.length; i++) {
        //    data.addRow(["Correct " + model[i].Type + " Questions" + " (" + model[i].Marks + ")", model[i].Marks]);
        //    //data.addRow([" InCorrect " + model[i].Type + " Questions" + " (" + model[i].InCorrectQuestions + ")", model[i].InCorrectQuestions]);
        //    total = parseInt(model[i].InCorrectQuestions) + parseInt(model[i].Marks);
        //    data.addRow(["Total " + model[i].Type + " Questions" + " (" + total + ")", total]);
        //}

        var chart = new google.visualization.PieChart(document.getElementById('piechart'));

        var options = {
            title: "",
            position: "top",
            fontsize: "14px",
            is3D: true,
            width: 650,
            height: 450,
            pieSliceText: 'value',
            sliceVisibilityThreshold: 0
        };

        chart.draw(data, options);
    }
</script>
```

\

\

## Replies

### Reply by Anonymous User

Hi Harsh,

You can use following line of code to encode your model value

```
var model = @Html.Raw(Json.Encode(Model))
```

This particular line of code can be integrated in the program in the following manner

```
@model IEnumerable<MindStickInterview.Web.Models.MarksDetails>

<div class="modal-content">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title"></h4>
    </div>
    <div id="piechart" style="width: 600px; height: 400px"></div>
    <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Ok</button>
    </div>
</div>

<script>
    google.charts.load('current', {
        packages: ['corechart']
    });
    google.charts.setOnLoadCallback(drawChart);

    var model = @Html.Raw(Json.Encode(Model))

    function drawChart() {

        var data = new google.visualization.DataTable();
        var total = 0;

        data.addColumn('string', 'InterviewPapers');
        data.addColumn('number', 'InterviewMarks');

        for (var i = 0; i < model.length; i++) {
            data.addRow(["Correct " + model[i].Type + " Questions" + " (" + model[i].Marks + ")", model[i].Marks]);
            //data.addRow([" InCorrect " + model[i].Type + " Questions" + " (" + model[i].InCorrectQuestions + ")", model[i].InCorrectQuestions]);
            total = parseInt(model[i].InCorrectQuestions) + parseInt(model[i].Marks);
            data.addRow(["Total " + model[i].Type + " Questions" + " (" + total + ")", total]);
        }

        var chart = new google.visualization.PieChart(document.getElementById('piechart'));

        var options = {
            title: "",
            position: "top",
            fontsize: "14px",
            is3D: true,
            width: 650,
            height: 450,
            pieSliceText: 'value',
            sliceVisibilityThreshold: 0
        };

        chart.draw(data, options);
    }
</script>
```

\


---

Original Source: https://www.mindstick.com/forum/34375/how-to-use-model-value-in-javascript-in-razor-view

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
