Search Results

Search found 41718 results on 1669 pages for 'html options'.

facebook twitter digg google delicious technorati stumbleupon myspace wordpress linkedin gmail igoogle windows live tumblr viadeo yahoo buzz yahoo mail yahoo bookmarks favorites email print

Page 52/1669 | < Previous Page | 48 49 50 51 52 53 54 55 56 57 58 59  | Next Page >

  • Store html into MYSql database

    - by jouzef19
    hello I'm try to store String (that contain html ) to mysql database by using Longtext data type. but its always says "You have an error in your SQL syntax". (note : i tried to store normal text , and its work)

    Read the article

  • Styling textbox of an HTML file input

    - by zohair
    Hi, I have an asp.net 2.0 web app where I use C#. I have an HTML file input control that I would like to style, but I can't seem to find a way to do it. I actually wanted to change the color of the textbox. I looked online but I couldn't find any proper solutions. Can anyone help? Thank you.

    Read the article

  • start html page scrolled

    - by salva
    I have an Html page with an scroll ,and I'd like when the page starts (onload) to put the focus in the 60% parox (y axis) of the page. that means to scroll automatically the 60% of the page. is this possible? thankyou

    Read the article

  • Input labels for dynamically loaded HTML content

    - by treznik
    I have a form that is dynamically loaded through AJAX and dumped with innerHTML inside an area of a website. The problem I seem to encounter is that the labels don't seem to point to the inputs they're tied to, when clicked. I'm sure the markup is correct because if I open that form html code separately the labels work. Is there a solution to re-initialize somehow this sort of event natively? I'm not looking into simulating the behavior with JS. Thanks!

    Read the article

  • Html Attribute for Html.Dropdown

    - by kapil
    I am using a dropdown list as follows. <%=Html.DropDownList("ddl", ViewData["Available"] as SelectList, new { CssClass = "input-config", onchange = "this.form.submit();" })%> On its selection change I am invoking post action. After the post the same page is shown on which this drop down is present. I want to know about the HTML attribute for the drop down which will let me preserve the list selection change. But as of now the list shows its first element after the post. e.g. The dropdoen contains elements like 1,2,3,etc. By default 1 is selected. If I select 2, the post is invoked and the same page is shown again but my selection 2 goes and 1 is selected again. How can preserve the selection? Thanks, Kapil

    Read the article

  • Visual Studio HTML Cursor-within-HTML-Element Syntax-highlighting color

    - by David Murdoch
    I can't, for the life of me, figure out how to change grey highlight color in the screenshot below to something that will make the text a little more legible. Does anyone know what the "Display Item" name is that I need to change? To get to the "theme editor" select Tools = Options = Environment = Fonts and Colors. I can't find what to edit. I've also looked through Tools = Options = Text Editor = HTML = Formatting to no avail. In case you are wondering the theme is a slightly modified Coding Instinct Theme

    Read the article

  • Get to know what HTML-button is clicked with PHP, no Name of value available

    - by koko
    I have a wizard with 4 steps and in one of the steps, you can add items. By default, there are 3 time 5 empty input-fields listed. When you click a button, there have to be added some more. The 3 times 5 fields are added by a loop. How can I determine where I have to add some fields (in the first 5 field of the second or the third). I can't use another name for every button, because sometimes there can be more then 3 groups of 5 fields. In my code (PHP), I use the name of the button to know what happened in the form, so the name can't be different for the button in every group ... Further, the whole step is 1 form, so the post can't go to another script ... The value of the button has to be the same for every group. I've been thinking on possible solutions and these came up: On click a javascript adds a value to the post (in a hidden field?) But is this posted with the form? Could it be possible to get the ID of the clicked button? This might be different :-) I need a refresh after the click, so pure javascript isn't a solution either ... It is a very specific question, but I hope someone can give me some direction. Here is the code I'm talking about: <h3><label class="list_list:table_title">Eten</label></h3> <table id="eten"> <thead> <tr> <th>Naam item</th> <th>Aantal</th> </tr> </thead> <tbody> <tr> <td class="item"><input type="text" name="item_1_1" value="" class="inputText" maxlength="64" size="46" tabindex="11"/></td> <td class="amount"><input type="text" name="amount_1_1" value="" class="inputText" maxlength="64" size="10" tabindex="11"/></td> </tr> <tr> <td class="item"><input type="text" name="item_1_2" value="" class="inputText" maxlength="64" size="46" tabindex="12"/></td> <td class="amount"><input type="text" name="amount_1_2" value="" class="inputText" maxlength="64" size="10" tabindex="12"/></td> </tr> <tr> <td class="item"><input type="text" name="item_1_3" value="" class="inputText" maxlength="64" size="46" tabindex="13"/></td> <td class="amount"><input type="text" name="amount_1_3" value="" class="inputText" maxlength="64" size="10" tabindex="13"/></td> </tr> <tr> <td class="item"><input type="text" name="item_1_4" value="" class="inputText" maxlength="64" size="46" tabindex="14"/></td> <td class="amount"><input type="text" name="amount_1_4" value="" class="inputText" maxlength="64" size="10" tabindex="14"/></td> </tr> <tr> <td class="item"><input type="text" name="item_1_5" value="" class="inputText" maxlength="64" size="46" tabindex="15"/></td> <td class="amount"><input type="text" name="amount_1_5" value="" class="inputText" maxlength="64" size="10" tabindex="15"/></td> </tr> </tbody> </table> <input id="list_list:add" type="submit" name="list_list:add" value="voeg extra items toe" class="add" /> <div class="spacer"></div> <h3><label class="list_list:table_title">Drinken</label></h3> <table id="drinken"> <thead> <tr> <th>Naam item</th> <th>Aantal</th> </tr> </thead> <tbody> <tr> <td class="item"><input type="text" name="item_2_1" value="" class="inputText" maxlength="64" size="46" tabindex="21"/></td> <td class="amount"><input type="text" name="amount_2_1" value="" class="inputText" maxlength="64" size="10" tabindex="21"/></td> </tr> <tr> <td class="item"><input type="text" name="item_2_2" value="" class="inputText" maxlength="64" size="46" tabindex="22"/></td> <td class="amount"><input type="text" name="amount_2_2" value="" class="inputText" maxlength="64" size="10" tabindex="22"/></td> </tr> <tr> <td class="item"><input type="text" name="item_2_3" value="" class="inputText" maxlength="64" size="46" tabindex="23"/></td> <td class="amount"><input type="text" name="amount_2_3" value="" class="inputText" maxlength="64" size="10" tabindex="23"/></td> </tr> <tr> <td class="item"><input type="text" name="item_2_4" value="" class="inputText" maxlength="64" size="46" tabindex="24"/></td> <td class="amount"><input type="text" name="amount_2_4" value="" class="inputText" maxlength="64" size="10" tabindex="24"/></td> </tr> <tr> <td class="item"><input type="text" name="item_2_5" value="" class="inputText" maxlength="64" size="46" tabindex="25"/></td> <td class="amount"><input type="text" name="amount_2_5" value="" class="inputText" maxlength="64" size="10" tabindex="25"/></td> </tr> </tbody> </table> <input id="list_list:add" type="submit" name="list_list:add" value="voeg extra items toe" class="add" /> <div class="spacer"></div> <h3><label class="list_list:table_title">Varia</label></h3> <table id="varia"> <thead> <tr> <th>Naam item</th> <th>Aantal</th> </tr> </thead> <tbody> <tr> <td class="item"><input type="text" name="item_3_1" value="" class="inputText" maxlength="64" size="46" tabindex="31"/></td> <td class="amount"><input type="text" name="amount_3_1" value="" class="inputText" maxlength="64" size="10" tabindex="31"/></td> </tr> <tr> <td class="item"><input type="text" name="item_3_2" value="" class="inputText" maxlength="64" size="46" tabindex="32"/></td> <td class="amount"><input type="text" name="amount_3_2" value="" class="inputText" maxlength="64" size="10" tabindex="32"/></td> </tr> <tr> <td class="item"><input type="text" name="item_3_3" value="" class="inputText" maxlength="64" size="46" tabindex="33"/></td> <td class="amount"><input type="text" name="amount_3_3" value="" class="inputText" maxlength="64" size="10" tabindex="33"/></td> </tr> <tr> <td class="item"><input type="text" name="item_3_4" value="" class="inputText" maxlength="64" size="46" tabindex="34"/></td> <td class="amount"><input type="text" name="amount_3_4" value="" class="inputText" maxlength="64" size="10" tabindex="34"/></td> </tr> <tr> <td class="item"><input type="text" name="item_3_5" value="" class="inputText" maxlength="64" size="46" tabindex="35"/></td> <td class="amount"><input type="text" name="amount_3_5" value="" class="inputText" maxlength="64" size="10" tabindex="35"/></td> </tr> </tbody> </table> <input id="list_list:add" type="submit" name="list_list:add" value="voeg extra items toe" class="add" /> <div class="spacer"></div> </div> <div id="formButtons"> <input id="list_info:back" type="submit" name="list_info:back" value="<< Terug" tabindex="11" class="back" /> <input id="list_info:next" type="submit" name="list_info:next" value="Volgende >>" tabindex="12" class="next" /> <input id="list_info:options" type="submit" name="list_info:options" value="Opties" tabindex="13" class="options" /> <input id="list_info:finish" type="submit" name="list_info:finish" value="Voltooien" tabindex="14" disabled="disabled" class="finish" /> </div>

    Read the article

  • Trying to randomise a jQuery content slider

    - by alecrust
    Hi everyone, I'm using a very nice jQuery content slider called Easy Slider on my site that I downloaded from Css Globe. The script is excellent and does just what I want - except I can't make it randomise the list, it always scrolls from left to right or right to left! I'm far from good with JavaScript, so my attempts at solving this have been feeble. Although I'm sure it must be an easy fix! If anyone wouldn't mind taking a glance over the script to see if they can spot what I need to change to make it random it would be greatly appreciated! I've tried contacting the original plugin developer but have had no response yet. The comments on the Easy Slider page didn't bear much fruit either unfortunately. I've pasted the script I'm using on my site below: /* * Easy Slider 1.7 - jQuery plugin * written by Alen Grakalic * http://cssglobe.com/post/4004/easy-slider-15-the-easiest-jquery-plugin-for-sliding * * Copyright (c) 2009 Alen Grakalic (http://cssglobe.com) * Dual licensed under the MIT (MIT-LICENSE.txt) * and GPL (GPL-LICENSE.txt) licenses. * * Built for jQuery library * http://jquery.com * */ (function($) { $.fn.easySlider = function(options){ // default configuration properties var defaults = { prevId: 'prevBtn', prevText: 'Previous', nextId: 'nextBtn', nextText: 'Next', controlsShow: true, controlsBefore: '', controlsAfter: '', controlsFade: true, firstId: 'firstBtn', firstText: 'First', firstShow: false, lastId: 'lastBtn', lastText: 'Last', lastShow: false, vertical: false, speed: 800, auto: false, pause: 7000, continuous: false, numeric: false, numericId: 'controls' }; var options = $.extend(defaults, options); this.each(function() { var obj = $(this); var s = $("li", obj).length; var w = $("li", obj).width(); var h = $("li", obj).height(); var clickable = true; obj.width(w); obj.height(h); obj.css("overflow","hidden"); var ts = s-1; var t = 0; $("ul", obj).css('width',s*w); if(options.continuous){ $("ul", obj).prepend($("ul li:last-child", obj).clone().css("margin-left","-"+ w +"px")); $("ul", obj).append($("ul li:nth-child(2)", obj).clone()); $("ul", obj).css('width',(s+1)*w); }; if(!options.vertical) $("li", obj).css('float','left'); if(options.controlsShow){ var html = options.controlsBefore; if(options.numeric){ html += '<ol id="'+ options.numericId +'"></ol>'; } else { if(options.firstShow) html += '<span id="'+ options.firstId +'"><a href=\"javascript:void(0);\">'+ options.firstText +'</a></span>'; html += ' <span id="'+ options.prevId +'"><a href=\"javascript:void(0);\">'+ options.prevText +'</a></span>'; html += ' <span id="'+ options.nextId +'"><a href=\"javascript:void(0);\">'+ options.nextText +'</a></span>'; if(options.lastShow) html += ' <span id="'+ options.lastId +'"><a href=\"javascript:void(0);\">'+ options.lastText +'</a></span>'; }; html += options.controlsAfter; $(obj).after(html); }; if(options.numeric){ for(var i=0;i<s;i++){ $(document.createElement("li")) .attr('id',options.numericId + (i+1)) .html('<a rel='+ i +' href=\"javascript:void(0);\">'+ (i+1) +'</a>') .appendTo($("#"+ options.numericId)) .click(function(){ animate($("a",$(this)).attr('rel'),true); }); }; } else { $("a","#"+options.nextId).click(function(){ animate("next",true); }); $("a","#"+options.prevId).click(function(){ animate("prev",true); }); $("a","#"+options.firstId).click(function(){ animate("first",true); }); $("a","#"+options.lastId).click(function(){ animate("last",true); }); }; function setCurrent(i){ i = parseInt(i)+1; $("li", "#" + options.numericId).removeClass("current"); $("li#" + options.numericId + i).addClass("current"); }; function adjust(){ if(t>ts) t=0; if(t<0) t=ts; if(!options.vertical) { $("ul",obj).css("margin-left",(t*w*-1)); } else { $("ul",obj).css("margin-left",(t*h*-1)); } clickable = true; if(options.numeric) setCurrent(t); }; function animate(dir,clicked){ if (clickable){ clickable = false; var ot = t; switch(dir){ case "next": t = (ot>=ts) ? (options.continuous ? t+1 : ts) : t+1; break; case "prev": t = (t<=0) ? (options.continuous ? t-1 : 0) : t-1; break; case "first": t = 0; break; case "last": t = ts; break; default: t = dir; break; }; var diff = Math.abs(ot-t); var speed = diff*options.speed; if(!options.vertical) { p = (t*w*-1); $("ul",obj).animate( { marginLeft: p }, { queue:false, duration:speed, complete:adjust } ); } else { p = (t*h*-1); $("ul",obj).animate( { marginTop: p }, { queue:false, duration:speed, complete:adjust } ); }; if(!options.continuous && options.controlsFade){ if(t==ts){ $("a","#"+options.nextId).hide(); $("a","#"+options.lastId).hide(); } else { $("a","#"+options.nextId).show(); $("a","#"+options.lastId).show(); }; if(t==0){ $("a","#"+options.prevId).hide(); $("a","#"+options.firstId).hide(); } else { $("a","#"+options.prevId).show(); $("a","#"+options.firstId).show(); }; }; if(clicked) clearTimeout(timeout); if(options.auto && dir=="next" && !clicked){; timeout = setTimeout(function(){ animate("next",false); },diff*options.speed+options.pause); }; }; }; // init var timeout; if(options.auto){; timeout = setTimeout(function(){ animate("next",false); },options.pause); }; if(options.numeric) setCurrent(0); if(!options.continuous && options.controlsFade){ $("a","#"+options.prevId).hide(); $("a","#"+options.firstId).hide(); }; }); }; })(jQuery); Many thanks again! Alec

    Read the article

  • WordPress contact form email as PDF

    - by lock
    I am using the below code for my WordPress site which is emailing all the form details as an HTML text but I need the details to be written into a PDF first and then have to email the PDF as an attachment. How can I achieve this? This is not a PHP code to use PHP's writePDF modules. So, any idea or any code to implement this? <div style="padding-left: 100px;"> [raw] [contact-form subject="Best Aussie Broker" to="[email protected]"] <div id="main34" style="border: 1px solid black; border-radius: 15px; width: 720px; padding: 15px;"> &nbsp; <h2><span style="color: #ff6600;">Express Application</span></h2> &nbsp; [contact-field label="First Name" type="name" required="true" /] [contact-field label="Last Name" type="text" /] [contact-field label="Email" type="email" required="true" /] [contact-field label="Purpose of Finance?" type="select" options="Home Loan,Refinance,Investment Loan,Debt Consolidation,Other" /] [contact-field label="Your deposit amount" type="text" /] [contact-field label="Amount you need to borrow?" type="text" /] [contact-field label="Brief description of the purpose for finance" type="textarea" required="true" /] <div><label></label> <input class="radio" type="radio" name="19" value="Single Application" onchange="showsingle();" /> <label class="radio">Single Application</label> <div class="clear-form"></div> <input class="radio" type="radio" name="19" value="Joint Application" onchange="showjoint();" /> <label class="radio">Joint Application</label> <div class="clear-form"></div> [contact-field label="Privacy Act" type="checkbox" required="true" /] I have read the Privacy Act 1988 (as Amended) and understand that by selecting the submit button I/we Authorize Best Aussie Broker to act on my/our behalf and manage personal information in relation to this application.<br> <a href="http://googleplex.com.au/pdf.pdf"><img src="http://googleplex.com.au/pdf.png" alt="" /> </a> </div> </div> <div id="single" style="display: none; width: 720px; border: 1px solid black; border-radius: 15px; padding: 15px; margin-top: 10px;"> <div style="padding-top: 10px; width: 720px; text-align: left;"> <h4><span style="color: #ff6600;">Last step then we will get all listed Australian vendors to fight it out for your best deal</span></h4> </div> <div> <label class="select" for="19-date-of-birth">Date of Birth</label> [contact-field label="Day" type="select" options="1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31" /] [contact-field label="Month" type="select" options="January,February,March,April,May,June,July,August,September,October,November,December" /] [contact-field label="Year" type="select" options="2000,1999,1998,1997,1996,1995,1994,1993,1992,1991,1990,1989,1988,1987,1986,1985,1984,1983,1982,1981,1980,1979,1978,197,1976,1975,1974,1973,1972,1971,1970,1969,1968,1967,1966,1965,1964,1963,1962,1961,1960,1959,1958,1957,1956,1955,1954,1953,1952,1951,1950,1949,1948,1947,1946,1945,1944,1943,1942,1941,1940,1939,1938,1937,1936,1935,1934,1933,1932,1931,1930,1929,1928,1927,1926,1925,1924,1923,1922,1921,1920, 1919,1918,1917,1916,1915,1914,1913,1912,1911,1910,1909" /] </div> [contact-field label="Address" type="text" /] [contact-field label="Suburb" type="text" /] [contact-field label="Postcode" type="text" /] <div> [contact-field label="State" type="select" options="VIC,NSW,QLD,SA,WA,TAS,NZ,Other" /] </div> [contact-field label="Best Contact" type="radio" options="Landline,Mobile" /] [contact-field label="Phone Number" type="text" /] [contact-field label="Marital Status" type="select" options="Married,Single,Other" /] [contact-field label="Residential Status" type="select" options="Renting, Home Owned, Home Mortgage, Board, Other" /] [contact-field label="Children/Dependents" type="select" options="0,1,2,3,4,5,6" /] <div></div> [contact-field label="Gross Yearly Income" type="text" /] [contact-field label="Current Employer" type="text" /] <div> <label class="select" for="19-year-of-empl">Time at this employer</label> [contact-field label="Year" type="select" options="0,1,2,3,4,5,6,7,8,9,10,More" /] [contact-field label="Month" type="select" options="0,1,2,3,4,5,6,7,8,9,10,11,12" /] </div> <div style="padding-right: 15px;"></div> </div> <div id="joint" style="display: none; width: 720px; border: 1px solid black; border-radius: 15px; padding: 15px; margin-top: 10px;"> <div style="padding-top: 10px; width: 720px; text-align: left;"> <h4><span style="color: #ff6600;">Last step then we will get all listed Australian vendors to fight it out for your best deal</span></h4> </div> <div style="float: left; width: 320px;"> <div> <label class="select" for="19-date-of-birth1">Date of Birth</label> [contact-field label="Day" type="select" options="1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31" /] [contact-field label="Month" type="select" options="January,February,March,April,May,June,July,August,September,October,November,December" /] [contact-field label="Year" type="select" options="2000,1999,1998,1997,1996,1995,1994,1993,1992,1991,1990,1989,1988,1987,1986,1985,1984,1983,1982,1981,1980,1979,1978,197,1976,1975,1974,1973,1972,1971,1970,1969,1968,1967,1966,1965,1964,1963,1962,1961,1960,1959,1958,1957,1956,1955,1954,1953,1952,1951,1950,1949,1948,1947,1946,1945,1944,1943,1942,1941,1940,1939,1938,1937,1936,1935,1934,1933,1932,1931,1930,1929,1928,1927,1926,1925,1924,1923,1922,1921,1920, 1919,1918,1917,1916,1915,1914,1913,1912,1911,1910,1909" /] </div> [contact-field label="Address" type="text" /] [contact-field label="Suburb" type="text" /] [contact-field label="Postcode" type="text" /] <div> [contact-field label="State" type="select" options="VIC,NSW,QLD,SA,WA,TAS,NZ,Other" /] </div> [contact-field label="Best Contact" type="radio" options="Landline,Mobile" /] [contact-field label="Phone Number" type="text" /] <div></div> <div></div> [contact-field label="Marital Status" type="select" options="Married,Single,Other" /] [contact-field label="Residential Status" type="select" options="Renting, Home Owned, Home Mortgage, Board, Other" /] [contact-field label="Children/Dependents" type="select" options="0,1,2,3,4,5,6" /] <div></div> <div><label class="text" for="netincome">Net Income</label> <input id="netincome" type="text" name="netincome" /> <select id="netincome-dropdown" name="netincome-dropdown"> <option>Monthly</option> <option>Yearly</option> </select></div> [contact-field label="Current Employer" type="text" /] <div> <label class="select" for="19-year-of-empl2">Time at this employer</label> [contact-field label="Year" type="select" options="0,1,2,3,4,5,6,7,8,9,10,More" /] [contact-field label="Month" type="select" options="0,1,2,3,4,5,6,7,8,9,10,11,12" /] </div> </div> <div style="float: right; width: 320px; padding-right: 50px;"> <div> <label class="select" for="19-date-of-birth3">Date of Birth</label> [contact-field label="Day" type="select" options="1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31" /] [contact-field label="Month" type="select" options="January,February,March,April,May,June,July,August,September,October,November,December" /] [contact-field label="Year" type="select" options="2000,1999,1998,1997,1996,1995,1994,1993,1992,1991,1990,1989,1988,1987,1986,1985,1984,1983,1982,1981,1980,1979,1978,197,1976,1975,1974,1973,1972,1971,1970,1969,1968,1967,1966,1965,1964,1963,1962,1961,1960,1959,1958,1957,1956,1955,1954,1953,1952,1951,1950,1949,1948,1947,1946,1945,1944,1943,1942,1941,1940,1939,1938,1937,1936,1935,1934,1933,1932,1931,1930,1929,1928,1927,1926,1925,1924,1923,1922,1921,1920, 1919,1918,1917,1916,1915,1914,1913,1912,1911,1910,1909" /] </div> [contact-field label="Address" type="text" /] [contact-field label="Suburb" type="text" /] [contact-field label="Postcode" type="text" /] <div> [contact-field label="State" type="select" options="VIC,NSW,QLD,SA,WA,TAS,NZ,Other" /] </div> [contact-field label="Best Contact" type="radio" options="Landline,Mobile" /] [contact-field label="Phone Number" type="text" /] <div></div> <div></div> [contact-field label="Marital Status" type="select" options="Married,Single,Other" /] [contact-field label="Residential Status" type="select" options="Renting, Home Owned, Home Mortgage, Board, Other" /] [contact-field label="Children/Dependents" type="select" options="0,1,2,3,4,5,6" /] <div></div> <div><label class="text" for="netincome">Net Income</label> <input id="netincome" type="text" name="netincome" /> <select id="netincome-dropdown" name="netincome-dropdown"> <option>Monthly</option> <option>Yearly</option> </select></div> [contact-field label="Current Employer" type="text" /] <div> <label class="select" for="19-year-of-empl">Time at this employer</label> [contact-field label="Year" type="select" options="0,1,2,3,4,5,6,7,8,9,10,More" /] [contact-field label="Month" type="select" options="0,1,2,3,4,5,6,7,8,9,10,11,12" /] </div> </div> <div style="clear: both;"></div> <div></div> </div> &nbsp; [/contact-form][/raw] </div>

    Read the article

  • AngularJs ng-cloak Problems on large Pages

    - by Rick Strahl
    I’ve been working on a rather complex and large Angular page. Unlike a typical AngularJs SPA style ‘application’ this particular page is just that: a single page with a large amount of data on it that has to be visible all at once. The problem is that when this large page loads it flickers and displays template markup briefly before kicking into its actual content rendering. This is is what the Angular ng-cloak is supposed to address, but in this case I had no luck getting it to work properly. This application is a shop floor app where workers need to see all related information in one big screen view, so some of the benefits of Angular’s routing and view swapping features couldn’t be applied. Instead, we decided to have one very big view but lots of ng-controllers and directives to break out the logic for code separation. For code separation this works great – there are a number of small controllers that deal with their own individual and isolated application concerns. For HTML separation we used partial ASP.NET MVC Razor Views which made breaking out the HTML into manageable pieces super easy and made migration of this page from a previous server side Razor page much easier. We were also able to leverage most of our server side localization without a lot of  changes as a bonus. But as a result of this choice the initial HTML document that loads is rather large – even without any data loaded into it, resulting in a fairly large DOM tree that Angular must manage. Large Page and Angular Startup The problem on this particular page is that there’s quite a bit of markup – 35k’s worth of markup without any data loaded, in fact. It’s a large HTML page with a complex DOM tree. There are quite a lot of Angular {{ }} markup expressions in the document. Angular provides the ng-cloak directive to try and hide the element it cloaks so that you don’t see the flash of these markup expressions when the page initially loads before Angular has a chance to render the data into the markup expressions.<div id="mainContainer" class="mainContainer boxshadow" ng-app="app" ng-cloak> Note the ng-cloak attribute on this element, which here is an outer wrapper element of the most of this large page’s content. ng-cloak is supposed to prevent displaying the content below it, until Angular has taken control and is ready to render the data into the templates. Alas, with this large page the end result unfortunately is a brief flicker of un-rendered markup which looks like this: It’s brief, but plenty ugly – right?  And depending on the speed of the machine this flash gets more noticeable with slow machines that take longer to process the initial HTML DOM. ng-cloak Styles ng-cloak works by temporarily hiding the marked up element and it does this by essentially applying a style that does this:[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak { display: none !important; } This style is inlined as part of AngularJs itself. If you looking at the angular.js source file you’ll find this at the very end of the file:!angular.$$csp() && angular.element(document) .find('head') .prepend('<style type="text/css">@charset "UTF-8";[ng\\:cloak],[ng-cloak],' + '[data-ng-cloak],[x-ng-cloak],.ng-cloak,.x-ng-cloak,' + '.ng-hide{display:none !important;}ng\\:form{display:block;}' '.ng-animate-block-transitions{transition:0s all!important;-webkit-transition:0s all!important;}' + '</style>'); This is is meant to initially hide any elements that contain the ng-cloak attribute or one of the other Angular directive permutation markup. Unfortunately on this particular web page ng-cloak had no effect – I still see the flicker. Why doesn’t ng-cloak work? The problem is of course – timing. The problem is that Angular actually needs to get control of the page before it ever starts doing anything like process even the ng-cloak attribute (or style etc). Because this page is rather large (about 35k of non-data HTML) it takes a while for the DOM to actually plow through the HTML. With the Angular <script> tag defined at the bottom of the page after the HTML DOM content there’s a slight delay which causes the flicker. For smaller pages the initial DOM load/parse cycle is so fast that the markup never shows, but with larger content pages it may show and become an annoying problem. Workarounds There a number of simple ways around this issue and some of them are hinted on in the Angular documentation. Load Angular Sooner One obvious thing that would help with this is to load Angular at the top of the page  BEFORE the DOM loads and that would give it much earlier control. The old ng-cloak documentation actually recommended putting the Angular.js script into the header of the page (apparently this was recently removed), but generally it’s not a good practice to load scripts in the header for page load performance. This is especially true if you load other libraries like jQuery which should be loaded prior to loading Angular so it can use jQuery rather than its own jqLite subset. This is not something I normally would like to do and also something that I’d likely forget in the future and end up right back here :-). Use ng-include for Child Content Angular supports nesting of child templates via the ng-include directive which essentially delay loads HTML content. This helps by removing a lot of the template content out of the main page and so getting control to Angular a lot sooner in order to hide the markup template content. In the application in question, I realize that in hindsight it might have been smarter to break this page out with client side ng-include directives instead of MVC Razor partial views we used to break up the page sections. Razor partial views give that nice separation as well, but in the end Razor puts humpty dumpty (ie. the HTML) back together into a whole single and rather large HTML document. Razor provides the logical separation, but still results in a large physical result document. But Razor also ended up being helpful to have a few security related blocks handled via server side template logic that simply excludes certain parts of the UI the user is not allowed to see – something that you can’t really do with client side exclusion like ng-hide/ng-show – client side content is always there whereas on the server side you can simply not send it to the client. Another reason I’m not a huge fan of ng-include is that it adds another HTTP hit to a request as templates are loaded from the server dynamically as needed. Given that this page was already heavy with resources adding another 10 separate ng-include directives wouldn’t be beneficial :-) ng-include is a valid option if you start from scratch and partition your logic. Of course if you don’t have complex pages, having completely separate views that are swapped in as they are accessed are even better, but we didn’t have this option due to the information having to be on screen all at once. Avoid using {{ }}  Expressions The biggest issue that ng-cloak attempts to address isn’t so much displaying the original content – it’s displaying empty {{ }} markup expression tags that get embedded into content. It gives you the dreaded “now you see it, now you don’t” effect where you sometimes see three separate rendering states: Markup junk, empty views, then views filled with data. If we can remove {{ }} expressions from the page you remove most of the perceived double draw effect as you would effectively start with a blank form and go straight to a filled form. To do this you can forego {{ }}  expressions and replace them with ng-bind directives on DOM elements. For example you can turn:<div class="list-item-name listViewOrderNo"> <a href='#'>{{lineItem.MpsOrderNo}}</a> </div>into:<div class="list-item-name listViewOrderNo"> <a href="#" ng-bind="lineItem.MpsOrderNo"></a> </div> to get identical results but because the {{ }}  expression has been removed there’s no double draw effect for this element. Again, not a great solution. The {{ }} syntax sure reads cleaner and is more fluent to type IMHO. In some cases you may also not have an outer element to attach ng-bind to which then requires you to artificially inject DOM elements into the page. This is especially painful if you have several consecutive values like {{Firstname}} {{Lastname}} for example. It’s an option though especially if you think of this issue up front and you don’t have a ton of expressions to deal with. Add the ng-cloak Styles manually You can also explicitly define the .css styles that Angular injects via code manually in your application’s style sheet. By doing so the styles become immediately available and so are applied right when the page loads – no flicker. I use the minimal:[ng-cloak] { display: none !important; } which works for:<div id="mainContainer" class="mainContainer dialog boxshadow" ng-app="app" ng-cloak> If you use one of the other combinations add the other CSS selectors as well or use the full style shown earlier. Angular will still load its version of the ng-cloak styling but it overrides those settings later, but this will do the trick of hiding the content before that CSS is injected into the page. Adding the CSS in your own style sheet works well, and is IMHO by far the best option. The nuclear option: Hiding the Content manually Using the explicit CSS is the best choice, so the following shouldn’t ever be necessary. But I’ll mention it here as it gives some insight how you can hide/show content manually on load for other frameworks or in your own markup based templates. Before I figured out that I could explicitly embed the CSS style into the page, I had tried to figure out why ng-cloak wasn’t doing its job. After wasting an hour getting nowhere I finally decided to just manually hide and show the container. The idea is simple – initially hide the container, then show it once Angular has done its initial processing and removal of the template markup from the page. You can manually hide the content and make it visible after Angular has gotten control. To do this I used:<div id="mainContainer" class="mainContainer boxshadow" ng-app="app" style="display:none"> Notice the display: none style that explicitly hides the element initially on the page. Then once Angular has run its initialization and effectively processed the template markup on the page you can show the content. For Angular this ‘ready’ event is the app.run() function:app.run( function ($rootScope, $location, cellService) { $("#mainContainer").show(); … }); This effectively removes the display:none style and the content displays. By the time app.run() fires the DOM is ready to displayed with filled data or at least empty data – Angular has gotten control. Edge Case Clearly this is an edge case. In general the initial HTML pages tend to be reasonably sized and the load time for the HTML and Angular are fast enough that there’s no flicker between the rendering times. This only becomes an issue as the initial pages get rather large. Regardless – if you have an Angular application it’s probably a good idea to add the CSS style into your application’s CSS (or a common shared one) just to make sure that content is always hidden. You never know how slow of a browser somebody might be running and while your super fast dev machine might not show any flicker, grandma’s old XP box very well might…© Rick Strahl, West Wind Technologies, 2005-2014Posted in Angular  JavaScript  CSS  HTML   Tweet !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs"); (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })();

    Read the article

  • SQL SERVER – Faster SQL Server Databases and Applications – Power and Control with SafePeak Caching Options

    - by Pinal Dave
    Update: This blog post is written based on the SafePeak, which is available for free download. Today, I’d like to examine more closely one of my preferred technologies for accelerating SQL Server databases, SafePeak. Safepeak’s software provides a variety of advanced data caching options, techniques and tools to accelerate the performance and scalability of SQL Server databases and applications. I’d like to look more closely at some of these options, as some of these capabilities could help you address lagging database and performance on your systems. To better understand the available options, it is best to start by understanding the difference between the usual “Basic Caching” vs. SafePeak’s “Dynamic Caching”. Basic Caching Basic Caching (or the stale and static cache) is an ability to put the results from a query into cache for a certain period of time. It is based on TTL, or Time-to-live, and is designed to stay in cache no matter what happens to the data. For example, although the actual data can be modified due to DML commands (update/insert/delete), the cache will still hold the same obsolete query data. Meaning that with the Basic Caching is really static / stale cache.  As you can tell, this approach has its limitations. Dynamic Caching Dynamic Caching (or the non-stale cache) is an ability to put the results from a query into cache while maintaining the cache transaction awareness looking for possible data modifications. The modifications can come as a result of: DML commands (update/insert/delete), indirect modifications due to triggers on other tables, executions of stored procedures with internal DML commands complex cases of stored procedures with multiple levels of internal stored procedures logic. When data modification commands arrive, the caching system identifies the related cache items and evicts them from cache immediately. In the dynamic caching option the TTL setting still exists, although its importance is reduced, since the main factor for cache invalidation (or cache eviction) become the actual data updates commands. Now that we have a basic understanding of the differences between “basic” and “dynamic” caching, let’s dive in deeper. SafePeak: A comprehensive and versatile caching platform SafePeak comes with a wide range of caching options. Some of SafePeak’s caching options are automated, while others require manual configuration. Together they provide a complete solution for IT and Data managers to reach excellent performance acceleration and application scalability for  a wide range of business cases and applications. Automated caching of SQL Queries: Fully/semi-automated caching of all “read” SQL queries, containing any types of data, including Blobs, XMLs, Texts as well as all other standard data types. SafePeak automatically analyzes the incoming queries, categorizes them into SQL Patterns, identifying directly and indirectly accessed tables, views, functions and stored procedures; Automated caching of Stored Procedures: Fully or semi-automated caching of all read” stored procedures, including procedures with complex sub-procedure logic as well as procedures with complex dynamic SQL code. All procedures are analyzed in advance by SafePeak’s  Metadata-Learning process, their SQL schemas are parsed – resulting with a full understanding of the underlying code, objects dependencies (tables, views, functions, sub-procedures) enabling automated or semi-automated (manually review and activate by a mouse-click) cache activation, with full understanding of the transaction logic for cache real-time invalidation; Transaction aware cache: Automated cache awareness for SQL transactions (SQL and in-procs); Dynamic SQL Caching: Procedures with dynamic SQL are pre-parsed, enabling easy cache configuration, eliminating SQL Server load for parsing time and delivering high response time value even in most complicated use-cases; Fully Automated Caching: SQL Patterns (including SQL queries and stored procedures) that are categorized by SafePeak as “read and deterministic” are automatically activated for caching; Semi-Automated Caching: SQL Patterns categorized as “Read and Non deterministic” are patterns of SQL queries and stored procedures that contain reference to non-deterministic functions, like getdate(). Such SQL Patterns are reviewed by the SafePeak administrator and in usually most of them are activated manually for caching (point and click activation); Fully Dynamic Caching: Automated detection of all dependent tables in each SQL Pattern, with automated real-time eviction of the relevant cache items in the event of “write” commands (a DML or a stored procedure) to one of relevant tables. A default setting; Semi Dynamic Caching: A manual cache configuration option enabling reducing the sensitivity of specific SQL Patterns to “write” commands to certain tables/views. An optimization technique relevant for cases when the query data is either known to be static (like archive order details), or when the application sensitivity to fresh data is not critical and can be stale for short period of time (gaining better performance and reduced load); Scheduled Cache Eviction: A manual cache configuration option enabling scheduling SQL Pattern cache eviction based on certain time(s) during a day. A very useful optimization technique when (for example) certain SQL Patterns can be cached but are time sensitive. Example: “select customers that today is their birthday”, an SQL with getdate() function, which can and should be cached, but the data stays relevant only until 00:00 (midnight); Parsing Exceptions Management: Stored procedures that were not fully parsed by SafePeak (due to too complex dynamic SQL or unfamiliar syntax), are signed as “Dynamic Objects” with highest transaction safety settings (such as: Full global cache eviction, DDL Check = lock cache and check for schema changes, and more). The SafePeak solution points the user to the Dynamic Objects that are important for cache effectiveness, provides easy configuration interface, allowing you to improve cache hits and reduce cache global evictions. Usually this is the first configuration in a deployment; Overriding Settings of Stored Procedures: Override the settings of stored procedures (or other object types) for cache optimization. For example, in case a stored procedure SP1 has an “insert” into table T1, it will not be allowed to be cached. However, it is possible that T1 is just a “logging or instrumentation” table left by developers. By overriding the settings a user can allow caching of the problematic stored procedure; Advanced Cache Warm-Up: Creating an XML-based list of queries and stored procedure (with lists of parameters) for periodically automated pre-fetching and caching. An advanced tool allowing you to handle more rare but very performance sensitive queries pre-fetch them into cache allowing high performance for users’ data access; Configuration Driven by Deep SQL Analytics: All SQL queries are continuously logged and analyzed, providing users with deep SQL Analytics and Performance Monitoring. Reduce troubleshooting from days to minutes with database objects and SQL Patterns heat-map. The performance driven configuration helps you to focus on the most important settings that bring you the highest performance gains. Use of SafePeak SQL Analytics allows continuous performance monitoring and analysis, easy identification of bottlenecks of both real-time and historical data; Cloud Ready: Available for instant deployment on Amazon Web Services (AWS). As you can see, there are many options to configure SafePeak’s SQL Server database and application acceleration caching technology to best fit a lot of situations. If you’re not familiar with their technology, they offer free-trial software you can download that comes with a free “help session” to help get you started. You can access the free trial here. Also, SafePeak is available to use on Amazon Cloud. Reference: Pinal Dave (http://blog.sqlauthority.com)Filed under: PostADay, SQL, SQL Authority, SQL Performance, SQL Query, SQL Server, SQL Tips and Tricks, T SQL

    Read the article

  • Webcast Replay Available: SOA Integration Options for E-Business Suite

    - by BillSawyer
    I am pleased to release the replay and presentation for the latest ATG Live Webcast: SOA Integration Options for E-Business Suite (Presentation)Abhishek Verma, Manager, Applications Technology Group and Rajesh Ghosh, Group Manager, ATG Development discussed the web service and SOA integration options for Oracle E-Business Suite. The presentation covered Oracle's integration tools and technologies, including the Oracle Applications Adapter and the Integrated SOA Gateway.Finding other recorded ATG webcastsThe catalog of ATG Live Webcast replays, presentations, and all ATG training materials is available in this blog's Webcasts and Training section.

    Read the article

  • CUPS - Configuring default printer options

    - by user193661
    I'm using a CUPS printer and trying to set the default options for the printer using /etc/cups/ppd and /etc/cups/printers.conf but I don't see a complete list of available options. Currently I'm trying Option page-top 2 Option page-bottom 2 Option scaling 95 My end goal is getting the printer to stop cutting off the top and bottom page content. I would like to automatically scale the content to fit on the page size being used (default "letter") if possible and if not, resume printing on another page without removing any of the content.

    Read the article

  • SSD options in /etc/fstab stop machine from booting

    - by nbubis
    I just recently installed 12.10 on a new Lenovo T430, and added these options in \etc\fstab: discard, relatime To \sda1 on which \ is installed. When I rebooted, I got an error claiming that it couldn’t read \, and got thrown into a read-only shell, which necessitated booting from a rescue disk to revert to the original fstab. So: What are the correct options for SSD, and how can I make sure I won't get locked out of the system again?

    Read the article

  • HTML overflow:hidden doesn't format text correctly

    - by Rens Groenveld
    I'm working on a website for an American Football team. They have these newsitems on their front page which they can manage through a CMS system. I have a problem with alligning the text inside those news items. Two of the news items look like this: As you can see, the right newsitem text are displayed nicely. But the left cuts it off really bad. You can only see the top half of the text at the last sentence. I use overflow: hidden; to make sure the text doesn't make the div or newsitem bigger. Does anyone have any idea how to solve this through HTML and CSS or should I cut it off serverside with PHP? Here's my code (HTML): <div class="newsitem"> <div class="titlemessagewrapper"> <h2 class="titel" align="center"><?php echo $row['homepagetitel']; ?></h2> <div class="newsbericht"> <?php echo $row['homepagebericht']; ?> </div> </div> <div class="newsfooter"> <span class="footer_author"><a href=""><?php echo get_gebruikersnaam_by_id($row['poster_id']); ?></a></span> <span class="footer_comment"><a href="">Comments <span>todo</span></a></span> <a href="" class="footer_leesmeer">Lees meer</a> </div> </div> And here is the CSS: .newsitem{ float: left; height: 375px; width: 296px; margin: 20px 20px 0px 20px; background-color: #F5F5F5; } .newsitem .titel{ color:#132055; font-size:1.2em; line-height:1.3em; font-weight:bold; margin:10px 5px 5px 5px; padding:0 0 6px 0; border-bottom:1px dashed #9c0001; } .titlemessagewrapper{ height: 335px; overflow: hidden; } .newsitem .newsbericht{ padding:5px 5px 5px 5px; font-size: 0.8em; margin-bottom: 5px; } .newsitem .newsfooter{ width: 100%; height: 25px; background-color: #132055; margin: 0px auto; font-size: 0.8em; padding-top: 5px; margin-top: 10px; border: 1px solid #9c0001; }

    Read the article

  • translating play in HTML to python

    - by aharon
    So, I'd like to represent one of Shakespeare's plays, Hamlet, into the following objects (maybe this isn't the best representation, if so please tell me): class Play(): acts = [] ... def add_act(self, act): acts.append(act) class Act(): scenes = [] ... def add_scene(self, scene): scenes.append(scene) class Scene(): elems = [] def __init__(self, title, setting=""): ... def add_elem(self, elem): elems.append(elem) ... class StageDirection(): # elem def __init__(self, text): ... class Line(): # elem def __init__(self, id, text, character = None): ... # A None character represents a continuation from the previous line # id could be, for example, 1.1.1 There are other methods, of course, for printing and such in each of the classes. The question is, how do I get a structure based on these classes (or something like them) from HTML 4 code that looks like this: <H3>ACT I</h3> <h3>SCENE I. Elsinore. A platform before the castle.</h3> <p><blockquote> <i>FRANCISCO at his post. Enter to him BERNARDO</i> </blockquote> <A NAME=speech1><b>BERNARDO</b></a> <blockquote> <A NAME=1.1.1>Who's there?</A><br> </blockquote> <A NAME=speech2><b>FRANCISCO</b></a> <blockquote> <A NAME=1.1.2>Nay, answer me: stand, and unfold yourself.</A><br> </blockquote> <A NAME=speech3><b>BERNARDO</b></a> <blockquote> <A NAME=1.1.3>Long live the king!</A><br> </blockquote> <A NAME=speech4><b>FRANCISCO</b></a> <blockquote> <A NAME=1.1.4>Bernardo?</A><br> </blockquote> <A NAME=speech5><b>BERNARDO</b></a> <blockquote> <A NAME=1.1.5>He.</A><br> </blockquote> <!-- for more, see the source of shakespeare.mit.edu/hamlet/full.html --> translating that into something like this: play = Play() actI = Act() sceneI = Scene("Scene I", "Elsinore. A platform before the castle.") sceneI.add_elem(StageDirection("Francisco at his post. Enter to him Bernardo.")) sceneI.add_elem(Line("Bernardo", "Who's there?")) ... Of course, I don't expect all the code—but what libraries and, when there aren't libraries, logic should I use? Thanks. (This is for a future opensource project and me learning Python for fun—not homework.)

    Read the article

  • Little Regular Expression (against HTML) help

    - by Marcos Placona
    Hi, I have the following HTML <p>Some text <a title="link" href="http://link.com/" target="_blank">my link</a> more text <a title="link" href="http://link.com/" target="_blank">more link</a>.</p> <p>Another paragraph.</p> <p>[code:cf]</p> <p>&lt;cfset ArrFruits = ["Orange", "Apple", "Peach", "Blueberry", </p> <p>"Blackberry", "Strawberry", "Grape", "Mango", </p> <p>"Clementine", "Cherry", "Plum", "Guava", </p> <p>"Cranberry"]&gt;</p> <p>[/code]</p> <p>Another line</p> <p><img src="http://image.jpg" alt="Array" /> </p> <p>More text</p> <p>[code:cf]</p> <p>&lt;table border="1"&gt;</p> <p> &lt;cfoutput&gt;</p> <p> &lt;cfloop array="#GroupsOf(ArrFruits, 5)#" index="arrFruitsIX"&gt;</p> <p>  &lt;tr&gt;</p> <p> &lt;cfloop array="#arrFruitsIX#" index="arrFruit"&gt;</p> <p>     &lt;td&gt;#arrFruit#&lt;/td&gt;</p> <p> &lt;/cfloop&gt;</p> <p>  &lt;/tr&gt;</p> <p> &lt;/cfloop&gt;</p> <p> &lt;/cfoutput&gt;</p> <p>&lt;/table&gt;</p> <p>[/code]</p> <p>With an output that looks like:</p> <p><img src="another_image.jpg" alt="" width="342" height="85" /></p> What I'm trying to do, is write a regular expression that will remove all the or , and whenever it finds a , it will replace it with a line-break. So far, my pattern looks like this: /\<p\>(.*?)(<\/p>)/g And I'm replacing the matches with: $1\n It all looks good, but it's also replacing the contents inside the [code][/code] tags, which in this case should not replace the tags at all, so as a result, i would lkike to get rid of the tags, when the content isn't inside the [code] tags. I can't ever get negation right, I know it will be something along the lines of \<p\>^\[code*\](.*?)(<\/p>) But obviously this doesn't work :-) Could anyone please lend me a hand with this regex? BTW, I know I shouldn't be using regular expressions to parse HTML at all. I'm fully aware of that, but still, for this specific case, I'd like to use regex. Thanks in advance

    Read the article

facebook twitter digg google delicious technorati stumbleupon myspace wordpress linkedin gmail igoogle windows live tumblr viadeo yahoo buzz yahoo mail yahoo bookmarks favorites email print

< Previous Page | 48 49 50 51 52 53 54 55 56 57 58 59  | Next Page >