How to merge the custom page data in existing page(_Header.cshtml)?

Hi,

I have added custom page in Nop.Web that access data from different database other than nop commerce database. All working fine and I got result for same. I am using ViewData  and accessing ViewData value on .cshtml page. Problem is I want to merge output with header section of _Header.cshtml page.

Output of custom page :
Gold: $1308.80 - Silver: $16.37 - Platinum: $898 as of: 4/10/2018

I want to merge above output like below(inside _Header.cshtml page)
Required Output :
_Header.cshtml
<div class="header">
    @await Component.InvokeAsync("Widget", new { widgetZone = PublicWidgetZones.HeaderBefore })
    <div class="header-upper">      
        <div class="header-info">
            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 store-address">
                <span>
                    <b>11316 Lebanon Road, Mt. Juliet, TN - 37122</b>
                </span>
            </div>
            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 gold-metal-price">
                <span>
                    Gold: $1308.80 - Silver: $16.37 - Platinum: $898 as of: 4/10/2018 | Click for Live Metal Price
                </span>
            </div>
        </div>
    </div>
    @await Component.InvokeAsync("Widget", new { widgetZone = PublicWidgetZones.HeaderMiddle })
    <div class="header-lower">
        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12 top-social-media">
            <div class="footer-block follow-us">
                <div class="social">
                    @await Component.InvokeAsync("SocialButtons")
                </div>
                <div class="contact-number">
                    <span><i class="fa fa-phone" aria-hidden="true"></i></span>&nbsp;<b>(615) 758-2020</b>
                </div>
                <div class="search-box store-search-box">
                    @await Component.InvokeAsync("SearchBox")
                </div>
            </div>
        </div>
        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
            <div class="header-logo">
                @await Component.InvokeAsync("Logo")
            </div>
        </div>

        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
            <div class="header-links-wrapper">
                @await Component.InvokeAsync("HeaderLinks")
                <br /><br />
                @await Component.InvokeAsync("FlyoutShoppingCart")
            </div>
            <br />
        </div>
    </div>
    @await Component.InvokeAsync("Widget", new { widgetZone = PublicWidgetZones.HeaderAfter })
</div>

Can any one please guide me how can I achieve this?

You can append html data in html element “gold-metal-price > span “ using jquery on page load

it’ll work

another way is create view components or widget and at ot whenever you want show data.

Hello,

you could set span id and based on that id you can set some custom value with the use of javascript and jquery on document ready.

Another , you could call your partial action from that span so, you can set dynamic value.

so this way you could achieve.

Hello,

you could set span id and based on that id you can set some custom value with the use of javascript and jquery on document ready.

Another , you could call your partial action from that span so, you can set dynamic value.

so this way you could achieve.


Can You please explain using code ?

sk5202 wrote:

Can you please explain using code?

rajupaladiya wrote:

Can you please explain using code?
Because I am new to MVC and Nop Commerce as well

Sure, I can.

But I’m not available with system for next few days.
So once will available with than will update you,

Thank You