I'm an experience programmer who is writing his first asp.net application.
I needed a pop up calendar and didn't like the javascript based ones I found.
I wrote my own Web User Control thinking that would be best. (I still have some issues with it). I used a textbox, image button and the asp.net calendar control.
The control works reasonably well, but not being an HTML/ASP programmer when I placed it on my page, whenever I clicked the button to display the calendar, my page goes horribley misaligned. I placed it inside of a HTML table and that helps. But I was wanting to not worry about control alignment on the page.
Am I completely misunderstanding how a Web User Control would display for this time of calendar control?
Should I abandon my work and look for a Javascript solution? (But if it's a user control won't it do the same thing?
While this is a good item to learn with it certainly has been done, and done very well in many places.
Any server based calendar control is not your best option, it will lead to a postback anytime you are switching from month to month, which is less then ideal.
jQueryUI is a great/simple option to get a calendar control that will not mess up your other layout.
In the end if you still want to implement your control we will need to see some HTML/CSS as to why it is messing up your UI.
It's worth spending some time learning how jQuery UI and the datepicker() plugin work. I'm guessing by your original post that you are not too keen on a client side solution, but I rarely see a need for a server side calendar control.
Javascript/jQuery
<script type="text/javascript">
$(document).ready(function() {
$("#myTextBox").datepicker();
});
</script>
HTML
<script type="text/javascript" src="<jQuery URL GOES HERE>" />
<script type="text/javascript" src="<jQueryUI URL GOES HERE>" />
<input type="text" id="myTextBox />
Apologies if the syntax is a bit off... I dont have VS in front of me to test but hopefully it should give you an idea where to start :)
Related
I've read many posts on this site, as well as MSDN, but can't quite find the solution I'm looking for. Here is my situation: I have a page that allows users to "upload" a file. The page includes an asp.net fileUpload control. However, all it does is send the byte array to a WSE 2.0 web service. I can't change this. This may be updated in the future, but for now, this is what I have to go with.
The page has an animated gif that starts when the user clicks the submit button. And the page should be updated accordingly based on the result returned by the web service call. I'm able to start the gif and consume the WS successfully. However, while the page is hitting the web service, the gif file freezes.
I then tried to use a separate thread to consume the web service. This speeds up the process and does not freeze the gif, but the page is not updated when the web service completes. If I put the main thread to sleep, the page updates, but I'm back to the same issue mentioned above, where the gif freezes.
I'm pretty sure I could make the call using javascript and update the page that way, but at this point, I'd really rather do it server side (out of stubbornness if nothing else).
Can someone point me in the right direction? Thanks in advance.
This has happened to me as well. I've managed to fix this by wrapping the img tag inside a div and just showing / hiding the div via JavaScript using the setTimeout function. The GIF won't freeze this way.
Example:
<script type="text/javascript">
function showLoadingIco() {
setTimeout(showLoadingGif, 50);
}
function showLoadingGif() {
// Using jQuery
$('#myDiv').css('display', 'inline');
}
</script>
Note that your HTML code must look like this:
<div id="myDiv" style="display:none">
<img src="loading.gif" alt="Loading..." />
</div>
The Upload File control doesn't work well with Update Panels, so my guess is that you're running into a full postback, which is why the image stops spinning. If you're not using an Update Panel (or some other Ajax platform), you're almost definitely having a post back.
It's not too tough to pull off asynchronously with JQuery though. Check out this link for an example.
I am trying to use a checkbox that is dynamically declared in an .vb file that I am trying to write into my .aspx page. I am able to write a normal checkbox of <input type='checkbox /> from the .vb Class using Response.write, but it comes up blank when using <asp:Checkbox runat='server' />I need to pass whether or not the box is checked back to the server, because I am having to either approve something if one is checked, reject something if the other is checked or do nothing if neither are checked. I have figured out how to make them mutually exclusive either way so that is not the problem. Does anyone have any recommendations?
Your problem lies in the order that the pages are compiled in: When you place an asp control like the asp:checkbox, it is compiled into a regular checkbox with some javascript attached when it is sent over to the client.
When you write the string "<input type='checkbox />" to the page from the code-behind it is writing that string directly to the page, after the aspx page has compiled its controls, but since that is valid html the browser renders the control. When you write the asp:checkbox, the browser doesn't know what to do with it, because it is not valid html. In addition, the page has already been compiled, so there is no chance of .net creating the correct control for you.
You need to programmatic add the control to the webpage by creating a new control through the code behind
This site does a great job explaining it
And #toodles seems spot on. Writing static html and asp.net are two totally different ball games. I would spend a bit of time (like hours/days) reading/watching learning material to help you get on your feet.
The technical answers you are getting are all good. However, your question indicates that you really need to start by learning how asp.net server controls work. I suggest spending a couple hours watching the videos at http://asp.net and particularly http://www.asp.net/general/videos/intro-to-aspnet-controls
Then focus on understanding the page lifecycle and you'll have enough of the basics to be much more effective at asp.net. Have fun!
You can't use response.write to create server controls.
See this site for an example of the right way to do it:
http://msdn.microsoft.com/en-us/library/kyt0fzt1.aspx
I have a modal pop extender that has a user control in it, I use it in several forms in a
ASP.NET 4.0 project.
I am not very happy with the js code that it produces and the mess in the markup :/
So, any worthy alternatives that can be controlled from the codebehind easily :) ?
Having been down the road of Ajax Control Toolkit, I would recommend moving on to jQuery or some other javascript framework. While I understand the desire to "control it from codebehind," because it seems easier at first, trying to wrap client-side functionality in a server-side control usually is more trouble than it's worth.
Even in the simplest case, the the amount of javascript code needed to create a modal popup in jQuery (e.g.) is less than with Ajax Control Toolkit MPE. For example, I like the jQuery plugin SimpleModal. The code to turn a div into a modal popup using SimpleModal with default options is this:
<script type="text/javascript">
function showPopup() {
$('#<%=popupDivID.ClientID %>').modal({ appendTo: '#aspnetForm' });
}
</script>
Then you can just add that function to a click event, for example. And it's about a thousand times more flexible.
If you just don't like embedding javascript in your markup files, you can still technically control this all from codebehind by using ScriptManager to register the scripts and add events to controls.
Have you looked at the Ajax Control Toolkit on CodePlex. Ajax Control Toolkit It has several very useful controls that are very easy to implement. The toolkit includes a modal popup control as well as a popup control. In the link I gave you are all the instruction on how to download and use the toolkit.
Another option if you have access to it is Telerik controls. Their Ajax controls include what they call a radWindow which also works very well. You can read about it here. The drawback to Telerik is it is quite expensive.
I have used both and they work very well.
Use jQuery Dialog UI as this would likely give you the best supported option. It supports modal behavior.
I'm working on a long, dynamic form (100 or so fields) and am using toolkit items such as CalendarBehaviors, HovermenuBehavior, etc for each field.
I've never worked with that many toolkit items at once, and am seeing a big performance hit in rendering. Every instance of a toolkit control is being sent to the client in its' own <SCRIPT></SCRIPT> tags. In other words, 200 instances of he following:
<SCRIPT type="text/javascript">
Sys.Application.add_init(function() { $create(AjaxControlToolkit.HoverMenuBehavior, {"OffsetX":20,"PopDelay":50,"dynamicServicePath":"/default.aspx","id":"hmePopupHelpPolicyNumber","popupElement":$get("lblHelpPolicyNumber")}, null, null, $get("imgHelpPolicyNumber"));});
</SCRIPT>
<SCRIPT type="text/javascript">
...snip
</SCRIPT>
Is there any way to control this and have all the controls created in a single script block?
Also, does anybody know of a good, detailed article that would describe how IE 7 parses and renders html and javascript?
And I know most of you will recommend JQuery instead. Unfortunately that is not an option in this project.
Thanks in advance and happy coding.
I'd say rethink your design of the page. That many items on your page can't make for a good user experience. Instead of coding a really far out solution, reconsider your design and it will probably benefit your user in the end as well.
Edit:
Your question is at the heart of what many consider the major drawback to using WebForms. There is little control on how the server renders the controls and emits their HTML. Without a more "advanced" approach which you are trying to avoid, I'd be hard pressed to suggest anything other than breaking the form up into smaller pieces. If it is a data entry form, it may be faster for the user to type in the date fields as opposed to populating the form via mouse clicks.
Going along the lines of #Achilles' answer, I would break up the form into multiple pages. You could also try one page with multiple tabs.
Update:
Something else that might help you is the ToolkitScriptManager. It combines all of the external toolkit scripts into one single external script. I think it also combines all of the inline toolkit scripts into one block.
Is there a best practice when it comes to setting client side "onclick" events when using ASP.Net controls? Simply adding the onclick attribute results in a Visual Studio warning that onclick is not a valid attribute of that control. Adding it during the Page_Load event through codebehind works, but is less clear than I'd like.
Are these the only two choices? Is there a right way to do this that I'm missing?
Thanks!
Eric Sipple
**just a pre-note on the answer: HTML validation in VS is often BS. It complains about stuff that works IRL, even if that stuff is bad practice. But sometimes you gotta bend the rules to get stuff done.
Every ASP.NET page (2.0 and greater) comes with a ClientScriptManager. You use this to register javascript from server side code. You can pass in javascript that registers events on controls after the page has loaded, when the HTML controls on the page are all present in the DOM.
It presents a single, unified place on pages to dynamically add javascript, which isn't a bad thing. It is, however, awfully ugly.
In this time of the death of the ASP.NET server control model, you might want to set events the way they will be in the future of ASP.NET MVC. Grab a copy of jQuery and add it to your website. You can then easily register your events thusly:
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("controlId").bind("click", function(e) { /* do your best here! */ });
});
</script>
</head>
<!-- etc -->
</html>
You can add the events through Javascript to the HTML elements that you want. This is the cleanest way, since it doesn't mix the server&client technologies. Furthermore, this way many handlers can be registered to the same event (in contrast to the onclick attribute).
Basically, the code would be
document.getElementById('myLovelyButtonId').attachEvent('onclick',doSomething)
for Internet Explorer and
document.getElementById('myLovelyButtonId').addEventListener('click',doSomething,false)
for other browsers. (doSomething is an event handler - JavaScript function). These calls should be made in the window load event handler
Consider reading the advanced event registration article on Quirksmode for further info.
Also, consider using a library like jQuery. This way, the statement will become
$('#myLovelyButtonId').click(
function doSomething () {
alert('my lovely code here');
});
Setting the value for WebControl.Attributes["onclick"] is okay. If ASP.NET needs a client-side click handler, it will concatenate the values, delimited by semi-colon.
Fix grammatical or spelling errors.
Clarify meaning without changing it.
Correct minor mistakes.
Add related resources or links.
Always respect the original author.