I have an mvc app where I pass a list to a view. In a most click, I want to be able to render the next item in the last but am having trouble figuring out how to do that efficiently. My approach originally was to use an index i but I realized that one the page is rendered, accessing my model last at i will always leaf to the same result since that item in the list is rendered on page load and can't just be accessed dynamically. Any insight to an approach for this problem?
The model can't be accessed as it's only used on the server side.
There are a few ways of solving the problem, you can use Knockout.js or similar client side view model components, once the user click on the button just render then next item from the knockout model.
Or use AJAX to retrieve the next value from the back end and then render it to the screen.
Or generate the whole screen and just hide all items from the user and then display them once the user clicks the button
Related
This would save loads of time when testing a specfic section which is far down the form and the form is configured in a Wizard View.
I just wondered whether there is a querystring parameter or xpath setting to put in xforms-inspector which will save us endless clicks on the Next button! So far the best way I have found is to disable the Wizard View so that the form shows vertically.
This isn't currently supported, but it sounds like a worthwhile feature to have, and I've created an RFE for this feature.
I don't understand why you have to click next all the time, you should be able to just click on the section name in the table of contents.
Looked many things up, but never posted before. Here's my situation. Any help would be most appreciated.
I've got a wizard with numerous screens with an associated navigation bar made using CSS. As users click from screen to screen, the navigation reflects the current wizard page the user is on. Each screen has different inputs to be collected. Database reads and writes are required during the render and submission of each page.
Here's the catch. Not every page is required. Only required pages are displayed in the navigation and the required information is stored in the database.
My goal is to reduce the number of database queries by dividing the navigation and remaining input into two separate partials. This way I don't have to render the navigation between each screen eliminating the single query every time between screens.
How would I submit the form of the current screen, render the partial view of the next screen, and yet update the query string to reflect the current partial view as well? This way if the user refreshes the page, they get the current screen.
Sounds like pre-optimization. How do you know you're going to have a problem with your navigation because of the database?
Why not separate out your navigation and output cache it?
If you bound determined to change the url without changing the content you need to use History API and if you need a fall back for browsers that don't support that you can use history.js.
I have a table that displays data for the items selected in the checkbox above, like a[], b[], c[]. Initially, when the page is first loaded, the table display is empty. When checkbox selections are made, the tables displays the data for the selection. Then when I untick all checkboxs and press display, the table display should be empty.
In the controller the variable for checkbox selection is thus>
#selected_brands = params[:brands] || session[:brands] || {}
as you may realize, params[], and session[] are values submitted by form in the view. {} -> when no checkboxes are selected.
Again in controller, I have this
#products = Product.find_all_by_brand(#selected_brands.keys)
The problem I have is, when I have unchecked the boxes, following the previous selections I made, the table displays data from previous session, instead of an empty table. What am I not doing?
You run into a HTML issue bugging lots of people: when you uncheck all checkboxes, nothing is sent to the server, and thus no change is recorded, so the last situation is still recorded.
There are many solutions to this (events, javascript, serverside code), so my advise is to broaden your search to generic html how to handle this situation best.
If you don't like Javascript, and have no problem with too many db-actions, remove all selected brands for the product and reapply the chosen ones when you get this result.
I've got a big ViewModel for a ContactViewModel with several addresses (default, invoice, delivery). This ContactViewModel I would like to edit within a DefaultAddress tab, etc. and I would like to know how to handle this without JavaScript? Is this possible?
Tell me if I'm off base here;
The way i think i'd approach this is to create a partial view which takes a list. the partial view would itterate through the list and create another partial view which is the tab.
on click of the tab i'd do a postback and store the clicked tab. this id then becomes the active tab.
when i come back to rebuild my page, the partialview for the actual tab would need to check to see if it's active and then make itself visible. if not visible then simply render nothing maybe.
This can be done with CSS. Here is an example: http://www.alistapart.com/articles/slidingdoors/
The selected tab/view will need to be rendered on the server. I can see each tab being a link, when the link is clicked the correct view and selected tab is returned.
Some of the css tabs don't work correctly in IE6. I'm not sure if the above link is one of them.
As an example, I have a table of items with edit buttons on each item:
I want to populate an edit form in a bootstrap modal as quickly, efficiently and as easily as possible.
Currently, I have tried populating via Javascript into a partial but this is a bit bulky and doesn't suit my needs when there are specific functions, varying inputs and different ways to input data. In some of my tables, the editing functions require 500+ lines of Javascript to calculate and process a bunch of different situations.
I've also tried generating a new modal partial for each item with partial Models but in larger tables with 1000+ items, this tends to lag the page quite a bit or take a significant time to load.
I need a way to quickly populate a modal with as little code as possible. Hopefully, I'd like a globalised way to do this for any given Model.
I also need the ability to populate the form action to do a variety of different things depending on the item.
I've heard that Ajax is a possible way to do this, but as I am relatively new to web development, I am not 100% sure how to do this.
What would be incredibly useful and would solve all my issues, is a way to render the modal AFTER loading of the page and on the input of an edit button.
So page renders -> you click edit on a given item -> it then renders the edit modal. Although I don't think this is possible.
This is just an example modal form:
Thanks
Currently, I have tried populating via Javascript into a partial but this is a bit bulky and doesn't suit my needs when there are specific functions, varying inputs and different ways to input data.
I've also tried generating a new modal partial for each item with partial Models
To display editing record in popup modal, we can achieve it either with JavaScript completely or mix using partial view.
If you do not want to generate/populate popup modal for editing row via 100% JavaScript client code, you can try:
1) when you click on edit button, make ajax request to controller action that accepts parameter Id of selected item
2) in that action, you can retrieve detailed and expected information of the item you want to edit based on Id, and the action would return a partial view
3) in partial view, you can render expected input fields based on your retrieved item information
4) in ajax success callback function, dynamically populate body of popup modal with returned data
Besides, this thread discussed rendering partial view as modal popup, you can refer to it.