Accessing C# variable from Javascript in asp.net mvc application

Question

I have a problem in How to use javascript variables in C# and vise versa : I have this Model passing to the view:

public List<Tache> Get_List_Tache()
{
    Equipe _equipe = new Equipe();
    List<Tache> liste_initiale = _equipe.Get_List_tache();
    return liste_initiale;
}

It's a list of objects Tache in which I'd like to use it's three fields Tache_description, Begin_date and End_date.

In my JavaScript code I have this function and it works fine:

       <script>

        $(document).ready(function () {
            var date = new Date();
            var d = date.getDate();
            var m = date.getMonth();
            var y = date.getFullYear();

            $('#calendar').fullCalendar({
                theme: true,
                header: {left: 'prev,next today',center: 'title',right: 'month,agendaWeek,agendaDay'},
                editable: true,
                events: [
                         @foreach (var m in Model.Get_List_Tache())
                          {
                        @:{title : @m.Tache_description , start: @m.Begin_date , end :  @m.Begin_date }
                          }
                        ]

                });
                                        });

</script>

The values of the array events are just for test, and I need to fill events by the value of the Model. For each element like this: title = Tache_description, start = Begin_date and end = End_date.

So how can I do this task? Any suggestions?

Is there anyway you could return a JSON result, and perhaps make a call to the data that way? — Stuart.Sklinar
– Stuart.Sklinar, Commented Jul 16, 2013 at 8:22

Vivek Jain · Accepted Answer · 2013-07-16 08:48:38Z

3

Try this,

foreach (var item in YourList)
{
    events: [{ title: '@item.title', start: '@item.start', end: '@item.end'}]
}

So, in this code just replace name your model entity.

edited Jul 16, 2013 at 8:48

Vivek Jain

3,8856 gold badges33 silver badges47 bronze badges

answered Jul 16, 2013 at 8:24

Jeet Bhatt

7682 gold badges8 silver badges22 bronze badges

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

1 Comment

Lamloumi Afif Over a year ago

but the model is a list of Tache(description,begin,end)

Alexandr Mihalciuc · Accepted Answer · 2013-07-16 08:53:57Z

2

Make a foreach razor loop within javascript :

var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
$('#calendar').fullCalendar({
    theme: true,
    header: {left: 'prev,next today',center: 'title',right: 'month,agendaWeek,agendaDay'},
    editable: true,
    events: [
    @
    {
      bool isFirst = true;
    }
    @foreach(var m in Model)
    {
        if(!isFirst)
        {
          @:,
        }

        @:{title: @m.Tache_description, ...<other properties here>}

        isFirst = false;
    }
    ]
});

edited Jul 16, 2013 at 8:53

answered Jul 16, 2013 at 8:30

Alexandr Mihalciuc

2,57717 silver badges12 bronze badges

8 Comments

Lamloumi Afif Over a year ago

but it indicates an error of syntax in the comma in @:{title: @m.Tache_description, start: @m.Begin_date, end : @m.Begin_date }

Alexandr Mihalciuc Over a year ago

Yep you need to check if the item is first or not, if it is not first add a commar before "{"

Lamloumi Afif Over a year ago

sorry i don't understand what order ?

Alexandr Mihalciuc Over a year ago

Look at the updated answer, it has a sample code for checking it

Alexandr Mihalciuc Over a year ago

can you post the generated javascript?

|

HaoYuan · Accepted Answer · 2013-07-16 08:29:29Z

2

For title, you can do title = "@Tache_description"

Not sure about the format/type of your Begin_date and End_date, you may need some function to read the date into a javascript format. Shouldnt be that hard.

Loop through each element and add the elements to the events array. It is something like...

events = new Array()
@foreach(tache in list){
    item = { blah : blah, blah : blah };
    events.push(item);
}

for each c# item in this c# list, write these lines of javascript. You may end up with a very long javascript code block, but it should do the trick. Above is pseudocode.

answered Jul 16, 2013 at 8:29

HaoYuan

3242 silver badges6 bronze badges

Comments

Marius Schulz · Accepted Answer · 2013-07-16 08:39:01Z

2

To add to Darin's answer: If you need the server-side variables in an external JavaScript file, take a look this blog post: Generating External JavaScript Files Using Partial Razor Views

answered Jul 16, 2013 at 8:39

Marius Schulz

16.5k12 gold badges65 silver badges100 bronze badges

Comments

FosterZ · Accepted Answer · 2013-07-16 08:22:14Z

1

1: if your model is expecting the list of Tache then you have the whole list you can manipulate.

2: you can get the data using jquery ajax as json data by calling your action Get_List_Tache().

answered Jul 16, 2013 at 8:22

FosterZ

3,9216 gold badges41 silver badges64 bronze badges

Comments

Darin Dimitrov · Accepted Answer · 2013-07-16 09:05:36Z

0

Assuming this javascript is inline in your page you could do the following:

@model IList<Tache>
<script type="text/javascript">
    var events = @Html.Raw(Json.Encode(Model.Select(x => new { title = x.Description, start = x.Begin.ToString("o"), end = x.End.ToString("o") })));

    $('#calendar').fullCalendar({
        theme: true,
        header: { 
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        editable: true,
        events: events
    });
</script>

This example assumes that your Tache model has properties Description, Begin and End:

public class Tache
{
    public string Description { get; set; }
    public DateTime Begin { get; set; }
    public DateTime End { get; set; }
}

And if this script is in a separate javascript file you could still set a global events variable in your view which will later be used by your script. Alternatively you could fetch this model using an AJAX call.

edited Jul 16, 2013 at 9:05

answered Jul 16, 2013 at 8:25

Darin Dimitrov

1.0m275 gold badges3.3k silver badges3k bronze badges

7 Comments

Lamloumi Afif Over a year ago

I have a problem here (x => new { : it didn't accept the lambda expression

Darin Dimitrov Over a year ago

Try putting it on the same line. I have updated my answer. Also make sure that you have used the correct property names on your Tache model in the lambda expression. And by the way if Visual Studio underlines this with red squiggle as error you can ignore it. Visual Studio Intellisense is not intelligent enough. Run your application and see if it works.

Lamloumi Afif Over a year ago

the same this error appears :

CS1977: Can not use a lambda expression as an argument to a dynamically distributed free by first cast to delegate type or kind of expression tree operation

Darin Dimitrov Over a year ago

This should work unless your code is different than what I have shown in my answer. Is your view strongly typed to @model IList<Tache>. I hope you are not attempting to use some ViewBag stuff.

Lamloumi Afif Over a year ago

What is the reason of this error

CS1977: Can not use a lambda expression as an argument to a dynamically distributed free by first cast to delegate type or kind of expression tree operation

?

|

Collectives™ on Stack Overflow

Accessing C# variable from Javascript in asp.net mvc application

6 Answers 6

1 Comment

8 Comments

Comments

Comments

Comments

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

1 Comment

8 Comments

Comments

Comments

Comments

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related