Sign in Register
Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • J 351 posts 606 karma points
    Mar 20, 2016 @ 15:29
    J
    0

    Pass razor variable to Javascript

    Struggling with this and hoping someone could help me here.

    I have the below code:

    @if (Model.Children.Where("Visible").Any())
{
    var naviLevel = Model.Children.Where("Visible").First().Level;
    <ul class="level-@naviLevel">            
        @foreach (var childPage in Model.Children.Where("Visible"))
        {
            var ID = @childPage.Id;
            var CustName = @childPage.Name;
            var CustAge = @childPage.Age;
            var CustCountry = @childPage.Country;
        }
    </ul>
}

    The above code goes through the childpage and gets all the value from the properties and adds them to each variable.

    I then have the below javascript. This accepts an array of the above customers which is then displayed in the browser. I have added a few extra repeating lines to show that if the above razor code returns 10 customers then the 10 customers details would be displayed on 10 different lines:

    <script type="text/javascript">

    var Customers = [
      ['Name', Age, Country, ID],
      ['Name', Age, Country, ID],
      ['Name', Age, Country, ID],
      ['Name', Age, Country, ID],
      ['Name', Age, Country, ID]
      ....
      .....
    ];
....
.....
</script>
    1. Within the razor code instead of having individual variables (var ID, CustName etc), i think i should create an object called customer with the variables as properties. If this is the correct approach, then

    A). How can i create this object?

    B). How can i pass this object to the Javascript, so it would display all the customers found?

    Copy Link
  • Aristotelis Pitaridis 76 posts 393 karma points
    Mar 20, 2016 @ 15:52
    Aristotelis Pitaridis
    101

    I would do it using an AJAX call and ask for a json object from a controller in order to use in my code but I could easily change your code in order to do what you want.

    <script type="text/javascript">
    var Customers = [

@if (Model.Children.Where("Visible").Any())
{
    var naviLevel = Model.Children.Where("Visible").First().Level;

    foreach (var childPage in Model.Children.Where("Visible"))
    {
        var ID = @childPage.Id;
        var CustName = @childPage.Name;
        var CustAge = @childPage.Age;
        var CustCountry = @childPage.Country;
        <text>['@CustName', @CustAge, '@CustCountry', @ID],</text>
    }
}
    ];
</script>

    I suppose that ID and Age are numbers, Name and country to be string. I have not tested it but it should work. Inform me if you have a problem with this code.

    Copy Link
  • J 351 posts 606 karma points
    Mar 20, 2016 @ 17:14
    J
    0

    Thank you!!!!

    You saved me hours of pain!!

    Copy Link
  • Richard 1 post 71 karma points
    May 01, 2018 @ 08:18
    Richard
    0

    Exactly what i needed to quote razor in jquery! Thank you!!

    Copy Link

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies