Knockout partial view dynamic lazy loading - c#

I am currently stuck with a scenario that I need to achieve and I am hoping you would be able to help me.
The scenario I am facing is as follow:
I am displaying a list of objects with a basic summary of information. These objects are populated from c# code via a web service call that retrieves the data. For each one of these objects that are then displayed there is a select button. When this select button is clicked, another div right below the current summary div should load a partial view. This partial view must also retrieve more data via web service and display the detailed view for the current object that was selected.
I have read the article on using the ko.onDemandObservable (http://www.knockmeout.net/2011/06/lazy-loading-observable-in-knockoutjs.html) which seems to be doing what I want, but I am unsure on how to re use the same template as detail view for each summary object.

Related

Updating Model inside of view

I've been working on a photography page for a while now. Now I've tried to create a page on which user will upload photos to database.
I wanted to give the user an option of selecting photo categories on the create/upload page using checkboxes. I wanted to use a viewmodel with list of categoryview models which would represent the checkboxes.
Now the tricky part that i need some help with is how do I allow user to dynamically add new categories (if he needs to) on the same page. So how would i add new values into the list of categories on view.
Only thing that comes to my mind is to create an ajax post that would call a method that would create the new category in the database. Then i could append a new checkbox representing that category, But then i do not know how i would send that category in the list of categories in viewmodel without refreshing current page. Is this even possible?
If any1 has any ideas how to start on this I would be grateful.

How to return an object from controller to View which may not be model

I am very new to MVC and I am not too conversant with the best practices here. I am facing a design issue which may be common or uncommon to newbies like me. My problem is the following:
I have a page with two parts in it.
Grid Control (with Employee basic info in it)
Employee Details (When someone clicks on Grid row, it loads all the details about the employee)
I am using KendoGrid and it is getting all its data from an ActionMethod from my controller.
Now, when I click on the row, I have the following options:
I call some ActionMethod in Controller and return all the Details
Should I use partial View with a separate model so that ActionMethod in response calls RenderPartialView()?
Should I NOT create a partial View, have Actionmethod return JSON and parse it in the Model?
3.1 If I go for this option then would the JSON be part of model?
3.2 If it is not going to be part of model, how can I use JSON to render the View?
Or probably I am missing something basic here?
Yes you can use action method returning JsonResult. what needs to be done is keep the uielements you need to show on the click of grid row in the page itself. initiate a ajax call to the action method and on success update the values of the UI elements from the values received in JSON and make the entire DIV as visible which holds the total information.
Instead of passing entire HTML over the network I think you can opt for json.
An example you can find at following location
example

General concept regarding dynamic textboxes on the fly

I am working on a project which has a requirement to build "pages" on the fly. A page can consist of various controls like textboxes, checkbox etc. Currently when the user wants to add a new textbox I make a ajax request and render partial view and return the HTML and show it on client side. This works but I also want to handle the data properly when these dynamic controls are filled up by user. In a way if I am not wrong I need to be able to make array of HTML controls. Now if we give static List to our view and generate textboxes using Html.TextboxFor we see that the name generated is something:
[0].FruitName
[1].FruitName
[2].FruitName
How do I handle this index part when making a Jquery Ajax request so that I always get the correct indexes and render it on client.
If anybody has any better solution than making ajax request then also please let me know. I need to handle the dynamic rendering of HTML controls and also access their values properly when posted back to server.
Take a look at Non-Sequential Indices at http://haacked.com/archive/2008/10/23/model-binding-to-a-list.aspx.
He introduced a helper method to generate it as well.
Also, I think you can just pass an index with your ajax call which then gets passed from Controller to your partial view and use it to generate a proper indexed TextBox.
Update:
I've asked a very similar question at Submit javascript dynamically added elements to controller method like Stackoverflow

c# MVC3 Binding IEnumerable Model to table

I'm working on a university project and trying to learn MVC3 at the same time. I have a shopping basket style page with a table that shows the items. The model contains a list of products purchased.
I can display the products in a table via looping through the Model and displaying, however I need to implement a way to update the quantities. I currently have the quantities displayed in a HTML.TextBox which can be amended, but when I change the value it's not represented as such in the model.
Could somebody please advise how I could do this.
Thanks.
To update the model, you have post the edited values back to the server. To populate the model values in a text box, you can use the Html.EditorFor extension method and Pass in the lambda expression pointing to the quantity property. You can put the shopping cart controls within an HTML form control with an action of "post" and target of the controller route which will update the model. These are very basic operations in Asp.Net MVC, and you should be able to see how it is done in www.asp.net/MVC
Please do some research before posting your questions in the forum.

MVC3 nested partial views submitt. how does it work?

I have started working with mvc3 pattern and am facing a problem.
The problem statement is some what as follows:
I have a partial view lets say MasterPartial which renders some content and is bound with a model named MasterPartialModel which contains all necessary data to display on that partial view. The MasterPartialView has nested partial views uptill n level and the nested child partial view that renders on demand within the MasterPartialView is bound with ChildPartialView.
Further more, the MasterPartial view has the form tag. Now my question is upon submit which model would i be receiving and upto my understanding it would be the model of the view which has the form declared within it. How would I know if a user makes a change in the data rendered by one of the childviews. How would I get models of the child view which were rendered on demand by the user, or simply how do we cater for this kind of a problem in MVC3 pattern?
Fixed the issue by working around the problem and by using jquery to go through all the loaded partial views. Collected all the values required filled an array of the type of a model and sent that array of models to the controller method for processing. :) jquery i awesome specially if coupled with mvc...

Categories

Resources