Copied to clipboard

Flag this post as spam?

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


  • Scott Ritshie 35 posts 100 karma points
    May 23, 2016 @ 18:55
    Scott Ritshie
    0

    How to insert ajax form into partial view macro (Umbraco 6)

    Hey all,

    Can you give me an example of inserting an ajax form (created as a partial view) into a partial view macro in Umbraco 6? This is what I have in the macro so far, however, @Html.Partial is missing an assembly reference. Perhaps I'm using the wrong approach, but in essence, the outcome is to create a separate button for each product that renders. Once clicked, a div opens with a form that allows the viewer to order that particular product.

    Thanks for any help! Scott

    @using System.Web.Mvc;
    

    @using Umbraco.Core.Models; @using Umbraco.Core.Services; @{ var selection = CurrentModel.Children; int index = 0;

    foreach(var product in selection) { var product_specs = product.Children;

    <div class="one_half product">
      <div class="fl">
        <h5>@Html.Raw(product.GetPropertyValue("ProductName"))</h5>
      </div>
      <div class="fr">
        <a href="javascript:doThis(@index);" class="button_small">Request a Quote</a>
      </div>
    
      @Html.Partial("_ProductOrderingForm", new UPODS.Models.ProductOrderingModel())
    
      <div class="cl"></div>
      <strong>@product.GetPropertyValue("Description")</strong><br />
      <img src="@product.MediaById(product.GetPropertyValue("Picture")).Url" class="fullwidth mt1" />
      <table class="specs">
        <tr>
          <th>Description</th>
          <th>Length</th>
          <th>Part #</th>
          <th>Reorder #</th>
        </tr>
        @foreach(var spec in product_specs)
        {
        <tr>
          <td>@Html.Raw(spec.GetPropertyValue("Description"))</td>
          <td>@spec.GetPropertyValue("Length")</td>
          <td>@spec.GetPropertyValue("PartNumber")</td>
          <td>@spec.GetPropertyValue("ReorderNumber")</td>
        </tr>
        }
      </table>
    </div>
    index++;
    

    } }

  • Nicholas Westby 2054 posts 7100 karma points c-trib
    May 23, 2016 @ 20:10
    Nicholas Westby
    0

    This recent discussion I've been having covers the basics of AJAX forms in Umbraco: https://our.umbraco.org/forum/templates-partial-views-and-macros/77401-load-content-without-pageload

    Keep in mind this is for posting a form using AJAX, but it can also be used to post to an action method that renders the markup necessary to display a form (sounds like what you are trying to do). Also, keep in mind there are some potential things you'll need to do differently (e.g., some surface controller enhancements may not have been made in Umbraco 6).

    Is there something in particular you'd like help with in relation to the partial view macros?

  • Scott Ritshie 35 posts 100 karma points
    May 23, 2016 @ 20:44
    Scott Ritshie
    0

    Hey Nicholas,

    Thanks for the reply. I typically add ajax partial view forms in a template view, but not a macro. I'm getting an error with Html.Render("SomeView", someModel) because, apparently, you can't use Html.Partial within a macro. Is that correct?

    Like I said, maybe I'm going about this wrong and should using jQuery. I'm a bit light in my understanding of using js to render and process forms, so any basic explanation would be helpful. :)

    Thanks, Scott

  • Nicholas Westby 2054 posts 7100 karma points c-trib
    May 23, 2016 @ 21:07
    Nicholas Westby
    0

    Try ensuring the top of your macro partial view looks like this:

    @inherits Umbraco.Web.Macros.PartialViewMacroPage
    @using System.Web.Mvc.Html
    

    That first line is necessary to ensure you have all the necessary MVC stuff (i.e., the correct Html property). The second line is necessary to give you the .Partial extension method.

    Note that if you are currently inheriting from umbraco.MacroEngines.DynamicNodeContext, you'll have to change a bit of your code around (e.g., to access the macro parameters). See here: https://our.umbraco.org/Documentation/Reference/Templating/Macros/Partial-View-Macros/

  • Scott Ritshie 35 posts 100 karma points
    May 23, 2016 @ 21:56
    Scott Ritshie
    0

    Makes sense, but for some reason, adding the line @inherits Umbraco.Web.Macros.PartialViewMacroPage breaks the macro altogether. I can't even render the macro with nothing on the page but @inherits Umbraco.Web.Macros.PartialViewMacroPage.

    Remember, this is Umbraco 6. Is that only available in v.7?

  • Nicholas Westby 2054 posts 7100 karma points c-trib
    May 23, 2016 @ 22:41
    Nicholas Westby
    0

    This page indicates it's available in Umbraco 6: http://umbracodevelopers.sdesign1dev.co.uk/2014/6/11/umbraco-6plus-razor-macro-for-navigation-menu/

    Perhaps try globally qualifying it: @inherits global::Umbraco.Web.Macros.PartialViewMacroPage

    How does it break the macro? Does it give an error message and stack trace? If not, have you configured macros to throw an exception on errors in your umbracoSettings.config?

    By the way, which specific version of Umbraco 6 are you on (e.g., 6.2.6)?

  • Scott Ritshie 35 posts 100 karma points
    May 24, 2016 @ 05:31
    Scott Ritshie
    0

    I just had a eureka moment! I wasn't aware that you could get macros to throw an error, so thanks for that!!

    What had happened was I forgot I had created macros in my v.6 projects in /macroScripts, rather than /Views/MacroPartials. So, the obvious issues were occurring. I moved them all and made the appropriate Umbraco / code changes and everything is working!

    THANKS SO MUCH FOR THE INSIGHT!

    If you don't mind answering another, would you know how to pass an integer to a partial view form?

  • Nicholas Westby 2054 posts 7100 karma points c-trib
    May 24, 2016 @ 16:19
Please Sign in or register to post replies

Write your reply to:

Draft