Retaining Tab controls data in MVC 2 - asp.net-mvc-2

I have a multiple tabs and I am calling an ascx file for each tab, I have some control and submit button for each ascx file. Now I when ever I enter the data in first tab and switch to second tab and enter some data and click on submit then the first tab data is also getting empty.
I want to keep the data for the first tab or when I enter data on the firrst tab and click submit then what ever the data is there in other tabs must be there.
Can any one some source how to resolve this problem.

MVC2 has no "viewstate" like web.forms does. That means if it's not on the screen in some way, you must store it in session to persist it. I wouldn't recomend using session as you can tie youreself in knots in some situations, but can be appropriate for some things.
You basically have 2 options left if you don't want to use session:
1 - Show your tabs all on 1 page and then show/hide them using jquery to the client
For example:
Tab 1
Tab 2
Tab 3
<div id="tabcontents1" class="tabcont">
...
</div>
<div id="tabcontents2" class="tabcont">
...
</div>
<div id="tabcontents3" class="tabcont">
...
</div>
Then use JQuery or javascript to hide them on load and show them on click. For example:
$(document).ready(function () {
$(".tabcont").hide();
});
function showTab(tab) {
$(".tabcont").hide();
$("#"+tab).show();
}
OR
2 - Put any data you want to persist in hidden inputs on your form. If you only have a small model, this can be the easiest approach.
NOTE: This rule is a HTML rule, not an MVC rule. Webforms just "fakes" persistance with ViewState and MVC is more honest about how you deal with http.

Related

rails 3 - Add a Button that won't submit a form

