is there any component or control exist for asp.net application that load jquery ui scripts and themes?
thanks.
Depend on this sample Can Any body help me and introducing component or control ? :)
hmm - couldn't you just have them included in your masterpage and then they'd be on every page referenced (by that master) on the site??
this is how i'd do it if you wanted to keep it simple. if you're looking for a control to do this, then you could of course create a usercontrol and place that in the head section of your masterpage to effectively do the same thing.
that said, maybe i've missed something here :)
There aren't that I'm aware of...though it wouldn't be too hard to fashion. Do you need one though? Using the Google cdn for example, all you need is this in your master page:
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js" type="text/javascript"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
As of a few weeks ago (Sep 17, 2010) Microsoft also hosts jQuery UI:
<script src="http://ajax.microsoft.com/ajax/jquery.ui/1.8.5/jquery-ui.js" type="text/javascript"></script>
<link href="http://ajax.microsoft.com/ajax/jquery.ui/1.8.5/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
this sample source maybe useful :)
its created for jquery datepicker.
http://hasheminezhad.com/sites/default/files/hasheminezhad.com/JQControls-Source.zip
Related
Anyone have any experience on doing a popup date picker
with multilingual support, based on the culture itself automatically?
I do try to do it but I am failed to do it. Anyone have any resources that can do it? I am mainly doing for two languages which is en-US and zh-TW. Thanks.
You are not adding the Jquery and CSS reference, that's why you are not able to see the Jquery Calendar.
Try the below code:-
Jquery and CSS reference
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" />
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
Also, you must call the selectori.e ID for it to work
$(function () {
$("#datepicker").datepicker();
});
See the Working Demo
when i run a link server side like this:
<link runat="server" id="staticCss"
href="....css?v=0" media="all" rel="stylesheet" type="text/css" />
asp.net renders it with
<link runat="server" id="staticCss"
href="....css?v=0" media="all" rel="stylesheet" type="text/css" ><link>
and this fails the w3 validation
Stray end tag link.
becasuse link tag can't end with link but must end with /
How can i avoid it?
As far as I know, it can’t be avoided. These are the alternatives that you have:
Use a static link tag without the server processing, if you can
Ignore the validation error: browsers handle this markup well and you shouldn’t have any issues on your website
Use a .net literal to spit out the markup as text: this way you are in total control of the formatting
I have been struggling with .net generated html for a long time, it can be very frustrating. If anyone knows of other ways to solve this I would be very interested to learn.
I am implementing a web application using ASP.NET MVC3. In the application I want to add the option of switching between CSS files (for themes) based on clicking some links. I did some research and I came up with the following:
To pass data to site.master, the good solution is to create an abstract controller and inherit that into the other controllers that have site.master as their template, according to this article: Passing Data to View Master Pages
I can pass a viewbag message to the link which controls the css file URL to set the current css file to use, based on the code that I am seeing being passed to scripts at the top of the site.master page:
script src="<%: Url.Content("~/Scripts/jquery-1.5.1.min.js") %>" type="text/javascript"
So I created an abstract controller, ApplicationController, with the following method:
public ApplicationController()
{ViewBag.NewMessage = "../../Content/Site2.css";}
And in the site.master, I included this link:
<link href="<%: (string) ViewBag.NewMessage %>" rel="stylesheet" type="text/css" />
However, that doesn't seem to be working, as it is being interpreted as:
<link href="<%: (string) ViewBag.NewMessage %>" rel="stylesheet" type="text/css" />
And only when I remove the quotation marks:
<link href=<%: (string) ViewBag.NewMessage %> rel="stylesheet" type="text/css" />
is it being interpreted correctly (and the webpage gets rendered with the correct css), except that it violates html standards:
<link href=../../Content/Site2.css rel="stylesheet" type="text/css" />
Any suggestion about how to go tackling this problem or is there a more elegant solution I'm missing? I was going to proceed and implement variables in the ApplicationController that get selected based on links the user clicks at the top of the page, to switch between css styles.
Thank you!
Check to make sure your <head> tag does not have runat="server".
After making this change, be sure to check your script and css tags. This change can break the paths if you use the ~/ to ref app root. To help with this, use the Url.Content(...) helper.
I am using ASP.NET 3.5 with MasterPages. My master page has the script references to jquery and jquery UI. My web page that uses the master page has a script reference for a custom javascript file for that page. This javascript file has jquery calls in it (i.e. document.ready --> set up input boxes as calendars).
When I run the website in debug from Visual Studio, the input boxes are not set as calendars. However, if I copy the script from the external file and include it in a script block in the web page, the input box becomes a calendar.
I also have an element in the child page (not sure if that makes a difference). I have referenced the external javascript file in the ScriptManager and outside of the ScriptManager and neither work.
Why does jQuery not work in an external javascript file when the jQuery script reference resides in the master page?
Any help would be appreciated.
Thanks
MASTER PAGE CODE
<head id="Head1" runat="server">
<title>Customer Agreement Lifecycle Management System </title>
<link rel="stylesheet" type="text/css" href="~/calms.css" />
<link href="css/ui-lightness/jquery-ui-1.7.1.custom.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<%=ResolveUrl("~/js/jquery-1.3.2.min.js") %>"></script>
<script type="text/javascript" src="<%=ResolveUrl("~/js/jquery-ui-1.7.1.custom.min.js") %>"></script>
</head>
CHILD PAGE CODE
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<script src="<%=ResolveUrl("~/js/rule.js") %>" type="text/javascript"></script>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
I want to thank everyone for their suggestions but I made a "bone-headed" mistake. The tags were mistakenly still in the external js file. Once removed, everything works as expected. I apologize for taking up everyone's time (and somewhat embarrassed).
Thanks.
Is the external script include below the jquery script? Maybe it's the order in which the scripts are being loaded and run...
Are you sure the reference to the jQuery file in the child object appears in the head of the HTML document?
If not, put a ContentPlaceHolder in the tag and put the references you need in each child page.
I am using the ASP.NET Client-Side ajax control toolkit in my asp.net MVC application. I see that there is a .js file named "AjaxControlToolkit.ModalPopup.ModalPopupBehavior.js" in the AjaxControlToolkit folder. However, I cannot find any examples on how to use it.
[Edit] -
As mentioned, I am using the Client-side, Script-only control toolkit. For those unfamiliar, here is the description from CodePlex:
AjaxControlToolkit-ScriptFilesOnly.zip
contains script files, CSS style
sheets and pictures used by the
toolkit. Use this download if you
don't want to use embedded resources
and prefer a file-based model.
I have not been able to find many resources on how to use some of the scripts included with this.
CodePlex link: http://www.codeplex.com/AjaxControlToolkit/Release/ProjectReleases.aspx
Yestarday I had the same need to use the popup extender and here are the js files which you should include first.
<script src="javascripts/MicrosoftAjax.js" type="text/javascript" ></script>
<script src="javascripts/AjaxControlToolkit/AjaxControlToolkit.Compat.Timer.Timer.js" type="text/javascript"></script>
<script src="javascripts/AjaxControlToolkit/AjaxControlToolkit.Common.Common.js" type="text/javascript"></script>
<script src="javascripts/AjaxControlToolkit/AjaxControlToolkit.ExtenderBase.BaseScripts.js" type="text/javascript"></script>
<script src="javascripts/AjaxControlToolkit/AjaxControlToolkit.Animation.Animations.js" type="text/javascript"></script>
<script src="javascripts/AjaxControlToolkit/AjaxControlToolkit.DropShadow.DropShadowBehavior.js" type="text/javascript"></script>
<script src="javascripts/AjaxControlToolkit/AjaxControlToolkit.DynamicPopulate.DynamicPopulateBehavior.js" type="text/javascript"></script>
<script src="javascripts/AjaxControlToolkit/AjaxControlToolkit.PopupExtender.PopupBehavior.js" type="text/javascript"></script>
The next step is to create the PopupBehavior from javascript like that:
$create(AjaxControlToolkit.PopupControlBehavior, {"PopupControlID":"div_to_popup","Position":3}, null, null, $get("textbox_input_id"));
If you need to use another control from the AjaxControlToolkit with scripts only without the burden of asp, here is one easy way to find the necessary include js files.
Go to its demo page here and look at the source of the page. At the bottom you will see how to create the control. To find the include files needed for this control select CombineScriptsHandler.ashx and search for "//START". Every line with "//START" shows a script which is included in the page.
Check out the AJAX Toolkit samples. There are live demos, walkthroughs and documentation.