MVC question - hide /show a panel with partial postback from radiobutton submit - asp.net-mvc

I have 2 radio button with values New & Existing. If user chooses New, then I show a textbox on the form and if Existing a dropdown and textbox is hidden. The question is , does the hide/show of the textbox/dropdownlist have to be written in the View or the Controller class? Also when I choose the selection my whole form is posting back and hence all validation error msgs are being shown which should not be shown nless the save button is clicked, how do I a partial postback without full form submission? Any code snippets or urls would be benificial in this respect.

The question is , does the hide/show of the textbox/dropdownlist have to be written in the View or the Controller class?
Just show/hide with jQuery that.
Also when I choose the selection my whole form is posting back and hence all validation error msgs are being shown which should not be shown nless the save button is clicked, how do I a partial postback without full form submission? Any code snippets or urls would be benificial in this respect.
Perform 'partial postbacks' through javascript.
Post form to save action only once when it's ready (when Save button is clicked).
Some resources:
jQuery tutorial
jQuery AJAX
About form AJAX`ifying

If I understand you correctly, the answer is the hiding and showing of controls should be done on the view as it's display specific.
If you use javascript to show and hide the controls then because it's on the client side you would not have to postback the form, and could do server side validation when the save button is clicked.
jQuery is very good: Jquery Website
Hope that helps?

Related

How to have one button do both "enable" and "disable" in ASP.net MVC

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.

Disable form fields and enable them after clicking on edit button

I have a form fields in which I am displaying data.
The values should be disabled and edit button should appear, after clicking on Edit button, the values should be enabled and user can edit the data and only save button should appear
How to achieve these two requirements in a single form in Asp.Net MVC4?
Use templates.
An ITEM TEMPLATE and then an EDIT TEMPLATE.
When the user presses the EDIT button, set the action to change to mode of the form to EDIT.

Angular/Bootstrap ui modal dialog with a form issue

I have an Angular JS app with a bootstrap ui modal dialogue hosting a simple edit form.
The form can be for a new "thing" or a populated "thing".
I find that when I cancel out of the modal with the form populated, submit is being called.
Any help appreciated.
Plunkr here... http://plnkr.co/edit/XhQCqlGUfcmQOhqLDeXR?p=preview
I forked your plunk and got it working here: http://plnkr.co/edit/jgg5pDQOH46XgrbW3Mvh?p=preview I think the cancel button was participating in the form submit event since it was inside the form element. Moving it outside of the form seems to have fixed the problem. I also set up the submit event to fire the modalInstance close event and the cancel event to fire the modalInstance dismiss event. This gives you the opportunity to handle things appropriately in the parent controller (ModalDemoCtrl).
EDIT
You could also stop the click event from propagating in the cancel event and still use the save as an input element inside the form tag. See this plunk for example: http://plnkr.co/edit/A81KkUUQEL3IBbOSnHQb?p=preview
I was having a similar problem. My problem was that when I clicked in the button to open the modal, my form was submited. I was using a "button" html tag, without specifying the "type" attribute. So, I found your problem and I went to the W3C documentation. I found that:
Tip: Always specify the type attribute for a button element. Different browsers use different default types for the button element. (http://www.w3schools.com/tags/tag_button.asp)
I wasn't defining the type of my button, so the default type of my browser was submit. I defined the type to "button" and everything is ok now.

How to overlay a jQuery UI Dialog over a Skillbuilders modal page?

I am using the SkillBuilders Modal Page within my Oracle APEX application, i.e.
SkillBuilders Modal Page
to present the user with a tabular form, where they can enter specific values via select lists.
What I also have is validation based on another thread that I raised in Stackoverflow:
How to perform row by row validation on an Oracle APEX Tabular form using Ajax?
The problem that I am having is within my SkillBuilders Modal Page, I have some validation by where I want to make a call to jQueryUI dialog, in order to present the user a message. I do this by calling:
$('#dialogbox').dialog('open');
Unfortunately it doesn't actually seem to appear on screen and I believe it's something to do with the fact that I am trying to overlay a modal dialog over a modal page (skillbuilders modal plugin).
How can I solve this problem?

binding fields in a dialog popup in my view

i have an html table in my asp.net mvc view an i am running into some real estate issues with screen space.
I think in one area of my view i am going to have a button in a column of an html table that says "Details" which, when clicked, loads up some dialog ui. what i am trying to get my head around is that i want the fields in the dialog to also be part of data binding object in the overall form which i am passing to the controller when i submit the form.
is there anything that i should be worried about or anything that you need to do special if you have a form where inside your form you have a button that create a popup with some more details elements. I am just trying to see from a data binding view if there are any issues.
also any examples of doing anything similar would be great.
EDIT
So i tried doing this an ran into a binding issue. i have a follow up question with the specifics about this binding issue with jquery ui dialog here:
why does jquery ui dialog break asp.net mvc's default model binding .
There shouldn't be any issues if you are binding elements from your popup dialog to corresponding hidden elements in your main view. These hidden elements will bind correctly like any other control in your main form.
Of course, you might be POSTing the form elements from your popup form to its own controller method directly, and that is also a perfectly good approach.

Resources