italic - Page 9 - Developer IT

asp:Button is not calling server-side function

- by Richard Neil Ilagan

Hi guys, I know that there has been much discussion here about this topic, but none of the threads I got across helped me solve this problem. I'm hoping that mine is somewhat unique, and may actually merit a different solution. I'm instantiating an asp:Button inside a data-bound asp:GridView through template fields. Some of the buttons are supposed to call a server-side function, but for some weird reason, it doesn't. All the buttons do when you click them is fire a postback to the current page, doing nothing, effectively just reloading the page. Below is a fragment of the code: <asp:GridView ID="gv" runat="server" AutoGenerateColumns="false" CssClass="l2 submissions" ShowHeader="false"> <Columns> <asp:TemplateField> <ItemTemplate><asp:Panel ID="swatchpanel" CssClass='<%# Bind("status") %>' runat="server"></asp:Panel></ItemTemplate> <ItemStyle Width="50px" CssClass="sw" /> </asp:TemplateField> <asp:BoundField DataField="description" ReadOnly="true"> </asp:BoundField> <asp:BoundField DataField="owner" ReadOnly="true"> <ItemStyle Font-Italic="true" /> </asp:BoundField> <asp:BoundField DataField="last-modified" ReadOnly="true"> <ItemStyle Width="100px" /> </asp:BoundField> <asp:TemplateField> <ItemTemplate> <asp:Button ID="viewBtn" cssclass='<%# Bind("sid") %>' runat="server" Text="View" OnClick="viewBtnClick" /> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView> The viewBtn above should call the viewBtnClick() function on server-side. I do have that function defined, along with a proper signature (object,EventArgs). One thing that may be of note is that this code is actually inside an ASCX, which is loaded in another ASCX, finally loaded into an ASPX. Any help or insight into the matter will be SO appreciated. Thanks! (oh, and please don't mind my trashy HTML/CSS semantics - this is still in a very,very early stage :p)

Read the article

Make text in a <div> wrap around a child element.

- by John

In Word you can place an image on a page and have the text flow nicely around it. I was wondering how far one can get towards this using CSS, noting that is has to work in IE6. I already have something sort of close using float, but the floated child-element still 'blocks' text above it. So it partially wraps. Is it possible to put a child div at some arbitrary position in the parent, and have text flow around it freely? The actual use-case here is to put illustrations inside the main content , where each illustration is implemented inside a child . I repeat, it has to work on IE6. And I don't want to get too involved in browser-specific hacks... floating the child at least works on IE6 with no tweaking. Currently I have like this: <div> <div class="illustration"> <img src="image1.png" /> <p>Illustration caption</p> </div> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Atvero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. </p> </div> div.illustration { float:right; border-top: 1px solid #505050; border-left: 1px solid #505050; border-right: 1px solid #505050; border-bottom: 1px solid #505050; margin-right:30px; margin-top:100px; text-align:center; padding:2px; background: #96C3FF; } div.illustration p { margin:0; font-size:small; font-style:italic; padding:0; }

Read the article

How do I change the visual style of a listitem based on its bound value?

- by Rodd

