Access ASP.NET 5 View Component via URL - asp.net-core

With the replacement of partial views in ASP.NET 5 with view components, how does one access the view components via URL?
I know you call them like...
#Component.Invoke("SomeList", 1)
...but what if you need to have like ajax paging, where you need a callback url to request the next set to be displayed in a partial view? So, a user can click "Load More" and it loads more from a 'partial view'.

You cannot access a view component from a URL directly. A view component is just a component of a view and that view could be a regular or partial view.
Based on your question, I believe you are trying to show the first page by default when the view (having the view component) is rendered? I have tried to put some scenarios here.
Example scenario:
Show a snippet on layout page which shows list of available job positions.
Usage cases:
Render the html related to a job list at the server side :
Layout page would have something like #Html.Partial("JobsListPartial").
This "JobsListPartial" would have something like await #Component.InvokeAsync("JobsListViewComponent", pageNumber). This partial view also sends ajax script to the client for users to navigate through the pages.
At the client when user tries to navigate to a different page, the ajax script makes a call to a JobsController having an api like IActionResult GetJobs(int pageNumber) and this action returns a PartialViewResult by doing something like return PartialView("JobsListPartial", pageNumber).
Render all pages at the client side only :
Create a partial view (having your ajax scripts) and render to the client.
Create a controller exposing api for navigation through pages of available job positions.
Call this api(returns json) from the ajax script.
Use the json data to dynamically change the UI at the client.

Related

SAP Spartacus Create login popup

I neet to create registration/login popup.
The header component is on all pages.
I have login btn in header.
I have page /login/register with a slot BodyContentSlot-register
I don’t know how many components can be added to BodyContentSlot-register, but I need to click on the icon in the header to show the registration form in a modal window without going to the registration page. And show in a modal window all the components of this slot.
To achieve directly what you've described:
In the modal:
you need to make a call using CMS service to get page data (that calls backend for CMS page data) OR get the data if you've loaded it before (as an optimizaiton only)
display the slot's content you want to show, i.e. using cx-page-slot component statically in your modal and passing the position as an input
The tricky part is that this component gets from CmsService the slots of the current page, i.e. cart page (based on routing /cart), but not the page data you've loaded programatically in your modal. So you need to customize CmsService to return you the CMS data for specific slot of given page (register), even if it's not a part of current page data.

Pass data to partial view after it has been loaded

Is there a way that I can pass data to a partial view after it has been rendered. I have a partial view in my _Layout which is rendered. It needs isHeaderShown. However this isHeaderShown can only be set after the #RenderBody is called because only the body controller has this info.
I have in my layout.
#{Html.RenderAction("Index","_Menu", new { area = ""});}
#RenderBody()
Is there a way that I can pass data to a partial view after it has been rendered.
Not using server side. You could always make an AJAX request to the server using javascript and then update some portions of the DOM with the results received from the server. This will obviously happen at a later stage after the view has already been rendered in the browser. Another common technique different than AJAX is the server to push some data to the client using HTML5 WebSockets. You can take a look at SignalR. In both cases you will need to write javascript.

All requests goes against the same action in Piranha

I've started using Piranha CMS and really enjoining it, but now I came into a bit of trouble.
One of my pages is a contact form where I want to post an extended page model with contact information to the controller.
I've created a page template Contact and in the manager gui and I've set the setting View to Contact
The correct view is loaded but the problem is that all the requests goes against the index action method and not the contact action method in PageController.
What am I doing wrong?
The view is used to signal the controller what view should be used to render the page, not which action should be called. This can be used when several pages has the same type of data and logic, but should be rendered differently.
The field route is used to rewrite a page to a controller/action. The default route for a page is Page which means that requests to that page is rewritten to ~/page, i.e the PageController and its Index action. If you wanted a certain type to be rewritten to the contact action of the PageController you set the route to Page/Contact which will rewrite the request to ~/page/contact.
If you have a complex structure you should add custom controllers, for examples a ProductController. The route could then be set to Product rewriting the request to ~/product.
I hope this clarifies things!
Regards
Håkan

How to load Partial Views using Radio button in mvc4 asp.net razor?

I have two registration types. One is Individual and second as Business type registration.
I have two radio buttons. I have used Html Helper for this. When I click on first radio button
the individual partial view should be loaded. How can I achieve this using ap.net mvc4 razor
Use AJAX to make a request to the controller within a radio button's change function. In the controller action with an HttpPost or HttpGet decoration, you would return a partial view. Within your ajax response you would recieve it as dataType:'html' and place the result inside of a div.
Google is your best friend when you're learning.

jQuery Mobile does not process elements in Partial View

I'm converting my site from using jQueryUI to jQuery Mobile, and I'm having some trouble.
I have a page that lets users add new timesheet entries. They click the "Add" button and it retrieves a Partial View from the server right onto the page.
The problem is that jQuery Mobile is not applying to any of the elements in the Partial View.
How can I force jQuery Mobile to process my elements after they've been inserted into the page?
The short answer is that you can just trigger the create method on the parent element of where you inserting your partial view.
For example $('#container').trigger( "create" );
Alternatively most widgets can be manually initialized by calling them on the element, for example for a listview: $('#myListview').listview(). This can be useful if you have only a few elements that need to be enhaced and you don't want to traverse all the child elements of the container. You should also know that for many widgets there is also a refresh method which you can call if you add elements to it after it has already been initialized for example $('#myListview').listview('refresh).
Also have a look at the following Q & A from the JQM docs which deals with this issue and for an explanation as to why it is necessary to call these methods.
Question: Content injected into a page is not enhanced.
Answer:
jQuery Mobile has no way to know when you have injected content into a
page. To let jQuery Mobile know you have injected content that must be
enhanced, you need to either make sure the plugins are called to
enhance the new elements or trigger("create") on the parent container
so you don't have to call each plugin manually.