I am trying to add a few "next" and "back" buttons to a form. The Idea is to divide the filling-out process into several steps and with these buttons, the div of the current step gets hidden and the next resp. previous step is displayed.
My Problem is that when I add buttons in the following way...
<button class="proceed_button" id="loan_information">Proceed</button>
<button class="cancel_button" id="loan_information">Cancel</button>
... they submit the form.
Is every button inside a form-tag considered to be a submit-button?
If so, how can I change this behavior?
If not, why are they doing it then?
Ok, the solution is that the button needs a type.
<button type="button" class="proceed_button" id="loan_information">Proceed</button>
<button type="button" class="cancel_button" id="loan_information">Cancel</button>
Like this, it won't submit the form anymore.
According to http://w3schools.com/html5/att_button_type.asp the default type is depending on the browser, so you should always specify the type.
I'm not sure that you want a button, maybe you want it to look like a button. Either way, refer to this post: rails 3: display link as button?
Once you have your button, you'll need to update your javascript to prevent anything from happening when it's clicked (assuming you have jquery). It's still nice to provide a real fallback for those dinosaurs without js, so assuming your proceed button submits for users without js, for those with js you'd do something like:
$('#proceed_button').click(function(e) { e.preventDefault(); // Show and hide your divs here });
Also note that in your posted code you should not have two buttons with the same id, your ids and classes look swapped.

Tab in Zend Framework?

I am making a social website that each user can view his own or other user's profile. I created a user controller to handle the identity and blog, status, profile controller to retrieve information. My question is how can I make the three sub controllers ( blog, status, profile) under the user controller, like a tab view?
If you want to have Tabs in your application you should pick first an ajax framework to create andload content into them:
Assuming you are willing to use jquery:
Tabs supports loading tab content via Ajax in an unobtrusive manner.
The HTML you need is slightly different from the one that is used for static tabs: A list of links pointing to existing resources (from where the content gets loaded) and no additional containers at all (unobtrusive!). The containers' markup is going to be created on the fly:
<div id="example">
<ul>
<li><span>USER</span></li>
<li><span>his blogs</span></li>
<li><span>Whatever</span></li>
</ul>
</div>
For more info: http://jqueryui.com/demos/tabs/#Events
And the tab content will be loaded through those "controllers" which are in fact generating view scripts.
To disable the layout on your views which should be integrated inside the Tabs-panels, if the mode is simple, you can add in ZF1
$this->_helper->layout()->disableLayout();

nyroModal v2: How to validate form opened in iframe?

I'm trying to figure out how to validate a form opened using nyroModal.
The page is being opened as below on click of a button:
$(function() {
$('.btnedit').click(function() {
$.nmManual('form_page.php);
});
});
On the form that opens up, I have a few fields that are mandatory and a cancel & submit button.
<a class="nyroModalClose button" href="#" id="btn_submit">Submit</a>
On clicking of the submit button, I want to make sure the mandatory fields have value. If no, an error message should be displayed & the modal window should not close.
I'm trying to use the jquery validation plugin, but without success. The modal window always closes irrespective of the validation scripts.
I haven't found much info regarding form validation in a modal window. Is this not a preferred approach?
Thanks in advance.
I'm not able to help you about the jquery validation plugin in a modal window, but I know that using the instruction $.nmManual in that way, the form will not be placed inside the iframe tag, and if I remember correctly the content of new page will be added without header and body tags, so in a word incorrectly. I guess this can produce no validation.
To successfully open an iframe you need to use filters as described here:
Open iframe manually in nyroModal?
I hope this can help you.

Menu State - ASP.Net MVC

In my ASP.Net MVC View, I have a menu. The menu consists of a number of Parent Items, with Child Items (anchor tags) underneath.
I'm using JQuery to toggle the menu items opened and closed, as the user clicks on them.
Unfortunately, once the user clicks onto an anchor tag, and gets sent to another page, the menu state is lost, and the menus go back to being closed.
Now if this was "normal" ASP.Net I'd be sticking the menu state information into the ViewState, and storing the information that way.
Is it possible to do something similar in MVC?? This is the first MVC project that I've worked on, so go gentle with me!
So let me first make sure I understand you correctly.
The user will click on a menuitem, which will take him to another page. And when he gets to that page you want the menu to reflect the fact that he is on that page? Correct?
This doesn't sound too tricky. I assume the menu is a partial view - so you would render it something like this:
<div id="menu">
<% Html.RenderPartial("Menu"); %>
</div>
So the view will already know which menu item triggered it. For example, if the user clicks on Widgets->New, you might return the NewWidget.aspx view, and it will know that the Menu item to highlight is Widgets->New. So you simply use the overload for RenderPartial to specify the name or id of the menu item to highlight.
<div id="menu">
<% Html.RenderPartial("Menu", "newWidgetLink"); %>
</div>
If it is NOT the case that a view already knows which Menu Item to highlight, you will need to pass the id of the menu item with the link. So your link generation will look something like this:
Html.ActionLink("Menu Item Text",
"Controller name goes here",
"Action name goes here",
new { menuItem = "menuItemId goes here" },
null
)
Then your action will need to handle this parameter. Easiest would be to take the parameter and add it to the ViewData. The Menu will then check in the ViewData for the Id of the MenuItem to highlight.
Maybe this: ASP.NET MVC - Is there a way to simulate a ViewState?
http://blog.maartenballiauw.be/post/2009/10/08/Leveraging-ASPNET-MVC-2-futures-ViewState.aspx
http://forums.asp.net/t/1285163.aspx
and this might help too
http://webcache.googleusercontent.com/search?q=cache:y26JBxHjbBUJ:www.beansoftware.com/ASP.NET-Tutorials/Intro-ASP.NET-MVC.aspx+how+does+mvc+save+view+state&cd=8&hl=en&ct=clnk&gl=us
There are a lot of articles about view states in MVC and since you're new to this perhaps some pre-reading would be handy and may even answer your upcoming questions!
Good luck!

One form two action

Hi i have a few form fields i want the on click of button a the control to be sent to action 1 but
on click of button 2 it has to be sent to action 2. Currently i am using js to change the form action dynamically on click. but is there any other solution. I cant do the checking after submit in a same method thet have to be two different methods.
The 2 buttons in this case are view(html data needs to be displayed) and download(same data as csv file). I am using cakephp 1.2 but i feel this is more of a generic problem
One form can only have one action. This is a limitation of HTML. To work around it on the client-side, you need Javascript.
It sounds like the better idea would be to give each submit button a distinctive name and value. This will be submitted like other form elements, so you can detect in the Controller which button was clicked. From there it should only be a matter of switching some View logic in the controller between normal output and download.
I found out there are few solutions
Regular JavaScript to change th form action on click of the buttons
AJAX to send the data to two separate actions on click of separate buttons
As suggested by deceze to do the processing on server side(which was not easily possible in my case)
HTML5 has a formaction attribute for this
<form action="/url" id="myForm">
<input type="submit" value="save1" formAction="/url1" />
<input type="submit" value="save2" formAction="/url2" />
</form>
Here is a fallback if you need it.
if (!('formAction' in document.createElement('input'))){
$('form').on('click', 'input[type=submit]', function (e) {
var attr = this.getAttribute('formAction');
if (attr) {
this.action = attr; //Set the form's action to formAction
}
});
}