I have a listbox (here's the xaml): <ListBox MinWidth="300" ItemsSource="{Binding Relationships, Mode=OneWay}" SelectedItem="{Binding SelectedRelationship, Mode=TwoWay}" SelectionMode="Single" HorizontalAlignment="Left" > <ListBox.ItemTemplate> <DataTemplate> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto"/> <ColumnDefinition/> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition/> <RowDefinition/> <RowDefinition/> <RowDefinition/> <RowDefinition/> <RowDefinition/> </Grid.RowDefinitions> <CheckBox IsChecked = "{Binding IsPrimary}" IsHitTestVisible="False" /> <StackPanel Orientation="Horizontal" Grid.Column="1"> <TextBlock Text="{Binding RelationshipType}" FontWeight="Bold" Margin="0,0,5,0" /> <TextBlock Text="{Binding Status}" FontStyle="Italic" /> </StackPanel> <TextBlock Text="{Binding UnitName}" Grid.Row="1" Grid.Column="1" /> <TextBlock Text="{Binding StartDate, Converter={StaticResource DateConverter}}" Grid.Row="2" Grid.Column="1"/> <TextBlock Text="{Binding RetireDate}" Grid.Row="3" Grid.Column="1" /> <TextBlock Text="{Binding EndDate}" Grid.Row="4" Grid.Column="1" /> <TextBlock Text="{Binding ReasonForLeaving}" Grid.Row="5" Grid.Column="1" /> </Grid> </DataTemplate> </ListBox.ItemTemplate> </ListBox> What I want to do is have each item in the listbox have one of 3 backgrounds (green if the value of IsPrimary = true, Orange if the EndDate value is empty and grey if the EndDate value is not empty. Is there a way to template the listbox items so that they evaluate bound items to determine a view state or to have each listbox item bind to a value that I can set for each item in my viewmodel? Thanks for your help.

Read the article

highlight search keywords on hover

- by fusion

i've a basic php search form which highlights the keywords using css. i was wondering if i could make the keywords in the results highlight only when the user hovers over the record. is this possible? this is the highlight code: function highlightWords($text, $words) { preg_match_all('~\w+~', $words, $m); if(!$m) return $text; $re = '~\\b(' . implode('|', $m[0]) . ')~i'; $string = preg_replace($re, '<span class="highlight">$0</span>', $text); return $string; } . . . <table class="result"> <?php while ($row= mysql_fetch_array($result, MYSQL_ASSOC)) { $cQuote = highlightWords(htmlspecialchars($row['cQuotes']), $search_result); ?> <tr> <td style="text-align:right; font-size:15px;"><?php h($row['cArabic']); ?></td> <td style="font-size:16px;"><?php echo $cQuote; ?></td> <td style="font-size:12px;"><?php h($row['vAuthor']); ?></td> <td style="font-size:12px; font-style:italic; text-align:right;"><?php h($row['vReference']); ?></td> </tr> <?php } ?> </table> css: table.result tr:hover { background:#F7F7F7; } .highlight { font-weight:bold; color: #DE2842; padding:5px; padding-right:2px; background: #FFFCDB; } i tried changing the color through highlight:hover, but this changed the color of the search keyword only when i hovered over the keyword itself, which is understandable since that's the way it is supposed to work, but i'd like the search keywords to be highlighted when i hover over the result as a whole.

Read the article

What is the best WebControl to create this

- by balexandre

current output wanted output current code public partial class test : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { if (!Page.IsPostBack) populateData(); } private void populateData() { List<temp> ls = new List<temp>(); ls.Add(new temp { a = "AAA", b = "aa", c = "a", dt = DateTime.Now }); ls.Add(new temp { a = "BBB", b = "bb", c = "b", dt = DateTime.Now }); ls.Add(new temp { a = "CCC", b = "cc", c = "c", dt = DateTime.Now.AddDays(1) }); ls.Add(new temp { a = "DDD", b = "dd", c = "d", dt = DateTime.Now.AddDays(1) }); ls.Add(new temp { a = "EEE", b = "ee", c = "e", dt = DateTime.Now.AddDays(2) }); ls.Add(new temp { a = "FFF", b = "ff", c = "f", dt = DateTime.Now.AddDays(2) }); TemplateField tc = (TemplateField)gv.Columns[0]; // <-- want to assign here just day gv.Columns.Add(tc); // <-- want to assign here just day + 1 gv.Columns.Add(tc); // <-- want to assign here just day + 2 gv.DataSource = ls; gv.DataBind(); } } public class temp { public temp() { } public string a { get; set; } public string b { get; set; } public string c { get; set; } public DateTime dt { get; set; } } and in HTML <asp:GridView ID="gv" runat="server" AutoGenerateColumns="false"> <Columns> <asp:TemplateField> <ItemTemplate> <asp:Label ID="Label1" runat="server" Text='<%# Eval("a") %>' Font-Bold="true" /><br /> <asp:Label ID="Label2" runat="server" Text='<%# Eval("b") %>' Font-Italic="true" /><br /> <asp:Label ID="Label3" runat="server" Text='<%# Eval("dt") %>' /> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView> What I'm trying to avoid is repeat code so I can only use one unique TemplateField I can accomplish this with 3 x GridView, one per each day, but I'm really trying to simplify code as the Grid will be exactly the same (as the HTML code goes), just the DataSource changes. Any help is greatly appreciated, Thank you.

Read the article

% _ in search form displays all results

- by fusion

if the search form is blank, it should display an error that something should be entered by the user. it should only show those results which contain the keywords the user has entered in the search textbox. however, if the user enters % or _ or +, it displays all results. how do i display an error when the user enters these wildcard characters? my search php code: $search_result = ""; $search_result = $_GET["q"]; $search_result = trim($search_result); if ($search_result == "") { echo "<p>Search Error</p><p>Please enter a search...</p>" ; exit(); } $result = mysql_query('SELECT cQuotes, vAuthor, cArabic, vReference FROM thquotes WHERE cQuotes LIKE "%' . mysql_real_escape_string($search_result) .'%" ORDER BY idQuotes DESC', $conn) or die ('Error: '.mysql_error()); // there's either one or zero records. Again, no need for a while loop function h($s) { echo htmlspecialchars($s, ENT_QUOTES); } ?> <div class="caption">Search Results</div> <div class="center_div"> <table> <?php while ($row= mysql_fetch_array($result)) { ?> <tr> <td style="text-align:right; font-size:15px;"><?php h($row['cArabic']); ?></td> <td style="font-size:16px;"><?php h($cQuotes); ?></td> <td style="font-size:12px;"><?php h($row['vAuthor']); ?></td> <td style="font-size:12px; font-style:italic; text-align:right;"><?php h($row['vReference']); ?></td> </tr> <?php } ?> </table> <?php ?> </div>

Read the article

Adding the New HTML Editor Extender to a Web Forms Application using NuGet

- by Stephen Walther

The July 2011 release of the Ajax Control Toolkit includes a new, lightweight, HTML5 compatible HTML Editor extender. In this blog entry, I explain how you can take advantage of NuGet to quickly add the new HTML Editor control extender to a new or existing ASP.NET Web Forms application. Installing the Latest Version of the Ajax Control Toolkit with NuGet NuGet is a package manager. It enables you to quickly install new software directly from within Visual Studio 2010. You can use NuGet to install additional software when building any type of .NET application including ASP.NET Web Forms and ASP.NET MVC applications. If you have not already installed NuGet then you can install NuGet by navigating to the following address and clicking the giant install button: http://nuget.org/ After you install NuGet, you can add the Ajax Control Toolkit to a new or existing ASP.NET Web Forms application by selecting the Visual Studio menu option Tools, Library Package Manager, Package Manager Console: Selecting this menu option opens the Package Manager Console. You can enter the command Install-Package AjaxControlToolkit in the console to install the Ajax Control Toolkit: After you install the Ajax Control Toolkit with NuGet, your application will include an assembly reference to the AjaxControlToolkit.dll and SanitizerProviders.dll assemblies: Furthermore, your Web.config file will be updated to contain a new tag prefix for the Ajax Control Toolkit controls: <configuration> <system.web> <compilation debug="true" targetFramework="4.0" /> <pages> <controls> <add tagPrefix="ajaxToolkit" assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" /> </controls> </pages> </system.web> </configuration> The configuration file installed by NuGet adds the prefix ajaxToolkit for all of the Ajax Control Toolkit controls. You can type ajaxToolkit: in source view to get auto-complete in Source view. You can, of course, change this prefix to anything you want. Using the HTML Editor Extender After you install the Ajax Control Toolkit, you can use the HTML Editor Extender with the standard ASP.NET TextBox control to enable users to enter rich formatting such as bold, underline, italic, different fonts, and different background and foreground colors. For example, the following page can be used for entering comments. The page contains a standard ASP.NET TextBox, Button, and Label control. When you click the button, any text entered into the TextBox is displayed in the Label control. It is a pretty boring page: Let’s make this page fancier by extending the standard ASP.NET TextBox with the HTML Editor extender control: Notice that the ASP.NET TextBox now has a toolbar which includes buttons for performing various kinds of formatting. For example, you can change the size and font used for the text. You also can change the foreground and background color – and make many other formatting changes. You can customize the toolbar buttons which the HTML Editor extender displays. To learn how to customize the toolbar, see the HTML Editor Extender sample page here: http://www.asp.net/ajaxLibrary/AjaxControlToolkitSampleSite/HTMLEditorExtender/HTMLEditorExtender.aspx Here’s the source code for the ASP.NET page: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1.Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Add Comments</title> </head> <body> <form id="form1" runat="server"> <div> <ajaxToolkit:ToolkitScriptManager ID="TSM1" runat="server" /> <asp:TextBox ID="txtComments" TextMode="MultiLine" Columns="50" Rows="8" Runat="server" /> <ajaxToolkit:HtmlEditorExtender ID="hee" TargetControlID="txtComments" Runat="server" /> <br /><br /> <asp:Button ID="btnSubmit" Text="Add Comment" Runat="server" onclick="btnSubmit_Click" /> <hr /> <asp:Label ID="lblComment" Runat="server" /> </div> </form> </body> </html> Notice that the page above contains 5 controls. The page contains a standard ASP.NET TextBox, Button, and Label control. However, the page also contains an Ajax Control Toolkit ToolkitScriptManager control and HtmlEditorExtender control. The HTML Editor extender control extends the standard ASP.NET TextBox control. The HTML Editor TargetID attribute points at the TextBox control. Here’s the code-behind for the page above: using System; namespace WebApplication1 { public partial class Default : System.Web.UI.Page { protected void btnSubmit_Click(object sender, EventArgs e) { lblComment.Text = txtComments.Text; } } } Preventing XSS/JavaScript Injection Attacks If you use an HTML Editor -- any HTML Editor -- in a public facing web page then you are opening your website up to Cross-Site Scripting (XSS) attacks. An evil hacker could submit HTML using the HTML Editor which contains JavaScript that steals private information such as other user’s passwords. Imagine, for example, that you create a web page which enables your customers to post comments about your website. Furthermore, imagine that you decide to redisplay the comments so every user can see them. In that case, a malicious user could submit JavaScript which displays a dialog asking for a user name and password. When an unsuspecting customer enters their secret password, the script could transfer the password to the hacker’s website. So how do you accept HTML content without opening your website up to JavaScript injection attacks? The Ajax Control Toolkit HTML Editor supports the Anti-XSS library. You can use the Anti-XSS library to sanitize any HTML content. The Anti-XSS library, for example, strips away all JavaScript automatically. You can download the Anti-XSS library from NuGet. Open the Package Manager Console and execute the command Install-Package AntiXSS: Adding the Anti-XSS library to your application adds two assemblies to your application named AntiXssLibrary.dll and HtmlSanitizationLibrary.dll. After you install the Anti-XSS library, you can configure the HTML Editor extender to use the Anti-XSS library your application’s web.config file: <?xml version="1.0" encoding="utf-8"?> <configuration> <configSections> <sectionGroup name="system.web"> <section name="sanitizer" requirePermission="false" type="AjaxControlToolkit.Sanitizer.ProviderSanitizerSection, AjaxControlToolkit"/> </sectionGroup> </configSections> <system.web> <sanitizer defaultProvider="AntiXssSanitizerProvider"> <providers> <add name="AntiXssSanitizerProvider" type="AjaxControlToolkit.Sanitizer.AntiXssSanitizerProvider"></add> </providers> </sanitizer> <compilation debug="true" targetFramework="4.0" /> <pages> <controls> <add tagPrefix="ajaxToolkit" assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" /> </controls> </pages> </system.web> </configuration> Summary In this blog entry, I described how you can quickly get started using the new HTML Editor extender – included with the July 2011 release of the Ajax Control Toolkit – by installing the Ajax Control Toolkit with NuGet. If you want to learn more about the HTML Editor then please take a look at the Ajax Control Toolkit sample site: http://www.asp.net/ajaxLibrary/AjaxControlToolkitSampleSite/HTMLEditorExtender/HTMLEditorExtender.aspx

Read the article

Changing CSS with jQuery syntax in Silverlight using jLight

- by Timmy Kokke

Lately I’ve ran into situations where I had to change elements or had to request a value in the DOM from Silverlight. jLight, which was introduced in an earlier article, can help with that. jQuery offers great ways to change CSS during runtime. Silverlight can access the DOM, but it isn’t as easy as jQuery. All examples shown in this article can be looked at in this online demo. The code can be downloaded here. Part 1: The easy stuff Selecting and changing properties is pretty straight forward. Setting the text color in all <B> </B> elements can be done using the following code: jQuery.Select("b").Css("color", "red"); The Css() method is an extension method on jQueryObject which is return by the jQuery.Select() method. The Css() method takes to parameters. The first is the Css style property. All properties used in Css can be entered in this string. The second parameter is the value you want to give the property. In this case the property is “color” and it is changed to “red”. To specify which element you want to select you can add a :selector parameter to the Select() method as shown in the next example. jQuery.Select("b:first").Css("font-family", "sans-serif"); The “:first” pseudo-class selector selects only the first element. This example changes the “font-family” property of the first <B></B> element to “sans-serif”. To make use of intellisense in Visual Studio I’ve added a extension methods to help with the pseudo-classes. In the example below the “font-weight” of every “Even” <LI></LI> is set to “bold”. jQuery.Select("li".Even()).Css("font-weight", "bold"); Because the Css() extension method returns a jQueryObject it is possible to chain calls to Css(). The following example show setting the “color”, “background-color” and the “font-size” of all headers in one go. jQuery.Select(":header").Css("color", "#12FF70") .Css("background-color", "yellow") .Css("font-size", "25px"); Part 2: More complex stuff In only a few cases you need to change only one style property. More often you want to change an entire set op style properties all in one go. You could chain a lot of Css() methods together. A better way is to add a class to a stylesheet and define all properties in there. With the AddClass() method you can set a style class to a set of elements. This example shows how to add the “demostyle” class to all <B></B> in the document. jQuery.Select("b").AddClass("demostyle"); Removing the class works in the same way: jQuery.Select("b").RemoveClass("demostyle"); jLight is build for interacting with to the DOM from Silverlight using jQuery. A jQueryObjectCss object can be used to define different sets of style properties in Silverlight. The over 60 most common Css style properties are defined in the jQueryObjectCss class. A string indexer can be used to access all style properties ( CssObject1[“background-color”] equals CssObject1.BackgroundColor). In the code below, two jQueryObjectCss objects are defined and instantiated. private jQueryObjectCss CssObject1; private jQueryObjectCss CssObject2; public Demo2() { CssObject1 = new jQueryObjectCss { BackgroundColor = "Lime", Color="Black", FontSize = "12pt", FontFamily = "sans-serif", FontWeight = "bold", MarginLeft = 150, LineHeight = "28px", Border = "Solid 1px #880000" }; CssObject2 = new jQueryObjectCss { FontStyle = "Italic", FontSize = "48", Color = "#225522" }; InitializeComponent(); } Now instead of chaining to set all different properties you can just pass one of the jQueryObjectCss objects to the Css() method. In this case all <LI></LI> elements are set to match this object. jQuery.Select("li").Css(CssObject1); When using the jQueryObjectCss objects chaining is still possible. In the following example all headers are given a blue backgroundcolor and the last is set to match CssObject2. jQuery.Select(":header").Css(new jQueryObjectCss{BackgroundColor = "Blue"}) .Eq(-1).Css(CssObject2); Part 3: The fun stuff Having Silverlight call JavaScript and than having JavaScript to call Silverlight requires a lot of plumbing code. Everything has to be registered and strings are passed back and forth to execute the JavaScript. jLight makes this kind of stuff so easy, it becomes fun to use. In a lot of situations jQuery can call a function to decide what to do, setting a style class based on complex expressions for example. jLight can do the same, but the callback methods are defined in Silverlight. This example calls the function() method for each <LI></LI> element. The callback method has to take a jQueryObject, an integer and a string as parameters. In this case jLight differs a bit from the actual jQuery implementation. jQuery uses only the index and the className parameters. A jQueryObject is added to make it simpler to access the attributes and properties of the element. If the text of the listitem starts with a ‘D’ or an ‘M’ the class is set. Otherwise null is returned and nothing happens. private void button1_Click(object sender, RoutedEventArgs e) { jQuery.Select("li").AddClass(function); } private string function(jQueryObject obj, int index, string className) { if (obj.Text[0] == 'D' || obj.Text[0] == 'M') return "demostyle"; return null; } The last thing I would like to demonstrate uses even more Silverlight and less jLight, but demonstrates the power of the combination. Animating a style property using a Storyboard with easing functions. First a dependency property is defined. In this case it is a double named Intensity. By handling the changed event the color is set using jQuery. public double Intensity { get { return (double)GetValue(IntensityProperty); } set { SetValue(IntensityProperty, value); } } public static readonly DependencyProperty IntensityProperty = DependencyProperty.Register("Intensity", typeof(double), typeof(Demo3), new PropertyMetadata(0.0, IntensityChanged)); private static void IntensityChanged(DependencyObject d, DependencyPropertyChangedEventArgs e) { var i = (byte)(double)e.NewValue; jQuery.Select("span").Css("color", string.Format("#{0:X2}{0:X2}{0:X2}", i)); } An animation has to be created. This code defines a Storyboard with one keyframe that uses a bounce ease as an easing function. The animation is set to target the Intensity dependency property defined earlier. private Storyboard CreateAnimation(double value) { Storyboard storyboard = new Storyboard(); var da = new DoubleAnimationUsingKeyFrames(); var d = new EasingDoubleKeyFrame { EasingFunction = new BounceEase(), KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(1.0)), Value = value }; da.KeyFrames.Add(d); Storyboard.SetTarget(da, this); Storyboard.SetTargetProperty(da, new PropertyPath(Demo3.IntensityProperty)); storyboard.Children.Add(da); return storyboard; } Initially the Intensity is set to 128 which results in a gray color. When one of the buttons is pressed, a new animation is created an played. One to animate to black, and one to animate to white. public Demo3() { InitializeComponent(); Intensity = 128; } private void button2_Click(object sender, RoutedEventArgs e) { CreateAnimation(255).Begin(); } private void button3_Click(object sender, RoutedEventArgs e) { CreateAnimation(0).Begin(); } Conclusion As you can see jLight can make the life of a Silverlight developer a lot easier when accessing the DOM. Almost all jQuery functions that are defined in jLight use the same constructions as described above. I’ve tried to stay as close as possible to the real jQuery. Having JavaScript perform callbacks to Silverlight using jLight will be described in more detail in a future tutorial about AJAX or eventing.

Read the article

Content Box is a Little Off in IE9 ... How to Fix?

- by Kelsey Nealon

Hi there! I have a website at www.thetotempole.ca and when viewed in IE9... My websites content box (The green wooden backgrounded box with content inside) is moved slightly over to the left making a space between the actual container and the content box... Is there anyway I can fix this without harming any of the other browsers? Thanks! Screenshot: HTML: <!DOCTYPE html> <head> <title>The Totem Pole News - Movies</title>  <link rel="stylesheet" type="text/css" href="engine1/style.css" /> <script type="text/javascript" src="engine1/jquery.js"></script>  <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-45342007-1']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script> <meta charset="utf-8"> <meta name="description" content="A totem pole themed news website posting articles on news, music, movies, video games, and health."> <link href="thecss2.css" rel="stylesheet" type="text/css"> <link rel="icon" type="image/ico" href="images/favicon.ico"> <meta http-equiv="X-UA-Compatible" content="IE=8" /> </head> <body> <div id="container"> <div id="contentbox" align="Center"> <a href="index.html"><div id="banner" align="Center"> </div></a> <div id="navbar"> <p><a href="index.html"><img src="images/home.png" width="65" height="54" alt="picture of a house to relate to the home page (content)" style="position: absolute; left: 23px; top: 16px; width: 57px; height: 48px;"><span style="position: absolute; left: 24px; z-index:2; top: 71px; height: 23px;">Content</span></a> <a href="#"><img src="images/eagleicon.gif" width="73" height="39" alt="An Eagle icon for the News section of the Totem Pole" style="position: absolute; left: 111px; top: 28px;"><span style="position: absolute; z-index: 2; left: 127px; top: 72px;">News</span></a> <a href="#"><img src="images/owlicon.gif" width="81" height="61" alt="An Owl icon for the Music section of the totem pole" style="position: absolute; left: 210px; top: 11px;"><span style="position: absolute; z-index:2; left: 226px; top: 73px;"><strong>Music</strong></span></a><a href="movies.html"><img src="images/wolficon.gif" width="88" height="54" alt="A Wolf icon for the Movies section of the totem pole" style="position: absolute; left: 320px; top: 15px;"><span style="position: absolute; left: 336px; top: 72px; z-index:2;"><strong>Movies</strong></span></a> <a href="#"><img src="images/hareimage.gif" width="60" height="56" alt="A Hare icon for Video Game section of the Totem Pole" style="position: absolute; left: 441px; top: 13px;"><span style="position: absolute; z-index:2; left: 428px; top: 73px;"><strong>Video Games</strong></span></a> <a href="#"><img src="images/bearicon.gif" width="91" height="57" alt="A bear icon for the Health section of The Totem Pole" style="position: absolute; left: 551px; top: 13px;"><span style="position: absolute; left: 580px; top: 72px; z-index:2;">Health</span></a></p> </div>  <div id="navbar2"> <a href="#">About Us</a> <a href="#">Feedback</a> <a href="#">Subscribe</a> </div>  <div id="searchbar"> <form method="get" action="http://search.atomz.com/search/"> <input id="searchbox" size="13" name="sp_q" value="Search..." onFocus="if (this.value == 'Search...') {this.value=''}"> <input class="css_btn_class" type="submit" value="Search"> <input type="hidden" name="sp_a" value="sp1005092e"> <input type="hidden" name="sp_p" value="all"> <input type="hidden" name="sp_f" value="UTF-8"> </form> </div>  <div id="mywowslider"> <div id="wowslider-container1"> <div class="ws_images"> <ul> <li><img src="images/anchor.jpg" alt="Ron Burgundy" title="Ron Burgundy" id="wows1_0"/>Played by Will Ferrell</li> <li><img src="images/anchor2.jpg" alt="Brian Fantana" title="Brian Fantana" id="wows1_1"/>Played by Paul Rudd</li> <li><img src="images/anchor3.jpg" alt="Brick Tamland" title="Brick Tamland" id="wows1_2"/>Played by Steve Carrell</li> <li><img src="images/anchor4.jpg" alt="Champ Kind" title="Champ Kind" id="wows1_3"/>Played by David Koechner</li> </ul> </div> <div class="ws_bullets"><div> <a href="#" title="Ron Burgundy"><img src="images/anchor.jpg" alt="Ron Burgundy"/>1</a> <a href="#" title="Brian Fantana"><img src="images/anchor2.jpg" alt="Brian Fantana"/>2</a> <a href="#" title="Brick Tamland"><img src="images/anchor3.jpg" alt="Brick Tamland"/>3</a> <a href="#" title="Champ Kind"><img src="images/anchor4.jpg" alt="Champ Kind"/>4</a> </div> </div> <span class="wsl"><a href="http://wowslider.com"></a></span> <div class="ws_shadow"></div> </div> <script type="text/javascript" src="engine1/wowslider.js"></script> <script type="text/javascript" src="engine1/script.js"></script> </div>    <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-5279b96309e7df24"></script> <script type="text/javascript"> addthis.layers({ 'theme' : 'transparent', 'share' : { 'position' : 'left', 'numPreferredServices' : 5 } }); </script>  <div id="sources"><p> Source(s): <a href="http://en.wikipedia.org/wiki/Anchorman_2:_The_Legend_Continues">wikipedia.com</a></p></div> <div id="infocontent"> <p align="left"><em><strong>       Anchorman 2: The Legend Continues</strong></em> is an upcoming American comedy film being released on December 20, 2013, also a sequel to the 2004 film <em>Anchorman: The Legend of Ron Burgandy</em>. On March 28, 2012, actor Will Ferrell officially announced the sequel dressed in character as Ron Burgundy on the late-night talk-show <em>Conan</em>. As with the original film, it is directed by Adam McKay, produced by Judd Apatow, stars Will Ferrell and is written by Adam McKay and Will Ferrell. Unlike the original film, which was distributed by DreamWorks Pictures, <em>The Legend Continues</em> will be distributed by Paramount Pictures.</p> <p align="left"><em><strong>      </strong></em>The movie now has a website at <a href="www.anchormanmovie.com">www.anchormanmovie.com</a> where a countdown for the release of this film can be seen. By the looks of these images, I think we can expect big things when the movie comes out this December. Enjoy the poster photos and trailers all posted below, and don't forget to submit your vote in the poll!</p> </div> <div id="trailer1"><iframe width="560" height="315" src="//www.youtube.com/embed/Elczv0ghqw0?rel=0" frameborder="0" allowfullscreen></iframe></div> <div id="trailer2"> <iframe width="560" height="315" src="//www.youtube.com/embed/mZ-JX-7B3uM?rel=0" frameborder="0" allowfullscreen></iframe> </div> <div id="poll"> <form method="post" action="http://poll.pollcode.com/763294"><table style="border: black 1px solid;" border="1" width="175" bgcolor="EEEEEE" cellspacing="2" cellpadding="0"><tr><td colspan="2" height="10"><font face="Verdana" size="2" color="000000"><b>What Rating Do You Think This Will Recieve</b></font></td></tr><tr><td width="5"><input type="radio" name="answer" value="1" id="763294answer1"></td><td> <font face="Verdana" size="2" color="000000"><label for="763294answer1">10</label></font></td></tr><tr><td width="5"><input type="radio" name="answer" value="2" id="763294answer2"></td><td> <font face="Verdana" size="2" color="000000"><label for="763294answer2">9</label></font></td></tr><tr><td width="5"><input type="radio" name="answer" value="3" id="763294answer3"></td><td> <font face="Verdana" size="2" color="000000"><label for="763294answer3">8</label></font></td></tr><tr><td width="5"><input type="radio" name="answer" value="4" id="763294answer4"></td><td> <font face="Verdana" size="2" color="000000"><label for="763294answer4">7</label></font></td></tr><tr><td width="5"><input type="radio" name="answer" value="5" id="763294answer5"></td><td> <font face="Verdana" size="2" color="000000"><label for="763294answer5">6</label></font></td></tr><tr><td width="5"><input type="radio" name="answer" value="6" id="763294answer6"></td><td> <font face="Verdana" size="2" color="000000"><label for="763294answer6">5</label></font></td></tr><tr><td width="5"><input type="radio" name="answer" value="7" id="763294answer7"></td><td> <font face="Verdana" size="2" color="000000"><label for="763294answer7">4</label></font></td></tr><tr><td width="5"><input type="radio" name="answer" value="8" id="763294answer8"></td><td> <font face="Verdana" size="2" color="000000"><label for="763294answer8">3</label></font></td></tr><tr><td width="5"><input type="radio" name="answer" value="9" id="763294answer9"></td><td> <font face="Verdana" size="2" color="000000"><label for="763294answer9">2</label></font></td></tr><tr><td width="5"><input type="radio" name="answer" value="10" id="763294answer10"></td><td> <font face="Verdana" size="2" color="000000"><label for="763294answer10">1</label></font></td></tr><tr><td colspan="2" height="10"><center><input type="submit" value=" Vote ">  <input title="Clicking this will send you to a new page" type="submit" name="view" value=" View "></center></td></tr><tr><td colspan="2" align="right"><font face="Verdana" height="5" size="1" color="000000"></font></td></tr></table></form></div> <span style="position: absolute; left: 0px; top: 225px; width: 1000px; border-bottom: 2px black double; height: 58px;"> <h1 style="font-weight: normal; font-size:28px"><em>Anchorman 2 Arrives Soon</em></h1></span> <div id="contentbox2"></div>  <center><div id="footer"><a href="#">Sitemap</a> <a href="#">About Us</a> <a href="#">Feedback</a></div></center> <div id="disqus"><div id="disqus_thread"></div> <script type="text/javascript"> /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */ var disqus_shortname = 'thetotempoleanchorman2'; // required: replace example with your forum shortname /* * * DON'T EDIT BELOW THIS LINE * * */ (function() { var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true; dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js'; (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })(); </script> <noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript> <a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a></div> </div>  </div> </body> </html> CSS: html { background: url(images/pine.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/pine.jpg', sizingMethod='scale'); -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/pine.jpg', sizingMethod='scale')"; } body { margin-bottom:0px; font-family: Verdana, Geneva, sans-serif; } a { outline : none; border: none; } a:hover { color: #0FC; } #container { width: 1000px; height:1924px; position:relative; margin-right: auto; margin-left: auto; z-index:1; margin-bottom: 50px; } #facebook { position:fixed; right:100px; z-index:15; } #twitter { position:fixed; z-index:16; right:120px; } #google { position:fixed; top:7px; right: 135px; } #socialmediaplugins { text-align: right; position: fixed; background: rgb(125,126,125); /* Old browsers */ background: -moz-linear-gradient(top, rgba(125,126,125,1) 0%, rgba(247,247,247,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(125,126,125,1)), color-stop(100%,rgba(247,247,247,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(247,247,247,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(247,247,247,1) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(247,247,247,1) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(125,126,125,1) 0%,rgba(247,247,247,1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#f7f7f7',GradientType=0 ); /* IE6-9 */ margin: 0px; top: 0px; left: 0px; right: 0px; z-index:14; } #searchbox { background-color:#01bff6; border-radius:4px; } #searchbox:hover { background-color:#76b618; border-radius:4px; } #searchbox:active { background-color:#01bff6; border-radius:4px; } #contentbox { background-color:black; background-image:url(images/wooden.jpg); width: 1000px; margin-bottom:50px; height: 1924px; box-shadow:2px 2px 10px 10px #060606; -webkit-box-shadow:2px 2px 10px 10px #060606; -moz-box-shadow:2px 2px 10px 10px #060606; /* For IE<9 */ filter: progid:DXImageTransform.Microsoft.Shadow(color=#060606,direction=0,strength=5), progid:DXImageTransform.Microsoft.Shadow(color=#060606,direction=45,strength=2), progid:DXImageTransform.Microsoft.Shadow(color=#060606,direction=90,strength=5), progid:DXImageTransform.Microsoft.Shadow(color=#060606,direction=135,strength=5), progid:DXImageTransform.Microsoft.Shadow(color=#060606,direction=180,strength=10), progid:DXImageTransform.Microsoft.Shadow(color=#060606,direction=225,strength=5), progid:DXImageTransform.Microsoft.Shadow(color=#060606,direction=270,strength=5), progid:DXImageTransform.Microsoft.Shadow(color=#060606,direction=315,strength=2); } #contentbox2 { background-image:url(images/woodenmovies.jpg); top:299px; width: 1000px; margin-bottom:50px; height: 1625px; position: absolute; } #banner { background-image:url(images/totempolebanner.gif); position:absolute; top:25px; width:768px; height:120px; left:116px; } #navbar { float: left; position: absolute; top: 146px; left: 76px; width: 844px; height: 158px; font-weight:bold; } #navbar a { color:#0C6; font-size: 13px; } #navbar a:hover { color:#0F9; font-size: 13px; } #navbar2 a:hover { color:#0F9; } #navbar2 a{ text-decoration:none; color:#0C6; } #navbar2 { position: absolute; top: 4px; left: 766px; width: 273px; height: 24px; font-size: 11px; } #searchbar { position: absolute; top: 23px; left: 885px; width: 118px; height: 69px; } .css_btn_class { font-size:9px; position: relative; top:0px; right:4px; width:90px; height:25px; font-family:Verdana; font-weight:normal; -moz-border-radius:7px; -webkit-border-radius:7px; border-radius:7px; border:1px solid #35d914; padding:7px 24px; text-decoration:none; background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ff9d00), color-stop(100%, #ffe711) ); background:-moz-linear-gradient( center top, #ff9d00 5%, #ffe711 100% ); background:-ms-linear-gradient( top, #ff9d00 5%, #ffe711 100% ); background-color:#ff9d00; color:#ff0000; display:inline-block; text-shadow:0px 0px 1px #117cff; -webkit-box-shadow: 0px 0px 0px 0px #117cff; -moz-box-shadow: 0px 0px 0px 0px #117cff; box-shadow: 0px 0px 0px 0px #117cff; background-image: url(images/unnamed.gif); background-repeat:no-repeat; background-position:right; }.css_btn_class:hover { width:90px; background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ffe711), color-stop(100%, #ff9d00) ); background:-moz-linear-gradient( center top, #ffe711 5%, #ff9d00 100% ); background:-ms-linear-gradient( top, #ffe711 5%, #ff9d00 100% ); background-color:#ffe711; background-image: url(images/unnamed.gif); background-repeat:no-repeat; background-position:right; }.css_btn_class:active { position:relative; width:90px; top:1px; background-image: url(images/unnamed.gif); background-repeat:no-repeat; background-position:right; } /* This css button was generated by css-button-generator.com */ img {border:none;} #eagle { position:relative; right: 144px; top:299px; } #owl { top:624px; position:absolute; left:0px; } #wolf { top:949px; position:absolute; right:0px; } #hare { top:1274px; position:absolute; left:0px; } #bear { top:1599px; position:absolute; right:0px; } #footer { position: absolute; left: 393px; top: 1941px; width: 251px; color: #0F9; } #footer a { color: #0f9; } .atss { left: 0; } #infocontent { position: absolute; z-index: 3; left: 15px; top: 333px; height: 348px; width: 789px; } #mywowslider { position: absolute; z-index: 3; left: 640px; top: 684px; } #poll { position: absolute; z-index: 3; left: 815px; top: 344px; } #trailer1 { position: absolute; z-index: 3; left: 40px; top: 598px; } #trailer2 { position: absolute; z-index: 3; left: 40px; top: 948px; } #trailer1header { position: absolute; z-index: 3; left: 200px; top: 550px; width: 240px; font-style: italic; font-weight: normal; } #trailer2header { position: absolute; z-index: 3; left: 200px; top: 898px; width: 241px; height: 51px; font-style: italic; font-weight: normal; } #disqus { position: absolute; z-index: 3; left: 0px; top: 1340px; } #sources { position: absolute; z-index: 3; left: 394px; top: 1249px; width: 212px; }

Read the article

Gratuitous CRLF in Subject: line - why is it there, and is it legal?

- by MadHatter

I'm running into a problem with a NAGIOS system sending emails to a popular email-to-SMS service. The email-to-SMS service takes emails with text in the Subject: line, and sends them on to the mobile number encoded in the To: field. So far so good. Sadly, sendmail (and postfix before it) seem to be inserting a gratuitous CRLF into the (necessarily long) Subject: line, and that's causing my SMS messages to be truncated at the CRLF if and only if the Subject: line contains one or more colons past the gratuitous CRLF. I am confident that the messages are being created correctly, but just to be sure, here's me creating a completely noddy test message to myself, with a long Subject: line: echo "foo" | mail -s "1234567 101234567 201234567 301234567 401234567 501234567 601234567 701234567 801234567 90123456789" [email protected] Note there's no extra colon in this Subject: line; all I'm doing here is showing that an extra CRLF is inserted on the wire. Here's the result of sudo ngrep -x port 25: 44 61 74 65 3a 20 46 72 69 2c 20 33 31 20 4d 61 Date: Fri, 31 Ma 79 20 32 30 31 33 20 31 30 3a 34 33 3a 35 35 20 y 2013 10:43:55 2b 30 31 30 30 0d 0a 54 6f 3a 20 72 65 61 70 65 +0100..To: reape 72 40 74 65 61 70 61 72 74 79 2e 6e 65 74 0d 0a [email protected].. 53 75 62 6a 65 63 74 3a 20 31 32 33 34 35 36 37 Subject: 1234567 20 31 30 31 32 33 34 35 36 37 20 32 30 31 32 33 101234567 20123 34 35 36 37 20 33 30 31 32 33 34 35 36 37 20 34 4567 301234567 4 30 31 32 33 34 35 36 37 20 35 30 31 32 33 34 35 01234567 5012345 36 37 0d 0a 20 36 30 31 32 33 34 35 36 37 20 37 67.. 601234567 7 30 31 32 33 34 35 36 37 20 38 30 31 32 33 34 35 01234567 8012345 36 37 20 39 30 31 32 33 34 35 36 37 38 39 0d 0a 67 90123456789.. 55 73 65 72 2d 41 67 65 6e 74 3a 20 48 65 69 72 User-Agent: Heir 6c 6f 6f 6d 20 6d 61 69 6c 78 20 31 32 2e 34 20 loom mailx 12.4 37 2f 32 39 2f 30 38 0d 0a 4d 49 4d 45 2d 56 65 7/29/08..MIME-Ve 72 73 69 6f 6e 3a 20 31 2e 30 0d 0a 43 6f 6e 74 rsion: 1.0..Cont 65 6e 74 2d 54 79 70 65 3a 20 74 65 78 74 2f 70 ent-Type: text/p 6c 61 69 6e 3b 20 63 68 61 72 73 65 74 3d 75 73 lain; charset=us About half way down (marked in bold+italic), between the 501234567 and the 601234567 in the original Subject: header, you can see a CRLF being inserted (0x0d 0x0a, on the left-hand side hex dump, .. on the right-hand side plain text). The receiving MTA seems happy to post-process this, and when I look at the on-disc stored mail at the receiving end, I see only a LF (0x0a) in the Subject: line, and the line is parsed correctly and in its entirety by, eg, alpine. Nevertheless, the CRLF is there on the wire, and between me and the (excellent) email-to-SMS support people, we've established that these are the cause of the problem. So my question is: is it lawful for an MTA to insert a gratuitous CRLF on the wire? If it is, and I can prove it, then it's the email-to-SMS house's problem, because they are being intolerant. If it isn't, or it is but I can't prove it, then it becomes my problem, so an answer with references would be most useful. Edit: I can now come clean that the email-to-SMS service in question is kapow. Once this problem was explained to them, they got it, worked with me to develop and test a fix, and have deployed the fix. My long subject lines with colons in now get relayed correctly into SMSes. I don't normally trumpet individual companies, especially not on SF, but I thought it worthy of note that kapow Did The Right Thing. (Disclaimer: I have no connection with kapow except as a paying customer who's happy about the way they dealt with his problem.)

Read the article

Prevent ListBox from focusing but leave ListBoxItem(s) focusable (wpf)

- by modosansreves

Here is what happens: I have a listbox with items. Listbox has focus. Some item (say, 5th) is selected (has a blue background), but has no 'border'. When I press 'Down' key, the focus moves from ListBox to the first ListBoxItem. (What I want is to make 6th item selected, regardless of the 'border') When I navigate using 'Tab', the Listbox never receives the focus again. But when the collection is emptied and filled again, ListBox itself gets focus, pressing 'Down' moves the focus to the item. How to prevent ListBox from gaining focus? P.S. listBox1.SelectedItem is my own class, I don't know how to make ListBoxItem out of it to .Focus() it. EDIT: the code Xaml: <UserControl.Resources> <me:BooleanToVisibilityConverter x:Key="visibilityConverter"/> <me:BooleanToItalicsConverter x:Key="italicsConverter"/> </UserControl.Resources> <ListBox x:Name="lbItems"> <ListBox.ItemTemplate> <DataTemplate> <Grid> <ProgressBar HorizontalAlignment="Stretch" VerticalAlignment="Bottom" Visibility="{Binding Path=ShowProgress, Converter={StaticResource visibilityConverter}}" Maximum="1" Margin="4,0,0,0" Value="{Binding Progress}" /> <TextBlock Text="{Binding Path=VisualName}" FontStyle="{Binding Path=IsFinished, Converter={StaticResource italicsConverter}}" Margin="4" /> </Grid> </DataTemplate> </ListBox.ItemTemplate> <me:OuterItem Name="Regular Folder" IsFinished="True" Exists="True" IsFolder="True"/> <me:OuterItem Name="Regular Item" IsFinished="True" Exists="True"/> <me:OuterItem Name="Yet to be created" IsFinished="False" Exists="False"/> <me:OuterItem Name="Just created" IsFinished="False" Exists="True"/> <me:OuterItem Name="In progress" IsFinished="False" Exists="True" Progress="0.7"/> </ListBox> where OuterItem is: public class OuterItem : IOuterItem { public Guid Id { get; set; } public string Name { get; set; } public bool IsFolder { get; set; } public bool IsFinished { get; set; } public bool Exists { get; set; } public double Progress { get; set; } /// Code below is of lesser importance, but anyway /// #region Visualization helper properties public bool ShowProgress { get { return !IsFinished && Exists; } } public string VisualName { get { return IsFolder ? "[ " + Name + " ]" : Name; } } #endregion public override string ToString() { if (IsFinished) return Name; if (!Exists) return " ??? " + Name; return Progress.ToString("0.000 ") + Name; } public static OuterItem Get(IOuterItem item) { return new OuterItem() { Id = item.Id, Name = item.Name, IsFolder = item.IsFolder, IsFinished = item.IsFinished, Exists = item.Exists, Progress = item.Progress }; } } ?onverters are: /// Are of lesser importance too (for understanding), but will be useful if you copy-paste to get it working public class BooleanToItalicsConverter : IValueConverter { public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) { bool normal = (bool)value; return normal ? FontStyles.Normal : FontStyles.Italic; } public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) { throw new NotImplementedException(); } } public class BooleanToVisibilityConverter : IValueConverter { public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) { bool exists = (bool)value; return exists ? Visibility.Visible : Visibility.Collapsed; } public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) { throw new NotImplementedException(); } } But most important, is that UserControl.Loaded() has: lbItems.Items.Clear(); lbItems.ItemsSource = fsItems; where fsItems is ObservableCollection<OuterItem>. The usability problem I describe takes place when I Clear() that collection (fsItems) and fill with new items.

Read the article

wmd editor (jquery version) over ajax forms

- by Davide Barison

i'm trying wmd editor over ajax. here there is the bugged code wdm code is based on openlibrary fork on github it work very good without ajax. but when i try to display editor over ajax form it doesn't load. non ajax version produce this html: <div id="wmd-container"> <div id="wmd-button-bar"></div> <div id="wmd-button-bar-0" class="wmd-button-bar"><ul class="wmd-button-row"><li style="background-position: 0px 0px;" title="Strong <strong> Ctrl+B" class="wmd-button wmd-bold-button"></li><li style="background-position: -20px 0px;" title="Emphasis <em> Ctrl+I" class="wmd-button wmd-italic-button"></li><li class="wmd-spacer"></li><li style="background-position: -40px 0px;" title="Hyperlink <a> Ctrl+L" class="wmd-button wmd-link-button"></li><li style="background-position: -60px 0px;" title="Blockquote <blockquote> Ctrl+Q" class="wmd-button wmd-quote-button"></li><li style="background-position: -80px 0px;" title="Code Sample <pre><code> Ctrl+K" class="wmd-button wmd-code-button"></li><li style="background-position: -100px 0px;" title="Image <img> Ctrl+G" class="wmd-button wmd-image-button"></li><li class="wmd-spacer"></li><li style="background-position: -120px 0px;" title="Numbered List <ol> Ctrl+O" class="wmd-button wmd-olist-button"></li><li style="background-position: -140px 0px;" title="Bulleted List <ul> Ctrl+U" class="wmd-button wmd-ulist-button"></li><li style="background-position: -160px 0px;" title="Heading <h1>/<h2> Ctrl+H" class="wmd-button wmd-heading-button"></li><li style="background-position: -180px 0px;" title="Horizontal Rule <hr> Ctrl+R" class="wmd-button wmd-hr-button"></li><li class="wmd-spacer"></li><li style="background-position: -200px -20px;" title="Undo - Ctrl+Z" class="wmd-button wmd-undo-button"></li><li style="background-position: -220px -20px;" title="Redo - Ctrl+Shift+Z" class="wmd-button wmd-redo-button"></li><li style="background-position: -240px 0px;" class="wmd-button wmd-help-button"><a title="WMD website" target="_blank" href="http://wmd-editor.com/"></a></li></ul></div><div id="wmd-button-bar-2" class="wmd-button-bar"></div><div id="wmd-button-bar-4" class="wmd-button-bar"></div><textarea id="wmd-input" class="resizable" name="post-text" cols="92" rows="15" tabindex="101"></textarea><div id="wmd-preview-4" class="wmd-preview"></div><div id="wmd-preview-2" class="wmd-preview"></div><div id="wmd-preview-0" class="wmd-preview"></div> </div> with ajax form: <div id="wmd-container"> <div id="wmd-button-bar"></div> <div id="wmd-button-bar-1" class="wmd-button-bar"></div><div id="wmd-button-bar-3" class="wmd-button-bar"></div><textarea id="wmd-input" class="resizable" name="post-text" cols="92" rows="15" tabindex="101"></textarea><div id="wmd-preview-3" class="wmd-preview"></div><div id="wmd-preview-1" class="wmd-preview"></div> </div> any help?

Read the article

How to create a Facebook-App style notifications custom table?

- by Tim Büthe

I want to add a custom table to my iPhone app, that should look and work like the one used in the facebook app showing the notifications. It should contain rows with links in it. The text should be black, while the tap-able parts should appear blue. As a already figured out, labels only have one font, color and so on and you can't mix styles within it, I would have to use different components. The tab-able text parts maybe UIButtons with custom style without any border. I tried different approches to build the custom cell. I used Interface Builder, to layout components, but since the different parts have variable lengths they overlaid each other. I also tried to add instances of UIButton and UILabel as a subview to the cell's contentView as descibed in Apple's tutorial. The problem with this is that: The position and size of the components is fix and set when they get created using "initWithFrame:...". My code in "tableView:cellForRowAtIndexPath:" looks like this: UIButton *usernameButton; UILabel *mainLabel, *secondLabel; UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier]; if (cell == nil) { // cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease]; cell = [[[UITableViewCell alloc] initWithFrame:CGRectMake(0.0, 0.0, 220.0, 60.0) reuseIdentifier:CellIdentifier] autorelease]; [cell setBackgroundColor: [UIColor yellowColor]]; usernameButton = [[[UIButton alloc] initWithFrame:CGRectMake(0.0, 0.0, 220.0, 15.0)] autorelease]; usernameButton.tag = USERNAME_BUTTON_TAG; // ... format, font etc. usernameButton.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleHeight; [cell.contentView addSubview:usernameButton]; mainLabel = [[[UILabel alloc] initWithFrame:CGRectMake(0.0, 20.0, 220.0, 15.0)] autorelease]; mainLabel.tag = MAINLABEL_TAG; // ... format, font etc. mainLabel.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleHeight; [cell.contentView addSubview:mainLabel]; secondLabel = [[[UILabel alloc] initWithFrame:CGRectMake(0.0, 40.0, 220.0, 15.0)] autorelease]; secondLabel.tag = SECONDLABEL_TAG; // ... format, font etc. secondLabel.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleHeight; [cell.contentView addSubview:secondLabel]; } else { usernameButton = (UIButton *) [cell.contentView viewWithTag:USERNAME_BUTTON_TAG]; mainLabel = (UILabel *)[cell.contentView viewWithTag:MAINLABEL_TAG]; secondLabel = (UILabel *)[cell.contentView viewWithTag:SECONDLABEL_TAG]; } usernameButton.titleLabel.text = @"Peter"; mainLabel.text = @"sent you a message: ..."; secondLabel.text = @"11 minutes ago"; return cell; In a nutshell, I want to add the labels and buttons without a fix position or size, the buttons clickable and the cell height should automatically set according to the content. Here is an example of the cell's content: Peter sent you a message: "Hello! What are you doing?" Peter should be click/tab-able and his message, which has a variable length, should be italic and wrapped if necessary.

Read the article

highlight navigation PHP

- by Kira

I've launched a website a while back and successfully used Javascript + CSS to highlight the current page on the navigation. However, it is not working in Safari and it does not validate well, when using Javascript, so I decided to have PHP assign the CSS id to the HTML elements. So far, it works fine, compared to the other times where there was two of each link displayed, when it was attempted in PHP. My problem is that all links look normal and the CSS property is not applied. I have a feeling that it has to do with my PHP code, but I'm not certain. The site address is here As for the PHP code, here it is: <?php echo('<li><span class="bold">Main</span>'); echo('<ul>'); if ($page=="home") { echo('<li><a id="current" href="index.shtml">Home</a></li>'); } else { echo('<li><a href="index.shtml">Home</a></li>'); } if ($page=="faq") { echo('<li><a id="current" href="faq.shtml">FAQ</a></li>'); } else { echo('<li><a href="faq.shtml">FAQ</a></li>'); } if ($page=="about") { echo('<li><a id="current" href="about.shtml">About Bryce</a></li>'); } else { echo('<li><a href="about.shtml">About Bryce</a></li>'); } echo('<li><a href="contact.php">Contact Bryce</a></li>'); if ($page=="sign guestbook") { echo('<li><a id="current" href="sign.shtml">Sign Guestbook</a></li>'); } else { echo('<li><a href="sign.shtml">Sign Guestbook</a></li>'); } if ($page=="view guestbook") { echo('<li><a id="current" href="view.shtml">View Guestbook</a></li>'); } else { echo('<li><a href="view.shtml">View Guestbook</a></li>'); } echo('</ul>'); echo('</li>'); echo('<li><span class="bold">Info</span>'); echo('<ul>'); if ($page=="projects") { echo('<li><a id="current" href="projects.shtml">Projects</a></li>'); } else { echo('<li><a href="projects.shtml">Projects</a></li>'); } if ($page=="books") { echo('<li><a id="current" href="books.shtml">Books</a></li>'); } else { echo('<li><a href="books.shtml">Books</a></li>'); } echo('</ul>'); echo('</li>'); echo('<li><span class="bold">Misc.</span>'); echo('<ul>'); if ($page=="cover designs") { echo('<li><a id="current" href="coverdesigns.shtml">Cover Designs</a></li>'); } else { echo('<li><a href="coverdesigns.shtml">Cover Designs</a></li>'); } echo('<li><a target="_blank" href="http://www.lulu.com/brycecampbellsbooks">Lulu Store</a></li>'); echo('<li><a href="rss/">RSS</a></li>'); echo('</ul>'); echo('</li>'); ?> In order to give you guys an idea of what the highlighting effect should look like, here is the CSS that is supposed to be applied to the current page: #current { font-style: italic; text-decoration: none; color: #000000; } When looking up what I was doing wrong, it told me that I was implementing it right, but it does not seem that the PHP is getting the values.

Read the article

innter.HTML not working after submit button is clicked

- by user1781453

I am trying to get the innerHTML to change to what is in the end of the function "calculate" but nothing happens once I hit submit. Here is my code: Pizza Order Form .outp {border-style:solid;background-color:white; border-color:red;padding:1em; border-width: .5em;} .notes {font-size:smaller;font-style:italic;} p {margin-left: 15%; width: 65%;} textarea {resize : none;} </style> function calculate(){ var type; var newline=""; var sum=0; var toppings=""; if( document.getElementById("small").checked==true){ type="Small Pizza"; sum+=4; } if( document.getElementById("medium").checked==true){ type="Medium Pizza"; sum+=6; } if( document.getElementById("large").checked==true){ type="Large Pizza"; sum+=8; } if( document.getElementById("pepperoni").checked==true){ toppings=toppings+"pepperoni, "; sum+=0.75; } if( document.getElementById("olives").checked==true){ toppings=toppings+"olives, "; sum+=0.6; } if( document.getElementById("sausage").checked==true){ toppings=toppings+"sausage, "; sum+=0.75; } if( document.getElementById("peppers").checked==true){ toppings=toppings+"peppers, "; sum+=0.5; } if( document.getElementById("onions").checked==true){ toppings=toppings+"onions, "; sum+=0.5; } if( document.getElementById("cheese").checked==true){ toppings=toppings+"Cheese Only, "; } var length = toppings.length; toppings = toppings.slice(0,length-2); document.getElementById("opta").innerHTML = type+newline+"Toppings:"+newline+toppings+newline+"Price - $"+sum; } Joe's Pizza Palace On-line Order Form <p id = "op" class = "outp" > <b /> Select the size Pizza you want:    <input type="radio" name = "size" id="small" value = "small"> Small - $4.00 <b /> <input type="radio" name = "size" id="medium" value = "medium"> Medium - $6.00 <b /> <input type="radio" name = "size" id="large" value = "large"> Large - $8.00 <b /> </p> <p id = "op1" class = "outp" > <b /> Select the toppings:    <input type="checkbox" name = "size" id="pepperoni" value = "pepperoni"> Pepperoni ($0.75) <b /> <input type="checkbox" name = "size" id="olives" value = "olives"> Olives ($0.60) <b /> <input type="checkbox" name = "size" id="sausage" value = "sausage"> Sausage ($0.75) <b /> <br /> <input type="checkbox" name = "size" id="peppers" value = "peppers"> Peppers ($0.50) <b /> <input type="checkbox" name = "size" id="onions" value = "onions"> Onions ($0.50) <b /> <input type="checkbox" name = "size" id="cheese" value = "cheese"> Cheese Only <b /> To obtain the price of your order click on the price button below: <br /><br /> <input type="button" align = "left" onclick="calculate();" value="Price (Submit Button)"/> <input type="reset" align = "left" value="Clear Form"/> <br /><br /> <textarea class="outp3" id="opta" style="border-color:black;" rows="6" cols="40" > </textarea>

Read the article

jQuery hold form submit until "continue" button pressed

- by Seán McCabe

I am trying to submit a form, which I have had working, but have now modified it to include a modal jQuery UI box, so that it won't submit until the user presses "continue". I've had various problems with this, including getting the form to hold until that button is pressed, but I think I have found a solution to that, but implementing it, I am getting a SyntaxError which I can't find the source of. With the help of kevin B managed to find the answer was the form was submitting, but the returned JSON response wasn't quite formatted right. The response was that the form wasn't being submitted, so that problem is still occurring. So updated the code with the provided feedback, now need to find out why the form isnt submitting. I know its something to do with the 2nd function isnt recognising the submit button has been pressed, so need to know how to submit that form data without the form needing to be submitted again. Below is the new code: function submitData() { $("#submitProvData").submit(function(event) { event.preventDefault(); var gTotal, sTotal, dfd; var dfd = new $.Deferred(); $('html,body').animate({ scrollTop: 0 }, 'fast'); $("#submitProvData input").css("border", "1px solid #aaaaaa"); $("#submitProvData input[readonly='readonly']").css("border", "none"); sTotal = $('#summaryTotal').val(); gTotal = $('#gptotal').val(); if(gTotal !== 'sTotal'){ $("#newsupinvbox").append('<div id="newsupinvdiagbox" title="Warning - Totals do not match" class="hidden"><p>Press "Continue", to submit the invoice flagged for attention.</p> <br /><p class="italic">or</p><br /> <p>Press "Correct" to correct the discrepancy.</p></div>') //CREATE DIV //SET $("#newsupinvdiagbox").dialog({ resizable: false, autoOpen:false, modal: true, draggable: false, width:380, height:240, closeOnEscape: false, position: ['center',20], buttons: { 'Continue': function() { $(this).dialog('close'); reData(); }, // end continue button 'Correct': function() { $(this).dialog('close'); return false; } //end cancel button }//end buttons });//end dialog $('#newsupinvdiagbox').dialog('open'); } return false; }); } function reData() { console.log('submitted'); $("#submitProvData").submit(function(resubmit){ console.log('form submit'); var formData; formData = new FormData($(this)[0]); $.ajax({ type: "POST", url: "functions/invoicing_upload_provider.php", data: formData, async: false, success: function(result) { $.each($.parseJSON(result), function(item, value){ if(item == 'Success'){ $('#newsupinv_window_message_success_mes').html('The provider invoice was uploaded successfully.'); $('#newsupinv_window_message_success').fadeIn(300, function (){ reset(); }).delay(2500).fadeOut(700); } else if(item == 'Error'){ $('#newsupinv_window_message_error_mes').html(value); $('#newsupinv_window_message_error').fadeIn(300).delay(3000).fadeOut(700); } else if(item == 'Warning'){ $('#newsupinv_window_message_warning_mes').html(value); $('#newsupinv_window_message_warning').fadeIn(300, function (){ reset(); }).delay(2500).fadeOut(700); } }); }, error: function() { $('#newsupinv_window_message_error_mes').html("An error occured, the form was not submitted"); $('#newsupinv_window_message_error').fadeIn(300); $('#newsupinv_window_message_error').delay(3000).fadeOut(700); }, cache: false, contentType: false, processData: false }); }); }

Read the article

Paperclip: "missing" image when uses has_one

- by EricR

I'm working on a website that allows people who run bed and breakfast businesses to post their accommodations. I would like to require that they include a "profile image" of the accommodation when they post it, but I also want to give them the option to add more images later (this will be developed after). I thought the best thing to do would be to use the Paperclip gem and have a Accommodation and a Photo in my application, the later belonging to the first as an association. A new Photo record is created when they create an Accommodation. It has both id and accommodation_id attributes. However, the image is never uploaded and none of the Paperclip attributes get set (image_file_name: nil, image_content_type: nil, image_file_size: nil), so I get Paperclip's "missing" photo. Any ideas on this one? It's been keeping me stuck for a few days now. Accommodation models/accommodation.rb class Accommodation < ActiveRecord::Base validates_presence_of :title, :description, :photo, :thing, :location attr_accessible :title, :description, :thing, :borough, :location, :spaces, :price has_one :photo end controllers/accommodation_controller.erb class AccommodationsController < ApplicationController before_filter :login_required, :only => {:new, :edit} uses_tiny_mce ( :options => { :theme => 'advanced', :theme_advanced_toolbar_location => 'top', :theme_advanced_toolbar_align => 'left', :theme_advanced_buttons1 => 'bold,italic,underline,bullist,numlist,separator,undo,redo', :theme_advanced_buttons2 => '', :theme_advanced_buttons3 => '' }) def index @accommodations = Accommodation.all end def show @accommodation = Accommodation.find(params[:id]) end def new @accommodation = Accommodation.new end def create @accommodation = Accommodation.new(params[:accommodation]) @accommodation.photo = Photo.new(params[:photo]) @accommodation.user_id = current_user.id if @accommodation.save flash[:notice] = "Successfully created your accommodation." render :action => 'show' else render :action => 'new' end end def edit @accommodation = Accommodation.find(params[:id]) end def update @accommodation = Accommodation.find(params[:id]) if @accommodation.update_attributes(params[:accommodation]) flash[:notice] = "Successfully updated accommodation." render :action => 'show' else render :action => 'edit' end end def destroy @accommodation = Accommodation.find(params[:id]) @accommodation.destroy flash[:notice] = "Successfully destroyed accommodation." redirect_to :inkeep end private def check_owner end end views/accommodations/_form.html.erb <%= form_for @accommodation, :html => {:multipart => true} do |f| %> <%= f.error_messages %> <p> Title<br /> <%= f.text_field :title, :size => 60 %> </p> <p> Description<br /> <%= f.text_area :description, :rows => 17, :cols => 75, :class => "mceEditor" %> </p> <p> Photo<br /> <%= f.file_field :photo %> </p> [... snip ...] <p><%= f.submit %></p> <% end %> Photo The controller and views are still the same as when Rails generated them. models/photo.erb class Photo < ActiveRecord::Base attr_accessible :image_file_name, :image_content_type, :image_file_size belongs_to :accommodation has_attached_file :image, :styles => { :thumb=> "100x100#", :small => "150x150>" } end

Read the article

Element.appendChild() hosed in IE .. workaround? (related to innerText vs textContent)

- by Rowe Morehouse

I've heard that using el.innerText||el.textContent can yield unreliable cross-browswer results, so I'm walking the DOM tree to collect text nodes recursively, and write them into tags in the HTML body. What this script does is read hash substring valus from the window.location and write them into the HTML. This script is working for me in Chrome & Firefox, but choking in IE. I call the page with an URL syntax like this: http://example.com/pagename.html#dyntext=FOO&dynterm=BAR&dynimage=FRED UPDATE UPDATE UPDATE Solution: I moved the scripts to before </body> (where they should have been) then removed console.log(sPageURL); and now it's working in Chrome, Firefox, IE8 and IE9. This my workaround for the innerText vs textContent crossbrowser issue when you are just placing text rather than getting text. In this case, getting hash substring values from the window.location and writing them into the page. <html> <body> <span id="dyntext-span" style="font-weight: bold;"></span><br /> <span id="dynterm-span" style="font-style: italic;"></span><br /> <span id="dynimage-span" style="text-decoration: underline;"></span><br /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script> <script> $(document).ready(function() { var tags = ["dyntext", "dynterm", "dynimage"]; for (var i = 0; i < tags.length; ++i) { var param = GetURLParameter(tags[i]); if (param) { var dyntext = GetURLParameter('dyntext'); var dynterm = GetURLParameter('dynterm'); var dynimage = GetURLParameter('dynimage'); } } var elem = document.getElementById("dyntext-span"); var text = document.createTextNode(dyntext); elem.appendChild(text); var elem = document.getElementById("dynterm-span"); var text = document.createTextNode(dynterm); elem.appendChild(text); var elem = document.getElementById("dynimage-span"); var text = document.createTextNode(dynimage); elem.appendChild(text); }); function GetURLParameter(sParam) { var sPageURL = window.location.hash.substring(1); var sURLVariables = sPageURL.split('&'); for (var i = 0; i < sURLVariables.length; i++) { var sParameterName = sURLVariables[i].split('='); if (sParameterName[0] == sParam) { return sParameterName[1]; } } } </script> </body> </html> FINAL UPDATE If your hash substring values require spaces (like a linguistic phrase with three words, for example) then separate the words with the + character in your URI, and replace the unicode \u002B character with a space when you create each text node, like this: var elem = document.getElementById("dyntext-span"); var text = document.createTextNode(dyntext.replace(/\u002B/g, " ")); elem.appendChild(text); var elem = document.getElementById("dynterm-span"); var text = document.createTextNode(dynterm.replace(/\u002B/g, " ")); elem.appendChild(text); var elem = document.getElementById("dynimage-span"); var text = document.createTextNode(dynimage.replace(/\u002B/g, " ")); elem.appendChild(text); Now form your URI like this: http://example.com/pagename.html#dyntext=FOO+MAN+CHU&dynterm=BAR+HOPPING&dynimage=FRED+IS+DEAD

Read the article

displaying search results of more than one word

- by fusion

in my search form, if the user types 'good', it displays all the results which contain the keyword 'good'. however if the user types in 'good sweetest', it displays no results because there is no record with the two words appearing together; BUT appearing in an entry at different places. for example, the record says: A good action is an ever-remaining store and a pure yield the user types in 'good', it will show up this record, but if the user types in 'good' + 'pure', it will not show anything. or if the record contains the keyword 'good-deeds' and if the user types in 'good deeds' without the hyphen, it will not show anything. what i would like is that if the user types in 'good' + 'pure' or 'good deeds' it should records containing these keywords highlighting them. search.php code: $search_result = ""; $search_result = $_POST["q"]; $search_result = trim($search_result); //Check if the string is empty if ($search_result == "") { echo "<p class='error'>Search Error. Please Enter Your Search Query.</p>" ; exit(); } if ($search_result == "%" || $search_result == "_" || $search_result == "+" ) { echo "<p class='error1'>Search Error. Please Enter a Valid Search Query.</p>" ; exit(); } $result = mysql_query('SELECT cQuotes, vAuthor, cArabic, vReference FROM thquotes WHERE cQuotes LIKE "%' . mysql_real_escape_string($search_result) .'%" ORDER BY idQuotes DESC', $conn) or die ('Error: '.mysql_error()); function h($s) { echo htmlspecialchars($s, ENT_QUOTES); } function highlightWords($string, $word) { $string = preg_replace("/".preg_quote($word, "/")."/i", "<span class='highlight'>$0</span>", $string); /*** return the highlighted string ***/ return $string; } ?> <div class="caption">Search Results</div> <div class="center_div"> <table> <?php while ($row= mysql_fetch_array($result, MYSQL_ASSOC)) { $cQuote = highlightWords(htmlspecialchars($row['cQuotes']), $search_result); ?> <tr> <td style="text-align:right; font-size:18px;"><?php h($row['cArabic']); ?></td> <td style="font-size:16px;"><?php echo $cQuote; ?></td> <td style="font-size:12px;"><?php h($row['vAuthor']); ?></td> <td style="font-size:12px; font-style:italic; text-align:right;"><?php h($row['vReference']); ?></td> </tr> <?php } ?> </table> </div> search.html: <form name="myform" class="wrapper"> <input type="text" name="q" onkeyup="showUser()" class="txt_search"/> <input type="button" name="button" onclick="showUser()" class="button"/> <p> <div id="txtHint"></div> </form>

Read the article

displaying search results with two or more queries

- by fusion

in my search form, if the user types 'good', it displays all the results which contain the keyword 'good'. however if the user types in 'good sweetest', it displays no results because there is no record with the two words appearing together; BUT appearing in an entry at different places. for example, the record says: A good action is an ever-remaining store and a pure yield the user types in 'good', it will show up this record, but if the user types in 'good' + 'pure', it will not show anything. what i would like is that if the user types in 'good' + 'pure' it should records containing these keywords highlighting them. search.php code: $search_result = ""; $search_result = $_POST["q"]; $search_result = trim($search_result); //Check if the string is empty if ($search_result == "") { echo "<p class='error'>Search Error. Please Enter Your Search Query.</p>" ; exit(); } if ($search_result == "%" || $search_result == "_" || $search_result == "+" ) { echo "<p class='error1'>Search Error. Please Enter a Valid Search Query.</p>" ; exit(); } $result = mysql_query('SELECT cQuotes, vAuthor, cArabic, vReference FROM thquotes WHERE cQuotes LIKE "%' . mysql_real_escape_string($search_result) .'%" ORDER BY idQuotes DESC', $conn) or die ('Error: '.mysql_error()); function h($s) { echo htmlspecialchars($s, ENT_QUOTES); } function highlightWords($string, $word) { $string = preg_replace("/".preg_quote($word, "/")."/i", "<span class='highlight'>$0</span>", $string); /*** return the highlighted string ***/ return $string; } ?> <div class="caption">Search Results</div> <div class="center_div"> <table> <?php while ($row= mysql_fetch_array($result, MYSQL_ASSOC)) { $cQuote = highlightWords(htmlspecialchars($row['cQuotes']), $search_result); ?> <tr> <td style="text-align:right; font-size:18px;"><?php h($row['cArabic']); ?></td> <td style="font-size:16px;"><?php echo $cQuote; ?></td> <td style="font-size:12px;"><?php h($row['vAuthor']); ?></td> <td style="font-size:12px; font-style:italic; text-align:right;"><?php h($row['vReference']); ?></td> </tr> <?php } ?> </table> </div> search.html: <form name="myform" class="wrapper"> <input type="text" name="q" onkeyup="showUser()" class="txt_search"/> <input type="button" name="button" onclick="showUser()" class="button"/> <p> <div id="txtHint"></div> </form>

Read the article

jQuery - Stucked Animation

- by v1n_vampire

I'm kind of tired with Javascript long script for animation and decide to try jQuery, but it seems I'm stuck even at the simplest code. CSS: #menu {float: right; font: italic 16px/16px Verdana, Geneva, sans-serif;} ul#nav {list-style: none;} ul#nav li {float: left; padding-right: 10px;} ul#nav li a {color: white;} ul#subnav {float: right; list-style: none; padding: 0; display: none;} ul#subnav li {float: left; padding: 10px 5px; white-space: nowrap;} ul#subnav li a {color: white;} Script: $(document).ready(function() { $('.nav').hover(function() { $(this).find('#subnav').stop().animate({width:'toggle'},350); }); }); HTML: <div id="menu"> <ul id="nav"> <li class="nav"> <a href="#"><img src="images/icon-home.png" width="36" height="36"/></a> <ul id="subnav"> <li><a href="#">Home</a></li> </ul> </li> <li class="nav"> <a href="#"><img src="images/icon-signin.png" width="36" height="36"/></a> <ul id="subnav"> <li><a href="#">Sign In</a></li> </ul> </li> <li class="nav"> <a href="#"><img src="images/icon-register.png" width="36" height="36"/></a> <ul id="subnav"> <li><a href="#">Create Account</a></li> </ul> </li> <li class="nav" style="padding-right: 0;"> <a href="#"><img src="images/icon-mail.png" width="36" height="36"/></a> <ul id="subnav"> <li style="padding-right: 0;"><a href="#">Contact Us</a></li> </ul> </li> </ul> </div> Here's the sample page: http://v1n-vampire.com/dev/jq-animation-stuck If you continue to hover on the nav from left to right then back to left, eventually the animation will stuck. How to solve this? Thank you in advance.

Read the article

Inheritance Mapping Strategies with Entity Framework Code First CTP5 Part 1: Table per Hierarchy (TPH)

- by mortezam

A simple strategy for mapping classes to database tables might be “one table for every entity persistent class.” This approach sounds simple enough and, indeed, works well until we encounter inheritance. Inheritance is such a visible structural mismatch between the object-oriented and relational worlds because object-oriented systems model both “is a” and “has a” relationships. SQL-based models provide only "has a" relationships between entities; SQL database management systems don’t support type inheritance—and even when it’s available, it’s usually proprietary or incomplete. There are three different approaches to representing an inheritance hierarchy: Table per Hierarchy (TPH): Enable polymorphism by denormalizing the SQL schema, and utilize a type discriminator column that holds type information. Table per Type (TPT): Represent "is a" (inheritance) relationships as "has a" (foreign key) relationships. Table per Concrete class (TPC): Discard polymorphism and inheritance relationships completely from the SQL schema.I will explain each of these strategies in a series of posts and this one is dedicated to TPH. In this series we'll deeply dig into each of these strategies and will learn about "why" to choose them as well as "how" to implement them. Hopefully it will give you a better idea about which strategy to choose in a particular scenario. Inheritance Mapping with Entity Framework Code FirstAll of the inheritance mapping strategies that we discuss in this series will be implemented by EF Code First CTP5. The CTP5 build of the new EF Code First library has been released by ADO.NET team earlier this month. EF Code-First enables a pretty powerful code-centric development workflow for working with data. I’m a big fan of the EF Code First approach, and I’m pretty excited about a lot of productivity and power that it brings. When it comes to inheritance mapping, not only Code First fully supports all the strategies but also gives you ultimate flexibility to work with domain models that involves inheritance. The fluent API for inheritance mapping in CTP5 has been improved a lot and now it's more intuitive and concise in compare to CTP4. A Note For Those Who Follow Other Entity Framework ApproachesIf you are following EF's "Database First" or "Model First" approaches, I still recommend to read this series since although the implementation is Code First specific but the explanations around each of the strategies is perfectly applied to all approaches be it Code First or others. A Note For Those Who are New to Entity Framework and Code-FirstIf you choose to learn EF you've chosen well. If you choose to learn EF with Code First you've done even better. To get started, you can find a great walkthrough by Scott Guthrie here and another one by ADO.NET team here. In this post, I assume you already setup your machine to do Code First development and also that you are familiar with Code First fundamentals and basic concepts. You might also want to check out my other posts on EF Code First like Complex Types and Shared Primary Key Associations. A Top Down Development ScenarioThese posts take a top-down approach; it assumes that you’re starting with a domain model and trying to derive a new SQL schema. Therefore, we start with an existing domain model, implement it in C# and then let Code First create the database schema for us. However, the mapping strategies described are just as relevant if you’re working bottom up, starting with existing database tables. I’ll show some tricks along the way that help you dealing with nonperfect table layouts. Let’s start with the mapping of entity inheritance. -- The Domain ModelIn our domain model, we have a BillingDetail base class which is abstract (note the italic font on the UML class diagram below). We do allow various billing types and represent them as subclasses of BillingDetail class. As for now, we support CreditCard and BankAccount: Implement the Object Model with Code First As always, we start with the POCO classes. Note that in our DbContext, I only define one DbSet for the base class which is BillingDetail. Code First will find the other classes in the hierarchy based on Reachability Convention. public abstract class BillingDetail { public int BillingDetailId { get; set; } public string Owner { get; set; } public string Number { get; set; } } public class BankAccount : BillingDetail { public string BankName { get; set; } public string Swift { get; set; } } public class CreditCard : BillingDetail { public int CardType { get; set; } public string ExpiryMonth { get; set; } public string ExpiryYear { get; set; } } public class InheritanceMappingContext : DbContext { public DbSet<BillingDetail> BillingDetails { get; set; } } This object model is all that is needed to enable inheritance with Code First. If you put this in your application you would be able to immediately start working with the database and do CRUD operations. Before going into details about how EF Code First maps this object model to the database, we need to learn about one of the core concepts of inheritance mapping: polymorphic and non-polymorphic queries. Polymorphic Queries LINQ to Entities and EntitySQL, as object-oriented query languages, both support polymorphic queries—that is, queries for instances of a class and all instances of its subclasses, respectively. For example, consider the following query: IQueryable<BillingDetail> linqQuery = from b in context.BillingDetails select b; List<BillingDetail> billingDetails = linqQuery.ToList(); Or the same query in EntitySQL: string eSqlQuery = @"SELECT VAlUE b FROM BillingDetails AS b"; ObjectQuery<BillingDetail> objectQuery = ((IObjectContextAdapter)context).ObjectContext .CreateQuery<BillingDetail>(eSqlQuery); List<BillingDetail> billingDetails = objectQuery.ToList(); linqQuery and eSqlQuery are both polymorphic and return a list of objects of the type BillingDetail, which is an abstract class but the actual concrete objects in the list are of the subtypes of BillingDetail: CreditCard and BankAccount. Non-polymorphic QueriesAll LINQ to Entities and EntitySQL queries are polymorphic which return not only instances of the specific entity class to which it refers, but all subclasses of that class as well. On the other hand, Non-polymorphic queries are queries whose polymorphism is restricted and only returns instances of a particular subclass. In LINQ to Entities, this can be specified by using OfType<T>() Method. For example, the following query returns only instances of BankAccount: IQueryable<BankAccount> query = from b in context.BillingDetails.OfType<BankAccount>() select b; EntitySQL has OFTYPE operator that does the same thing: string eSqlQuery = @"SELECT VAlUE b FROM OFTYPE(BillingDetails, Model.BankAccount) AS b"; In fact, the above query with OFTYPE operator is a short form of the following query expression that uses TREAT and IS OF operators: string eSqlQuery = @"SELECT VAlUE TREAT(b as Model.BankAccount) FROM BillingDetails AS b WHERE b IS OF(Model.BankAccount)"; (Note that in the above query, Model.BankAccount is the fully qualified name for BankAccount class. You need to change "Model" with your own namespace name.) Table per Class Hierarchy (TPH)An entire class hierarchy can be mapped to a single table. This table includes columns for all properties of all classes in the hierarchy. The concrete subclass represented by a particular row is identified by the value of a type discriminator column. You don’t have to do anything special in Code First to enable TPH. It's the default inheritance mapping strategy: This mapping strategy is a winner in terms of both performance and simplicity. It’s the best-performing way to represent polymorphism—both polymorphic and nonpolymorphic queries perform well—and it’s even easy to implement by hand. Ad-hoc reporting is possible without complex joins or unions. Schema evolution is straightforward. Discriminator Column As you can see in the DB schema above, Code First has to add a special column to distinguish between persistent classes: the discriminator. This isn’t a property of the persistent class in our object model; it’s used internally by EF Code First. By default, the column name is "Discriminator", and its type is string. The values defaults to the persistent class names —in this case, “BankAccount” or “CreditCard”. EF Code First automatically sets and retrieves the discriminator values. TPH Requires Properties in SubClasses to be Nullable in the Database TPH has one major problem: Columns for properties declared by subclasses will be nullable in the database. For example, Code First created an (INT, NULL) column to map CardType property in CreditCard class. However, in a typical mapping scenario, Code First always creates an (INT, NOT NULL) column in the database for an int property in persistent class. But in this case, since BankAccount instance won’t have a CardType property, the CardType field must be NULL for that row so Code First creates an (INT, NULL) instead. If your subclasses each define several non-nullable properties, the loss of NOT NULL constraints may be a serious problem from the point of view of data integrity. TPH Violates the Third Normal FormAnother important issue is normalization. We’ve created functional dependencies between nonkey columns, violating the third normal form. Basically, the value of Discriminator column determines the corresponding values of the columns that belong to the subclasses (e.g. BankName) but Discriminator is not part of the primary key for the table. As always, denormalization for performance can be misleading, because it sacrifices long-term stability, maintainability, and the integrity of data for immediate gains that may be also achieved by proper optimization of the SQL execution plans (in other words, ask your DBA). Generated SQL QueryLet's take a look at the SQL statements that EF Code First sends to the database when we write queries in LINQ to Entities or EntitySQL. For example, the polymorphic query for BillingDetails that you saw, generates the following SQL statement: SELECT [Extent1].[Discriminator] AS [Discriminator], [Extent1].[BillingDetailId] AS [BillingDetailId], [Extent1].[Owner] AS [Owner], [Extent1].[Number] AS [Number], [Extent1].[BankName] AS [BankName], [Extent1].[Swift] AS [Swift], [Extent1].[CardType] AS [CardType], [Extent1].[ExpiryMonth] AS [ExpiryMonth], [Extent1].[ExpiryYear] AS [ExpiryYear] FROM [dbo].[BillingDetails] AS [Extent1] WHERE [Extent1].[Discriminator] IN ('BankAccount','CreditCard') Or the non-polymorphic query for the BankAccount subclass generates this SQL statement: SELECT [Extent1].[BillingDetailId] AS [BillingDetailId], [Extent1].[Owner] AS [Owner], [Extent1].[Number] AS [Number], [Extent1].[BankName] AS [BankName], [Extent1].[Swift] AS [Swift] FROM [dbo].[BillingDetails] AS [Extent1] WHERE [Extent1].[Discriminator] = 'BankAccount' Note how Code First adds a restriction on the discriminator column and also how it only selects those columns that belong to BankAccount entity. Change Discriminator Column Data Type and Values With Fluent API Sometimes, especially in legacy schemas, you need to override the conventions for the discriminator column so that Code First can work with the schema. The following fluent API code will change the discriminator column name to "BillingDetailType" and the values to "BA" and "CC" for BankAccount and CreditCard respectively: protected override void OnModelCreating(System.Data.Entity.ModelConfiguration.ModelBuilder modelBuilder) { modelBuilder.Entity<BillingDetail>() .Map<BankAccount>(m => m.Requires("BillingDetailType").HasValue("BA")) .Map<CreditCard>(m => m.Requires("BillingDetailType").HasValue("CC")); } Also, changing the data type of discriminator column is interesting. In the above code, we passed strings to HasValue method but this method has been defined to accepts a type of object: public void HasValue(object value); Therefore, if for example we pass a value of type int to it then Code First not only use our desired values (i.e. 1 & 2) in the discriminator column but also changes the column type to be (INT, NOT NULL): modelBuilder.Entity<BillingDetail>() .Map<BankAccount>(m => m.Requires("BillingDetailType").HasValue(1)) .Map<CreditCard>(m => m.Requires("BillingDetailType").HasValue(2)); SummaryIn this post we learned about Table per Hierarchy as the default mapping strategy in Code First. The disadvantages of the TPH strategy may be too serious for your design—after all, denormalized schemas can become a major burden in the long run. Your DBA may not like it at all. In the next post, we will learn about Table per Type (TPT) strategy that doesn’t expose you to this problem. References ADO.NET team blog Java Persistence with Hibernate book a { text-decoration: none; } a:visited { color: Blue; } .title { padding-bottom: 5px; font-family: Segoe UI; font-size: 11pt; font-weight: bold; padding-top: 15px; } .code, .typeName { font-family: consolas; } .typeName { color: #2b91af; } .padTop5 { padding-top: 5px; } .padTop10 { padding-top: 10px; } p.MsoNormal { margin-top: 0in; margin-right: 0in; margin-bottom: 10.0pt; margin-left: 0in; line-height: 115%; font-size: 11.0pt; font-family: "Calibri" , "sans-serif"; }

Read the article

Inheritance Mapping Strategies with Entity Framework Code First CTP5: Part 3 – Table per Concrete Type (TPC) and Choosing Strategy Guidelines

- by mortezam

This is the third (and last) post in a series that explains different approaches to map an inheritance hierarchy with EF Code First. I've described these strategies in previous posts: Part 1 – Table per Hierarchy (TPH) Part 2 – Table per Type (TPT)In today’s blog post I am going to discuss Table per Concrete Type (TPC) which completes the inheritance mapping strategies supported by EF Code First. At the end of this post I will provide some guidelines to choose an inheritance strategy mainly based on what we've learned in this series. TPC and Entity Framework in the Past Table per Concrete type is somehow the simplest approach suggested, yet using TPC with EF is one of those concepts that has not been covered very well so far and I've seen in some resources that it was even discouraged. The reason for that is just because Entity Data Model Designer in VS2010 doesn't support TPC (even though the EF runtime does). That basically means if you are following EF's Database-First or Model-First approaches then configuring TPC requires manually writing XML in the EDMX file which is not considered to be a fun practice. Well, no more. You'll see that with Code First, creating TPC is perfectly possible with fluent API just like other strategies and you don't need to avoid TPC due to the lack of designer support as you would probably do in other EF approaches. Table per Concrete Type (TPC)In Table per Concrete type (aka Table per Concrete class) we use exactly one table for each (nonabstract) class. All properties of a class, including inherited properties, can be mapped to columns of this table, as shown in the following figure: As you can see, the SQL schema is not aware of the inheritance; effectively, we’ve mapped two unrelated tables to a more expressive class structure. If the base class was concrete, then an additional table would be needed to hold instances of that class. I have to emphasize that there is no relationship between the database tables, except for the fact that they share some similar columns. TPC Implementation in Code First Just like the TPT implementation, we need to specify a separate table for each of the subclasses. We also need to tell Code First that we want all of the inherited properties to be mapped as part of this table. In CTP5, there is a new helper method on EntityMappingConfiguration class called MapInheritedProperties that exactly does this for us. Here is the complete object model as well as the fluent API to create a TPC mapping: public abstract class BillingDetail { public int BillingDetailId { get; set; } public string Owner { get; set; } public string Number { get; set; } } public class BankAccount : BillingDetail { public string BankName { get; set; } public string Swift { get; set; } } public class CreditCard : BillingDetail { public int CardType { get; set; } public string ExpiryMonth { get; set; } public string ExpiryYear { get; set; } } public class InheritanceMappingContext : DbContext { public DbSet<BillingDetail> BillingDetails { get; set; } protected override void OnModelCreating(ModelBuilder modelBuilder) { modelBuilder.Entity<BankAccount>().Map(m => { m.MapInheritedProperties(); m.ToTable("BankAccounts"); }); modelBuilder.Entity<CreditCard>().Map(m => { m.MapInheritedProperties(); m.ToTable("CreditCards"); }); } } The Importance of EntityMappingConfiguration ClassAs a side note, it worth mentioning that EntityMappingConfiguration class turns out to be a key type for inheritance mapping in Code First. Here is an snapshot of this class: namespace System.Data.Entity.ModelConfiguration.Configuration.Mapping { public class EntityMappingConfiguration<TEntityType> where TEntityType : class { public ValueConditionConfiguration Requires(string discriminator); public void ToTable(string tableName); public void MapInheritedProperties(); } } As you have seen so far, we used its Requires method to customize TPH. We also used its ToTable method to create a TPT and now we are using its MapInheritedProperties along with ToTable method to create our TPC mapping. TPC Configuration is Not Done Yet!We are not quite done with our TPC configuration and there is more into this story even though the fluent API we saw perfectly created a TPC mapping for us in the database. To see why, let's start working with our object model. For example, the following code creates two new objects of BankAccount and CreditCard types and tries to add them to the database: using (var context = new InheritanceMappingContext()) { BankAccount bankAccount = new BankAccount(); CreditCard creditCard = new CreditCard() { CardType = 1 }; context.BillingDetails.Add(bankAccount); context.BillingDetails.Add(creditCard); context.SaveChanges(); } Running this code throws an InvalidOperationException with this message: The changes to the database were committed successfully, but an error occurred while updating the object context. The ObjectContext might be in an inconsistent state. Inner exception message: AcceptChanges cannot continue because the object's key values conflict with another object in the ObjectStateManager. Make sure that the key values are unique before calling AcceptChanges. The reason we got this exception is because DbContext.SaveChanges() internally invokes SaveChanges method of its internal ObjectContext. ObjectContext's SaveChanges method on its turn by default calls AcceptAllChanges after it has performed the database modifications. AcceptAllChanges method merely iterates over all entries in ObjectStateManager and invokes AcceptChanges on each of them. Since the entities are in Added state, AcceptChanges method replaces their temporary EntityKey with a regular EntityKey based on the primary key values (i.e. BillingDetailId) that come back from the database and that's where the problem occurs since both the entities have been assigned the same value for their primary key by the database (i.e. on both BillingDetailId = 1) and the problem is that ObjectStateManager cannot track objects of the same type (i.e. BillingDetail) with the same EntityKey value hence it throws. If you take a closer look at the TPC's SQL schema above, you'll see why the database generated the same values for the primary keys: the BillingDetailId column in both BankAccounts and CreditCards table has been marked as identity. How to Solve The Identity Problem in TPC As you saw, using SQL Server’s int identity columns doesn't work very well together with TPC since there will be duplicate entity keys when inserting in subclasses tables with all having the same identity seed. Therefore, to solve this, either a spread seed (where each table has its own initial seed value) will be needed, or a mechanism other than SQL Server’s int identity should be used. Some other RDBMSes have other mechanisms allowing a sequence (identity) to be shared by multiple tables, and something similar can be achieved with GUID keys in SQL Server. While using GUID keys, or int identity keys with different starting seeds will solve the problem but yet another solution would be to completely switch off identity on the primary key property. As a result, we need to take the responsibility of providing unique keys when inserting records to the database. We will go with this solution since it works regardless of which database engine is used. Switching Off Identity in Code First We can switch off identity simply by placing DatabaseGenerated attribute on the primary key property and pass DatabaseGenerationOption.None to its constructor. DatabaseGenerated attribute is a new data annotation which has been added to System.ComponentModel.DataAnnotations namespace in CTP5: public abstract class BillingDetail { [DatabaseGenerated(DatabaseGenerationOption.None)] public int BillingDetailId { get; set; } public string Owner { get; set; } public string Number { get; set; } } As always, we can achieve the same result by using fluent API, if you prefer that: modelBuilder.Entity<BillingDetail>() .Property(p => p.BillingDetailId) .HasDatabaseGenerationOption(DatabaseGenerationOption.None); Working With The Object Model Our TPC mapping is ready and we can try adding new records to the database. But, like I said, now we need to take care of providing unique keys when creating new objects: using (var context = new InheritanceMappingContext()) { BankAccount bankAccount = new BankAccount() { BillingDetailId = 1 }; CreditCard creditCard = new CreditCard() { BillingDetailId = 2, CardType = 1 }; context.BillingDetails.Add(bankAccount); context.BillingDetails.Add(creditCard); context.SaveChanges(); } Polymorphic Associations with TPC is Problematic The main problem with this approach is that it doesn’t support Polymorphic Associations very well. After all, in the database, associations are represented as foreign key relationships and in TPC, the subclasses are all mapped to different tables so a polymorphic association to their base class (abstract BillingDetail in our example) cannot be represented as a simple foreign key relationship. For example, consider the the domain model we introduced here where User has a polymorphic association with BillingDetail. This would be problematic in our TPC Schema, because if User has a many-to-one relationship with BillingDetail, the Users table would need a single foreign key column, which would have to refer both concrete subclass tables. This isn’t possible with regular foreign key constraints. Schema Evolution with TPC is Complex A further conceptual problem with this mapping strategy is that several different columns, of different tables, share exactly the same semantics. This makes schema evolution more complex. For example, a change to a base class property results in changes to multiple columns. It also makes it much more difficult to implement database integrity constraints that apply to all subclasses. Generated SQLLet's examine SQL output for polymorphic queries in TPC mapping. For example, consider this polymorphic query for all BillingDetails and the resulting SQL statements that being executed in the database: var query = from b in context.BillingDetails select b; Just like the SQL query generated by TPT mapping, the CASE statements that you see in the beginning of the query is merely to ensure columns that are irrelevant for a particular row have NULL values in the returning flattened table. (e.g. BankName for a row that represents a CreditCard type). TPC's SQL Queries are Union Based As you can see in the above screenshot, the first SELECT uses a FROM-clause subquery (which is selected with a red rectangle) to retrieve all instances of BillingDetails from all concrete class tables. The tables are combined with a UNION operator, and a literal (in this case, 0 and 1) is inserted into the intermediate result; (look at the lines highlighted in yellow.) EF reads this to instantiate the correct class given the data from a particular row. A union requires that the queries that are combined, project over the same columns; hence, EF has to pad and fill up nonexistent columns with NULL. This query will really perform well since here we can let the database optimizer find the best execution plan to combine rows from several tables. There is also no Joins involved so it has a better performance than the SQL queries generated by TPT where a Join is required between the base and subclasses tables. Choosing Strategy GuidelinesBefore we get into this discussion, I want to emphasize that there is no one single "best strategy fits all scenarios" exists. As you saw, each of the approaches have their own advantages and drawbacks. Here are some rules of thumb to identify the best strategy in a particular scenario: If you don’t require polymorphic associations or queries, lean toward TPC—in other words, if you never or rarely query for BillingDetails and you have no class that has an association to BillingDetail base class. I recommend TPC (only) for the top level of your class hierarchy, where polymorphism isn’t usually required, and when modification of the base class in the future is unlikely. If you do require polymorphic associations or queries, and subclasses declare relatively few properties (particularly if the main difference between subclasses is in their behavior), lean toward TPH. Your goal is to minimize the number of nullable columns and to convince yourself (and your DBA) that a denormalized schema won’t create problems in the long run. If you do require polymorphic associations or queries, and subclasses declare many properties (subclasses differ mainly by the data they hold), lean toward TPT. Or, depending on the width and depth of your inheritance hierarchy and the possible cost of joins versus unions, use TPC. By default, choose TPH only for simple problems. For more complex cases (or when you’re overruled by a data modeler insisting on the importance of nullability constraints and normalization), you should consider the TPT strategy. But at that point, ask yourself whether it may not be better to remodel inheritance as delegation in the object model (delegation is a way of making composition as powerful for reuse as inheritance). Complex inheritance is often best avoided for all sorts of reasons unrelated to persistence or ORM. EF acts as a buffer between the domain and relational models, but that doesn’t mean you can ignore persistence concerns when designing your classes. SummaryIn this series, we focused on one of the main structural aspect of the object/relational paradigm mismatch which is inheritance and discussed how EF solve this problem as an ORM solution. We learned about the three well-known inheritance mapping strategies and their implementations in EF Code First. Hopefully it gives you a better insight about the mapping of inheritance hierarchies as well as choosing the best strategy for your particular scenario. Happy New Year and Happy Code-Firsting! References ADO.NET team blog Java Persistence with Hibernate book a { color: #5A99FF; } a:visited { color: #5A99FF; } .title { padding-bottom: 5px; font-family: Segoe UI; font-size: 11pt; font-weight: bold; padding-top: 15px; } .code, .typeName { font-family: consolas; } .typeName { color: #2b91af; } .padTop5 { padding-top: 5px; } .padTop10 { padding-top: 10px; } .exception { background-color: #f0f0f0; font-style: italic; padding-bottom: 5px; padding-left: 5px; padding-top: 5px; padding-right: 5px; }

Read the article

jQuery Templates with ASP.NET MVC

- by hajan

In my three previous blogs, I’ve shown how to use Templates in your ASPX website. Introduction to jQuery TemplatesjQuery Templates - tmpl(), template() and tmplItem()jQuery Templates - {Supported Tags}Now, I will show one real-world example which you may use it in your daily work of developing applications with ASP.NET MVC and jQuery. In the following example I will use Pubs database so that I will retrieve values from the authors table. To access the data, I’m using Entity Framework. Let’s pass throughout each step of the scenario: 1. Create new ASP.NET MVC Web application 2. Add new View inside Home folder but do not select a master page, and add Controller for your View 3. BODY code in the HTML <body> <div> <h1>Pubs Authors</h1> <div id="authorsList"></div> </div> </body> As you can see in the body we have only one H1 tag and a div with id authorsList where we will append the data from database. 4. Now, I’ve created Pubs model which is connected to the Pub database and I’ve selected only the authors table in my EDMX model. You can use your own database. 5. Next, lets create one method of JsonResult type which will get the data from database and serialize it into JSON string. public JsonResult GetAuthors() { pubsEntities pubs = new pubsEntities(); var authors = pubs.authors.ToList(); return Json(authors, JsonRequestBehavior.AllowGet); } So, I’m creating object instance of pubsEntities and get all authors in authors list. Then returning the authors list by serializing it to JSON using Json method. The JsonRequestBehaviour.AllowGet parameter is used to make the GET requests from the client become allowed. By default in ASP.NET MVC 2 the GET is not allowed because of security issue with JSON hijacking. 6. Next, lets create jQuery AJAX function which will call the GetAuthors method. We will use $.getJSON jQuery method. <script language="javascript" type="text/javascript"> $(function () { $.getJSON("GetAuthors", "", function (data) { $("#authorsTemplate").tmpl(data).appendTo("#authorsList"); }); }); </script> Once the web page is downloaded, the method will be called. The first parameter of $.getJSON() is url string in our case the method name. The second parameter (which in the example is empty string) is the key value pairs that will be send to the server, and the third function is the callback function or the result which is going to be returned from the server. Inside the callback function we have code that renders data with template which has id #authorsTemplate and appends it to element which has #authorsList ID. 7. The jQuery Template <script id="authorsTemplate" type="text/html"> <div id="author"> ${au_lname} ${au_fname} <div id="address">${address}, ${city}</div> <div id="contractType"> {{if contract}} <font color="green">Has contract with the publishing house</font> {{else}} <font color="red">Without contract</font> {{/if}} <br /> <em> ${printMessage(state)} </em> <br /> </div> </div> </script> As you can see, I have tags containing fields (au_lname, au_fname… etc.) that corresponds to the table in the EDMX model which is the same as in the database. One more thing to note here is that I have printMessage(state) function which is called inside ${ expression/function/field } tag. The printMessage function <script language="javascript" type="text/javascript"> function printMessage(s) { if (s=="CA") return "The author is from California"; else return "The author is not from California"; } </script> So, if state is “CA” print “The author is from California” else “The author is not from California” HERE IS THE COMPLETE ASPX CODE <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>Database Example :: jQuery Templates</title> <style type="text/css"> body { font-family:Verdana,Arial,Courier New, Sans-Serif; color:Black; padding:2px, 2px, 2px, 2px; background-color:#FF9640; } #author { display:block; float:left; text-decoration:none; border:1px solid black; background-color:White; padding:20px 20px 20px 20px; margin-top:2px; margin-right:2px; font-family:Verdana; font-size:12px; width:200px; height:70px;} #address { font-style:italic; color:Blue; font-size:12px; font-family:Verdana; } .author_hover {background-color:Yellow;} </style> <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.min.js" type="text/javascript"></script> <script src="http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.js" type="text/javascript"></script> <script language="javascript" type="text/javascript"> function printMessage(s) { if (s=="CA") return "The author is from California"; else return "The author is not from California"; } </script> <script id="authorsTemplate" type="text/html"> <div id="author"> ${au_lname} ${au_fname} <div id="address">${address}, ${city}</div> <div id="contractType"> {{if contract}} <font color="green">Has contract with the publishing house</font> {{else}} <font color="red">Without contract</font> {{/if}} <br /> <em> ${printMessage(state)} </em> <br /> </div> </div> </script> <script language="javascript" type="text/javascript"> $(function () { $.getJSON("GetAuthors", "", function (data) { $("#authorsTemplate").tmpl(data).appendTo("#authorsList"); }); }); </script> </head> <body> <div id="title">Pubs Authors</div> <div id="authorsList"></div> </body> </html> So, in the complete example you also have the CSS style I’m using to stylize the output of my page. Here is print screen of the end result displayed on the web page: You can download the complete source code including examples shown in my previous blog posts about jQuery templates and PPT presentation from my last session I had in the local .NET UG meeting in the following DOWNLOAD LINK. Do let me know your feedback. Regards, Hajan

Read the article

CodePlex Daily Summary for Monday, March 12, 2012

CodePlex Daily Summary for Monday, March 12, 2012Popular ReleasesAvalonDock: AvalonDock 2.0.0345: Welcome to early alpha release of AvalonDock 2.0 I've completely rewritten AvalonDock in order to take full advantage of the MVVM pattern. New version also boost a lot of new features: 1) Deep separation between model and layout. 2) Full WPF binding support thanks to unified logical tree between main docking manager, auto-hide windows and floating windows. 3) Support for Aero semi-maximized windows feature. 4) Support for multiple panes in the same floating windows. For a short list of new f...Windows Azure PowerShell Cmdlets: Windows Azure PowerShell Cmdlets 2.2.2: Changes Added Start Menu Item for Easy Startup Added Link to Getting Started Document Added Ability to Persist Subscription Data to Disk Fixed Get-Deployment to not throw on empty slot Simplified numerous default values for cmdlets Breaking Changes: -SubscriptionName is now mandatory in Set-Subscription. -DefaultStorageAccountName and -DefaultStorageAccountKey parameters were removed from Set-Subscription. Instead, when adding multiple accounts to a subscription, each one needs to be added ...IronPython: 2.7.2: On behalf of the IronPython team, I'm happy to announce the final release IronPython 2.7.2. This release includes everything from IronPython 54498 and 62475 as well. Like all IronPython 2.7-series releases, .NET 4 is required to install it. Installing this release will replace any existing IronPython 2.7-series installation. Unlike previous releases, the assemblies for all supported platforms are included in the installer as well as the zip package, in the "Platforms" directory. IronPython 2...Kooboo CMS: Kooboo CMS 3.2.0.0: Breaking changes: When upgrade from previous versions, MUST reset the all the content type templates, otherwise the content manager might get a compile error. New features Integrate with Windows azure. See: http://wiki.kooboo.com/?wiki=Kooboo CMS on Azure Complete solution to deploy on load balance servers. See: http://wiki.kooboo.com/?wiki=Kooboo CMS load balance Update Jquery and Jquery ui to the lastest version(Jquery 1.71, Jquery UI 1.8.16). Tree style text content editing. See:h...FluentData -Micro ORM with a fluent API that makes it simple to query a database: FluentData version 2.0: New features: - Support for events: OnConnectionClosed, OnConnectionOpened, OnConnectionOpening, OnError, OnExecuted, OnExecuting - Added a CommandTimeout method on the Context. This allows you to set the time out for all the commands. - QueryValues support has been added for Stored Procedures. Changes to existing features: - IgnoreProperty has been moved from a separate property to be a parameter in the AutoMap method.Home Access Plus+: v7.10: Don't forget to add your location to the list: http://www.nbdev.co.uk/projects/hap/locations.aspx Changes: Added: CompressJS controls to the Help Desk & Booking System (reduces page size) Fixed: Debug/Release mode detection in CompressJS control Added: Older Browsers will use an iframe and the old uploadh.aspx page (works better than the current implementation on older browsers) Added: Permalinks for my files, you can give out links that redirect to the correct location when you log i...SubExtractor: Release 1026: Fix: multi-colored bluray subs will no longer result in black blob for OCR Fix: dvds with no language specified will not cause exception in name creation of subtitle files Fix: Root directory Dvds will use volume label as their directory nameExtensions for Reactive Extensions (Rxx): Rxx 1.3: Please read the latest release notes for details about what's new. Related Work Items Content SummaryRxx provides the following features. See the Documentation for details. Many IObservable<T> extension methods and IEnumerable<T> extension methods. Many wrappers that convert asynchronous Framework Class Library APIs into observables. Many useful types such as ListSubject<T>, DictionarySubject<T>, CommandSubject, ViewModel, ObservableDynamicObject, Either<TLeft, TRight>, Maybe<T>, Scala...Microsoft Ajax Minifier: Microsoft Ajax Minifier 4.47: Properly output escaped characters in CSS identifiers throw an EOF error when parsing a CSS selector that doesn't end in a declaration block chased down a stack-overflow issue with really large JS sources. Needed to flatten out the AST tree for adjacent expression statements that the application merges into a single expression statement, or that already contain large, comma-separated expressions in the original source. fix issue #17569: tie together the -debug switch with the DEBUG defi...Player Framework by Microsoft: Player Framework for Windows 8 Metro (BETA): Player Framework for HTML/JavaScript and XAML/C# Metro Style Applications.WPF Application Framework (WAF): WAF for .NET 4.5 (Experimental): Version: 2.5.0.440 (Experimental): This is an experimental release! It can be used to investigate the new .NET Framework 4.5 features. The ideas shown in this release might come in a future release (after 2.5) of the WPF Application Framework (WAF). More information can be found in this dicussion post. Requirements .NET Framework 4.5 (The package contains a solution file for Visual Studio 11) The unit test projects require Visual Studio 11 Professional Changelog All: Upgrade all proje...SSH.NET Library: 2012.3.9: There are still few outstanding issues I wanted to include in this release but since its been a while and there are few new features already I decided to create a new release now. New Features Add SOCKS4, SOCKS5 and HTTP Proxy support when connecting to remote server. For silverlight only IP address can be used for server address when using proxy. Add dynamic port forwarding support using ForwardedPortDynamic class. Add new ShellStream class to work with SSH Shell. Add supports for mu...Test Case Import Utilities for Visual Studio 2010 and Visual Studio 11 Beta: V1.2 RTM: This release (V1.2 RTM) includes: Support for connecting to Hosted Team Foundation Server Preview. Support for connecting to Team Foundation Server 11 Beta. Fix to issue with read-only attribute being set for LinksMapping-ReportFile which may have led to problems when saving the report file. Fix to issue with “related links” not being set properly in certain conditions. Fix to ensure that tool works fine when the Excel file contained rich text data. Note: Data is still imported in pl...DotNetNuke® Community Edition CMS: 06.01.04: Major Highlights Fixed issue with loading the splash page skin in the login, privacy and terms of use pages Fixed issue when searching for words with special characters in them Fixed redirection issue when the user does not have permissions to access a resource Fixed issue when clearing the cache using the ClearHostCache() function Fixed issue when displaying the site structure in the link to page feature Fixed issue when inline editing the title of modules Fixed issue with ...Mayhem: Mayhem Developer Preview: This is the developer preview of Mayhem. Enjoy!Magelia WebStore Open-source Ecommerce software: Magelia WebStore 1.2: Medium trust compliant lot of small change for medium trust compliance full refactoring of user management refactoring of Client Refactoring of user management Magelia.WebStore.Client no longer reference Magelia.WebStore.Services.Contract Refactoring page category multi parent category added copy category feature added Refactoring page catalog copy catalog feature added variant management improvement ability to define a default variant for a variable product ability to ord...PDFsharp - A .NET library for processing PDF: PDFsharp and MigraDoc Foundation 1.32: PDFsharp and MigraDoc Foundation 1.32 is a stable version that fixes a few bugs that were found with version 1.31. Version 1.32 includes solutions for Visual Studio 2010 only (but it should be possible to add the project files to existing solutions for VS 2005 or VS 2008). Users of VS 2005 or VS 2008 can still download version 1.31 with the solutions for those versions that allow them to easily try the samples that are included. While it may create smaller PDF files than version 1.30 because...Terminals: Version 2.0 - Release: Changes since version 1.9a:New art works New usability in Organize favorites window Improved usability of imports/exports and scans Large number of fixes Improvements in single instance mode Comparing November beta 4, this corrects: New application icons Doesn't show Logon error codes Fixed command line arguments exception for single instance mode Fixed detaching of tabs improved usability in detached window Fixed option settings for Capture manager Fixed system tray noti...MFCMAPI: March 2012 Release: Build: 15.0.0.1032 Full release notes at SGriffin's blog. If you just want to run the MFCMAPI or MrMAPI, get the executables. If you want to debug them, get the symbol files and the source. The 64 bit builds will only work on a machine with Outlook 2010 64 bit installed. All other machines should use the 32 bit builds, regardless of the operating system. Facebook BadgeTortoiseHg: TortoiseHg 2.3.1: bugfix releaseNew ProjectsBurrow.NET: Burrow is a simple library created based on some EasyNetQ ideas, it's a thin wrapper of RabbitMQ.Client for .NET. Basically, if you just need to put your message or subscribe messages from RabbitMQ server, you found the right place. With Burrow.NET, you can easily customize almost everything start with exchange and queue name, changing the way to serialize your object, inject custom error handling strategies, etc.C# Base Media File Format Library: Parses ISO Base Media File Format files including QuickTime (.mov, .mp4, .m4v, .m4a), Microsoft Smooth Streaming (.ismv, .isma, .ismc), JPEG2000 (.jp2, .jpf, .jpx), Motion JPEG2000 (.mj2, .mjp2), 3GPP/3GPP2 (.3gp, .3g2) and other conforming format extensions.devtm.Aop: Aspect Oriented Programming with Mono.Cecil (on build time and runtime)Dynamics CRM 2011 Script# Xrm.Page Library: This is a Script# (scriptsharp) import library that you can use to write Dynamics CRM 2011 web resources easily and efficiently. This library provides access to all functions currently documented under MSDN Xrm.Page.EntityUI: EntityUI is basically an idea to be able to create User Interface in ASP .Net applications using Code First approcah. Flurr: Flurr is the ultimate open source API wrapper library for different social networks such as Tumblr, Twitter and more! With it, you can easily connect to social networks in your desktop or web applications, by simply importing a .dll file.GerenciadorPacotes: Gerenciador de PacotesInfo Bandung: Woyyy, Orang Bandung kita bagi2 Info yu disini, smua tentang Bandung boleh tempat makanan, tempat gaul, trend, tempat murah,,, apapun yang asik-asik :-) jstring Multilingual Class Library: jstring is a small library that provides multilingual string support. The jstring class provides programmatic support for projects that require the ability to change languages on-the-fly. Kinect: Tower Defence: Kinect: Tower Defence is a 2D tower defence game programmed in C# using the XNA Framework, played on the PC. It will make use of the Kinect hardware and motion tracking to add more fun to how the game is controlled and played.Kuick -- Application Framework: An Application Framework. Kuick Data -- ORM Framework: An ORM FrameworkMelorin Radio: This is a test project for radioNorthwind-projekt: Projekt oparty na bazie Northwindolaf: olaf makes it easier for manual qa testers to use selenium web-driver by defining their test case flows in excel spreadsheets.OpenSOCKS (Open Shared Objective Collaborative Kernel System): OpenSOCKS is the best of two fantastic C# -> OS kernel compilers (MOSA and COSMOS) We are open source and aim to make our kernel simple and full of features. OpenSOCKS (Open Shared Objective Collaborative Kernel System) - by the makers of PearOSpelotas: okRadaCode.SwissKnife: SwissKnife is a RadaCode's collection of C# classes that facilitate the overall development and help with stuff like HTML removal, random name and number generation, etc. Simple AutoUpdater: This project is a simple updater.Simple TFS Tool: Simple TFS Tool for getting source from TFSSISAP: SISAPSnippet Compiler Tool Window: Snippet Compiler adds a tool window to the Visual Studio 2010 and 11 Beta where you can type/paste code snippets and try to compile them to see if they workTagomatique: Permet la gestion de fichiers multimédia sur principe des tagstsi2012: Proyecto de TS1 año 2012wbgj: this is weibo projectWindows Phone 7 Text Style Picker: WP7TextStylePicker was created to fill the gaping whole in the SDK: surprisingly, there is no control that would allow setting text properties (Color, Font Family, Font Size, Bold, Italic) - even though this sounds like a very basic task that many applications would need.WPLiveEdu: Windows phone application for browsing Live@Edu calendar

Search Results

Search found 247 results on 10 pages for 'italic'.

Page 9/10 | < Previous Page | 5 6 7 8 9 10 | Next Page >

- by Richard Neil Ilagan

- by John

- by Rodd

- by fusion

- by balexandre

- by fusion

- by Stephen Walther

- by Timmy Kokke

- by Kelsey Nealon

- by MadHatter

- by modosansreves

- by Davide Barison

- by Tim Büthe

- by Kira

- by user1781453

- by Seán McCabe

- by EricR

- by Rowe Morehouse

- by fusion

- by fusion

- by v1n_vampire

- by mortezam

- by mortezam

- by hajan

< Previous Page | 5 6 7 8 9 10 | Next Page >