Use return values only in javascript

Question

I have an action Map in my Controller Address. In the Action Method I get all the addresses like this:

public ActionResult Map()
{
    var model = this.UnitOfWork.AddressRepository.Get();
    return View(model);
}

My Address Model looks like this:

public class Address
{
    public Int32 Id { get; set; }
    public string Street { get; set; }
    public string City { get; set; }
    public Decimal Latitude { get; set; }
    public Decimal Longitude { get; set; }
    public Int32 StreetNumber { get; set; }

    public Int32 RegionId { get; set; }

    public virtual Region Region { get; set; }

    public virtual ICollection<Person> Persons { get; set; }
}

Now I would like to use the latitude and the longitude in the javascript part of the page. How can I do this?

I've tried to the following:

<script>
    var model = @Html.Raw(Json.Encode(Model));
    // at this stage the model javascript variable represents the JSON encoded
    // value of your server side model so that you can access all it's properties:
    alert(model.length);
</script>

But I got this error:

A circular reference was detected while serializing an object of type 'System.Data.Entity.DynamicProxies.Address_F9A550E3CE9AB1122FFC2E0A154FBDCAF8648B6FBCF91A81E35459DCA2E075AA'.

Sooo you have a circular dependency. Where do you construct your Model object? I'm guessing it's related to the ICollection<Person> Persons. When you create an Address object, does this create a Person as well? — Jeroen Vannevel
– Jeroen Vannevel, Commented Dec 16, 2013 at 16:23
Can you show the code for the Person class? I think you may have a circular reference if Person has an Address property. — Jason Evans
– Jason Evans, Commented Dec 16, 2013 at 16:23
See http://stackoverflow.com/questions/1153385/a-circular-reference-was-detected-while-serializing-an-object-of-type-subsonic. Your JSON serializer is unable circular references which are legit in JavaScript — cbayram
– cbayram, Commented Dec 16, 2013 at 16:24

Roger Far · Accepted Answer · 2013-12-16 16:36:02Z

2

Like it says you have a circular reference somewhere in your mode, but you can set the json parser with options to avoid circular references.

Better would be to parse your mode into a separate viewmodel:

var model = this.UnitOfWork.AddressRepository.Get().Select(m => new ViewModel{
    Latitude  = m.Latitude,
    Longitude  = m.Longitude,
});
return View(model);

This way you only expose the information to the client that is needed.

If you need only a few parameters you might be better of with something like this:

<script>
    var lat = @Model.Latitude;
    var lon = @Model.Longitude;
    // at this stage the model javascript variable represents the JSON encoded
    // value of your server side model so that you can access all it's properties:
    alert(lat);
</script>

answered Dec 16, 2013 at 16:36

Roger Far

2,4033 gold badges41 silver badges72 bronze badges

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

2 Comments

nielsv Over a year ago

Then I get this error: The model item passed into the dictionary is of type 'System.Linq.Enumerable+WhereSelectListIterator`2[App.Models.Address,ReUzze.Models.MapViewModel]', but this dictionary requires a model item of type 'ReUzze.Models.MapViewModel'.

Roger Far Over a year ago

Then change your model in your view to the new viewmodel. My code is just an example.

Collectives™ on Stack Overflow

Use return values only in javascript

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related