I have a table of data. I would like the user to be able to select a row and view the details in a jquery modal dialog.
I have this working fine. Based on permissions, the user may be able to edit the data in the modal. In this case, I would like to present a button to switch to "edit" mode.
Would it make sense for this button to load a new partial Edit view into the modal? or should I just combine the Read-only and Edit forms into a single view thats loaded intially and use javascript/css to hide the Edit Form until needed?
I think it's more of a design question as long as you don't send the Edit Form to the client side and only hide in case when the user doesn't have the permission to edit it.
Otherwise you'll be better of discussing this with the stakeholders.
In my personal opinion, I simply hate Modals. They just tend to be very overwhelming but that's just me :)
Why would you waste network traffic by downloading both views together? I would use separate ajax call to download edit form.
1. If your edit form is large in html size, you would waste traffic when downloading together (User may never press the edit button)
2. If edit form is relatively small, switching to it via ajax downloading would be almost transparent to user - no extra timing, no extra traffic waste
Related
I want to pass data directly from one view to another in the two following situations:
Our users are allowed to dock and undock a toolbar that is persistent thoughout our application. I want this state to be saved when the user navigates to another page. The toolbar is docked and undocked using jQuery.
In some cases, after a successful response from an AJAX call we have a full page refresh or a redirect. We want to display a notification to the user after the refresh / redirect (eg. Your action was successful).
My initial thought was to use cookies, specifically using jquery-cookie, but I was then wondering about using the Session[] variable. Given that our JavaScript will be in an external file I don't know if this is possible and if so does it simply complicate the issue?
Have you looked at Lawnchair?
http://brian.io/lawnchair/
Sounds pretty much like what you need. It is used to persist client side data across pages.
My application required me to store many data elements across views an sessions. Rather than pick a storage mechanism up front (mostly because management couldn't decide) I coded my app using persistence.js.
I was able to pick the precise storage mechanism later with minimal impact to my code.
I faced same type of problem.
after workaround I use a jQuery cookie and store the hidden panel id.
and check the cookie in $(document).ready(function(){}); of jQuery that which panels are hidden and after make their display:none.So after postback the cookies are persist and the panels became hidden.
It solved my problem.
You can do this by simply sending your toolbar state information through hidden fields back and forth ( means from MVC view to controller and than from controller to MVC view ).
I'm edited my question,
I have a submit button and textbox in Default.aspx page. I'm open two window Default.aspx. I want to input text into textbox and press submit in this window, other window will update textbox real time.
Please help me !
What you are looking for is similar to chat application.
On receiving a value from one client(browser window), you want to send it to another.
Take a look at SignalR is a good option to keep push data to connected clients.
However if you do want to do it yourself for some reason, the most efficient method to build this in asp.net is to use a IHttpAsyncHandler and ajax requests.
Here is a complete working project that implements this, along with ajax.
Whenever the "Reserve" button is clicked in my web application (ASP.NET with C#, Visual Studio), a small window should pop up containing detailed options to choose from (drop down lists with values, comboboxes, etc), with a "Next" link, and "Finish", in the end. Changing the values in these controls should update tables I have in the database (Microsoft Sql Server).
Could you point me towards a detailed and useful resource/example of this? I am already using a book for inspiration (Cristian Darie) written in the form of steps / explanations, but scenarios as just described are not included. What should I be looking for? "Using Pop up windows with Visual Studio"? Is what I described known as a popup window?
I don't know JavaScript, is that needed here? Been practising lately a lot with classes, methods, stored procedures, masters, user control type files, handling db tables through Visual Studio classes and methods, etc but still new to these (a month old basically). Thanks a lot!
it's not necessary to use JavaScript, but if you want anything a bit more fancy than just a regular popup window, javascript will be a good friend to you. As I see it it's basically four main ways of doing it:
1
Create a new ASPX file with the "details", send a querystring to the url of the details view in order to connect the popup with the data from the main window. a key to this is the "target" property of the html "a" tag. For example:
Details
2
Create a popup window with some custom properties (i.e toolbars window size of popup etc) using regular javascript. Look for window.open in javascript.
Example:
Details
3
Using jQuery to open the popup in a modal dialog fashion using a lightbox. For this alternative I don't have any example, but google jQuery lightbox, there are heaps of them. Use that with an AJAX-call and achieve your goals.
4
And at last, use ASP.NET AJAX Control Toolkit (look here:
http://www.asp.net/ajaxlibrary/act.ashx) Download and install, use the ModalPopupExtender (tutorial here: http://www.asp.net/ajaxlibrary/act_ModalPopup.ashx) from the toolkit, in which case you design your "details" view in a <asp:Panel> control and then using CSS and the ModalPopupExtender to display and hide the details, the looks will be like the lightbox but you don't have to create a separate ASPX page for this option, but you can use the same ASPX.
I've worked alot with all four options, and i tend to like the 4th alternative the best, but we all have our own taste.
Good luck, and feel free to ask away for more detailed information. :)
let's take this step by step. In order to send that information, I think the
easiest way would be to store the parameters as session variables and then reload them
when the popup is closed, you can reload the parent window using the "onunload" event in
Javascript, for example
<body onunload="window.opener.location.reload(true);">
This would in
itself reload the parent window whenever the user closes the popup. IF you want it to close
when the user saves changes (and your session variables are set), use this code in order to reload
the parent window and close the popup. Put this code in the code behind, just before the
end of your method that saves the data:
Page.ClientScript.RegisterStartUpScript(this.GetType(),"close","<script language=javascript>window.opener.location.reload(true);self.close();</script>");
To learn javascript, have a look at codeproject.com, they have a lot of articles regarding
javascript (among other things), often with example code. :)
I made a quick example here: http://www.4shared.com/zip/LPtR1gbx/pop.html
I would recomment using a <div> element rather than an actual new browser window.
It eliminates the need to pass the contextual information from the pop-up window back to the original window along with all the complexities involved with it (including things like the user inadvertently clicking off the pop-up window, clicking multiple times and thus bringing up multiple copies of the pop-up window, and so forth).
By using a <div> that "pops up", via controlled visibility through CSS or JavaScript, the entire context is kept to the same web page, making life so much easier overall.
I have a simple three page asp.net webforms site and having an issue with the back browser button that throws the popup "...Firefox must send any information that will repeat any action.." when hitting back on the step3.aspx.
The flow is: user lands on step1.aspx, session starts, and a user quotes on a product and gets redirected to step2.aspx. On step2.aspx, you confirm the purchase by clicking an asp:Button. The OnClick event handler, btnPurchase_Click, handles the logic for purchase and redirects, Response.Redirect("step3.aspx"), to step3.aspx. Step3.aspx simply displays the confirmation page (receipt details). The session is destroyed on step3 and when the user hits the back browser button, they are prompted with the resubmit post popup. Ideally, I want the user to hit step1 on hitting back without the resubmit prompt. Each page is set to no-cache and redirects to step1 if session is invalid.
Does anyone have a suggestion for a better flow?
This site will eventually be migrated to asp.net mvc/ajax which will most likely make the PRG workflow easier to implement but for now, looking for a relatively simple way.
A simple solution is to never allow a page to render on postback, but instead accept/store whatever information it was posted, and then redirect to the next page (or itself).
That way if a user hits the back button, it is going back to a GET, not a POST, and avoids the popup.
I give this question a try. The flow you mention will obstruct the pages normal function, which you of course already have in mind. Though, i would say it can be dangerous (against the function you expect) and contraproductive. Based on what I can see from your question, I would definitively remove Page2 and Page3 and keep all logic in same and single page.
I would also be happy to hear what you are trying to avoid, with this? Is it double posts? Like a double-post of a content in a shopping cart? Partial / uncomplete inserts of data input? With the described way to affect back-buttons, you may come around one problem but rise another. A big range of browsers that can act completely different on such work-arounds.
I see two good options,
UserControl,
Create three UserControls which every each of them have each page specific logic. You can programmatically load them into the page. I.e. on bnButton_Click Event. Usercontrols are loaded with LoadControl("PathToAscxFileOnDisk.ascx").
Panels,
I would also think about three <asp:PlaceHolder></asp:PlaceHolder> or perhaps better <asp:Panel></asp:Panel> to put all logic into.
In this case you are completely free from the postback issues and can focus on moving your functions into business logic and have use the Code-File to control the flow on show/hide and populate the controls in/out from the panels/usercontrols. You can probably also control the postback / click-URL & push-enter-key.
And you mentioned Ajax,
Ajax is absolutely there to make your page stateless (which means you can work without cache, sessions, viewstate and so on. Though, the problem lies in the users possibility to navigate between pages. I would think even Ajax is of less help, while you keep the three-pages-solution.
I would personally say it is a simple task to move the aspx files into each ascx and create a aspx as a master-container. With that option you even avoid duplicate namings (like if you copy / paste the code into panels) and trouble with Page_Load flow/logic.
If I understand correctly you're not yet using the PRG.
On step 2, temporarily store the information and redirect to show it. How you do so depends a lot on your application: session, database, cookies, etc are all options with different caracteristics.
Then redirect to show that information.
Same goes on step 3.
If you hit back on step 3, you'll go to step 2. But given you're going back to a GET request, there won't be a warning. Like you said, your application destroys the session data on 3, so according to what you said the user would go to step3.
Maybe I'm missing something on what you said.
I'm creating a multi-part web form in ASP.NET that uses Panels for the different steps, making only the Panel for the current step visible. On Step 1, I have a drop-down list that uses a Javascript function to reconfigure some of the fields in the same Panel via "onchange". Obviously, since the client-side script is only affecting the DOM, when I go to Step 2 and then back up to Step 1, the fields in Step 1 are back to their orignal configuration even though the same drop-down choice is selected.
What is a good method for storing the visual state of the Panels between steps? I considered calling the drop-down's onchange function on page load, but that seemed clunky. Thanks!
--
Thanks for the quick answers - I think I'll try out the Wizard, but the AJAX solution also sounds like fun.
You might consider an ASP.Net Wizard control for this- it will automate a lot of what you're trying to do.
I suggest you to use the MultiView control, which is let's say semantically more appropiate. And then store this data in ViewState. I have written something similar and it rocks.
I think your best bet is to maintain all of your state in one place, or don't maintain any state at all. The main problem you're having is synchronizing your client-side state with your server-side state.
Try showing/hiding your panels with javascript instead of posting back, if possible. If not, use some ajax to update values on the server-side as soon as they are selected, rather than when you click the next/previous button.
Otherwise, you could use something like ASP.Net Ajax Toolkit Tabs to help with transitions.
Hope that helps!