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.
Related
[edit] It is a requirement that the webpage spawn and open in IE and allow user manual interaction after the programmatic actions have completed.[/edit]
I've seen a lot of code examples online about opening webpages or filling in webpage textboxes and getting a return value without ever opening them visibly.
I would like to open a webpage in IE, fill in a few textbox buttons
and then click the submit button and view the results visibly.
I am able to do this with a dll called Selenium, but I do not want to use a 3rd party application and it seems that WebBrowser() should be able to do this?
I can post my failed code examples if that would help.
Thanks.
Maybe this qould fit better as a comment, but I don't have enoigh reputation.
Do you know how HTTP-Forms work?
It would probably be easier to send a HTTP-Request to the target of the form you want to fill, including the parameters you would like to fill into the form.
So you don't need any WebBrowser or similar, just a simple HttpWebRequest object, where you specity the target, the method (very likely POST) and the data you'd like to send.
You can use the webbrowser control in Winforms. It is possible to access every DOM object of the website using the control. No need to open the IE externally.
You just need to specify the webbrowser URL as your link.
Then, fill the textboxes with code,
BrowserID.Document.GetElementById("TextboxID").SetAttribute("Value", "NewVaue")
Also, you can click on the button using InvokeMember("click").
There are lots of stuff using WebBrowser. You can learn it here.
I have an two divs in my web page i am able to show one div as modal popup using styles how is it possible to show the other dive as modalpopup to the existing one.
You can use the css z-index property to control the stack order of elements.
Also take a look at the JQuery plugin jqModal. Here are some examples. Specifically take a look at the Modal, Nested Modal section.
From their site:
jqModal is a plugin for jQuery to help you display notices, dialogs,
and modal windows in a web browser. It is flexible and tiny, akin to a
"Swiss Army Knife", and makes a great base as a general purpose
windowing framework.
Another JQuery plugin which may be of interest to you (if you create the modal dialogs yourself), is the BlockUI plugin.
I am using this jQuery context popup menu extension:
http://www.trendskitchens.co.nz/jquery/contextmenu/
This context menu is bound against an ASP.NET treeview adding a context menu to all items.
All contained within an update panel.
In order to select the item when right clicking, I am using JQuery to parse the postback from HREF that would normally fire when the tree item is being clicked, and using eval() against this HREF. This results in a post-back to IIS. Immediately after is my JQuery code for displaying the context menu. The context menu appears briefly however goes as soon as IIS returns the updated page data.
Just after some general advice on how people think is best to approach this. I can avoid this by making users LEFT click the tree node prior to right clicking it, but that just seems unintuitive.
Hey Sam, as far as I see it the whole idea is kind of wrong from the start, I am a .Net developer but I've always avoided introducing an update panel in my applications, if you look behind the curtains you will see that update panels insert a form tag within the application which kind'a runs at server, try to insert two forms with runat server attribute one within the other in a VS see what they say :). To be honest it's fairly easy to build a contextual menu with templates as layout; it's about 3 hour work and several others for testing.
Getting back to your issue. I see that you have two options here: either learn how to open the menu from javascript and retain the position inside a hidden field before postback(on click/open) and after the postback occurs reopen the menu at the desired position/components, either search for the code which actually does the post back and prevent it in your case. Could be a click and if so all you need is an ev.preventDefault(), could be a submit and then you would need to set up a variable and on submit return false or something like that. Can't really give you the actual code solution without seeing the page which has this "bad" behaviour, anyhow left clicking is, as you said, not intuitive and frankly not an option in this case.
I have tried in my MVC app to add jquery modal dialogs to prompt the user for input, but my code turned really sloppy just prompting the user for 1 field of information.
SharePoint 2010 has ajax overlays that are very functional, some even include the office ribbon.
How is this being done? What libraries can I use where I can open up entire forms as ajax overlays on top of a page?
Thanks so much!
If you want to show complete forms, use http://plugins.jquery.com/project/jquery-framedialog - I haven't tried it with standard SharePoint forms, but it should work if you set the return url to a page that will close the dialog.
If you just need a nicer looking javascript prompt, use the standard jQuery UI dialog and define the html for the form where you are using it.
With MVC you may find it easiest to post the form using ajax (there is a jquery method to serialize a form, though I don't recall the exact syntax) rather than posting the iframe - that gets you a callback structure that is a bit easier to work with if you are doing more complex stuff with the dialogs.
I was wondering if anyone knows of an existing sample or an approach to achieve the desired functionality.
Basically, what I'm looking for is a web browser like skeleton. The idea is that the main screen of my application is shown in the left tab. This tab can never be closed. On this screen is an overview of various application components such as activities, events, contacts, etc.
When the user clicks on a specific contact/event/activity a new tab is created and auto-focused. The user can view and edit the information. When they are done they can close the tab.
The ability to have multiple tabs open is important.
Also, keyboard shortcuts to easily navigate between tabs would be great, but not absolutely essential at this point.
Note: I don't need to access any web content.
Really what I'm looking for, at least what I think I'm looking for, is a shell of a modern web browser. Does something like this exist? Is there a good approach to building such an application?
Note: I'm new to Windows GUI development, so I apologize if this is a rudimentary question. I was unable to find anything meaningful while searching MSDN and other resources.
Thanks!
What it sounds like is not really a Web Browser shell at all, simply the relative appearance of one functionality-wise.
What you can do is use a TabControl control. This can be altered to suit your needs quite perfectly in my view.
An example of a modified TabControl is as follows: [ From here ]
There are a number of things that can be done with a TabControl (as with any other component) to make it suit what you need.
Here are some links that you may find helpful:
Flat Tab Control - As per the picture
MSDN
Video on using a Tab Control
C# Corner