I have self taught myself MVC and create little personal projects to learn, as my IT consultancy always puts me into roles where I don't get to use MVC.
One thing I am battling with is - When I display a view, I always display it in edit mode. So you can make changes and clicks Save, and the view is saved. However, I would prefer to enter the view in Read Only mode. So, instead of edit boxes, I want labels (read-only). When the user clicks an Edit button, without a post back (so, using the same screen), editable fields 'change' into edit boxes.
I'd prefer to have one view though. Not en edit view and a view view. To minimize coding effort.
This must be a pretty standard function. Can it be done using Bootstrap/MVC?
Related
I am new to ASP.Net MVC, and still trying to wrap my head around the controller and passing data to the view and back.
Here is my question. I have a model in my view with a property that is "isEnabled", which can be true or false.
I have an edit button, and an enable/disable button. Edit just takes me to a new view with a form.
I want the enable/disable button to change the property of the model to enabled or disabled.
Right now I have two separate buttons. When I click on them, it fires the appropriate action from the controller (EnableModel, DisableModel), and just reloads the current view.
How can I make it so, if the model is disabled the button shows and fires the enable action, and when it is enabled, the button shows and fires the disable action.
So here are the options I thought of.
1. Two buttons, I hide them as needed. I can use an if statement to check if the model is showing or not in razor.
2. Use javascript two to the above
3. Use javascript to physically change the button
What would be the best method?
Alright so looking back can't believe I ever even asked this haha.
I went the javascript route. I had a single button, and a simple onClick javascript class that would handle the toggling.
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.
We are starting a new ASP.NET MVC project and we would like to establish a pattern of development that will allow flexibility in the UI. The general idea is that we would like to develop a set of related controls as a unit (i.e. a set of inputs and a submit button) and maintain the flexibility to decide later 1 of 3 UI options
Have that set of controls with its submit button be alone on a web page, OR
Have the set of controls be together with other sets of controls on the same page, and each set has its own submit button, OR
Have the set of controls be together with other sets of controls on the same page, but there is only one submit button for the whole page
Is there any pattern or strategy of development that would allow us to develop with this flexibility?
I would create a Partial view for this scenario. Just lay out the form in your Partial view and drop it into whichever view you see fit.
Since the entire body is not wrapped in a form tag like WebForms, there is no limit to the number of forms you can use on a page as long as they're not nested.
This one is a bit tougher. Unlike WebForms where you could put controls all over the page and have a button click collect those you can't do that with MVC. Your options would be to make sure the inputs are within a form or use JavaScript to collect all the values and submit those.
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.