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


  • Thomas Lee 38 posts 79 karma points
    Sep 09, 2015 @ 05:21
    Thomas Lee
    0

    Using viewport with razor

    Using Umbraco 7
    Umbraco 7

    Hi Guys,

    I am wondering if its possible to use viewport with umbraco razor codes?

    For example i wan to do something like this

    @if(viewport < 768px) { //run razor codes here }

    I am not sure if this is possible, so far i tried passing variable from a jquery script to razor variable. It won't work.

    Does anyone know if this is possible?

    Thanks in advance. Ralee

    Copy Link
  • Dave Woestenborghs 3504 posts 12133 karma points MVP 8x admin c-trib
    Sep 09, 2015 @ 06:00
    Dave Woestenborghs
    0

    Hi Thomas Lee,

    I think you are confusing 2 things.

    Razor is executed on the server, and jQuery is executed in the browser (client-side).

    This means you can't use client side (jQuery) variables in your razor script.

    Maybe you can explain what you are trying to achieve so we can see if there is a different solution to your problem.

    Dave

    Copy Link
  • Thomas Lee 38 posts 79 karma points
    Sep 09, 2015 @ 07:26
    Thomas Lee
    0

    Hi Dave,

    Thanks for the reply.

    I have a Umbraco form I want to implement on two different part of the page depending on the viewport.

    For mobile viewport i want to display it on the top of the page. For tablet viewport and above i want to display it on bottom.

    The script looks like this @Umbraco.RenderMacro("FormsRenderForm", new {FormGuid="e17a2df0-c348-4495-83ac-c52e958c5862"})

    So my plan is to do something like this

    //top @if(viewport < 768){ @Umbraco.RenderMacro("FormsRenderForm", new {FormGuid="e17a2df0-c348-4495-83ac-c52e958c5862"})}                                                                                  

//bottom @if(viewport < 768){ @Umbraco.RenderMacro("FormsRenderForm", new {FormGuid="e17a2df0-c348-4495-83ac-c52e958c5862"})}

    Thanks for helping me!

    Cheers Ralee

    Copy Link
  • Dave Woestenborghs 3504 posts 12133 karma points MVP 8x admin c-trib
    Sep 09, 2015 @ 07:49
    Dave Woestenborghs
    0

    You can render the form twice and show/hide it using css media queries.

    I never tried using the same form twice on a page using Umbraco Forms, but I can imagine that i can cause problems.

    Dave

    Copy Link
  • Thomas Lee 38 posts 79 karma points
    Sep 09, 2015 @ 07:53
    Thomas Lee
    0

    Hi Dave,

    I tried doing that. But my second form Google Recaptcha won't work..

    =(

    Copy Link
  • Dave Woestenborghs 3504 posts 12133 karma points MVP 8x admin c-trib
    Sep 09, 2015 @ 08:34
    Dave Woestenborghs
    0

    Maybe you can render the form once. And change the location using javascript ?

    Dave

    Copy Link
  • Thomas Lee 38 posts 79 karma points
    Sep 09, 2015 @ 08:49
    Thomas Lee
    0

    That's totally new to me.

    Can you share a short snippet on how that works?

    Thanks Ralee

    Copy Link
  • Dave Woestenborghs 3504 posts 12133 karma points MVP 8x admin c-trib
    Sep 09, 2015 @ 09:02
    Dave Woestenborghs
    0

    Maybe this article can help you out : http://www.elated.com/articles/jquery-removing-replacing-moving-elements/

    Copy Link
Please Sign in or register to post replies

Write your reply to:

Draft